在ChartJS LineGraph中隐藏点

gjmwrych  于 2023-08-05  发布在  Chart.js
关注(0)|答案(4)|浏览(137)

最初,我将每个点的填充颜色设置为完全透明。如果我把鼠标移到图表上,点就会弹出来。我想隐藏所有的点,使线图平滑。

tjrkku2a

tjrkku2a1#

可以通过在配置选项中设置点的半径属性来实现此目的,如下所示:

var chartConfig = {
            type: 'line',
            options: {
                elements: {
                    point:{
                        radius: 0
                    }
                }
            }
        }

字符串
点的工具提示也将消失。

vyswwuz2

vyswwuz22#

您可以将pointRadius设置为零。

var myChart = new Chart(
    ctx, {
        type: 'line',
        data: {
            labels: [...]
            datasets: [
              {
                data: [...],
                pointRadius: 0,  # <<< Here.
              }
            ]
        },
        options: {}
    })

字符串

nafvub8i

nafvub8i3#

我也有同样的问题,但我想保持悬停选项活动。这是我的解决方案:

const config = {
        type: 'line',
        data: {
            datasets:[{
                label: 'Température',
                borderColor: 'rgb(255, 99, 132)',
                data: tempE,
                pointStyle: 'rect',
            }]
        },
        options: {
            elements:{
                point:{
                    borderWidth: 0,
                    radius: 10,
                    backgroundColor: 'rgba(0,0,0,0)'
                }
            }
        }
    };

字符串

7ivaypg9

7ivaypg94#

在版本4中,我删除这些点并保留工具提示的实际方法是将pointStyle属性设置为false。是官方文档中提供的列表中的最后一个选项。
代码可能是这样的:

const chart = new Chart('canvas-id', {
    type: 'line',
    data: {
        label: 'Some label',
        data: [...],
        pointStyle: false
    }
});

字符串

相关问题