Chart.js不需要的工具提示出现在图例中

著名AV8er

我有一个tooltip功能可以帮助我以不同于股票的方式显示图表中的信息。到目前为止,它对我来说效果很好,但是它会导致为图例显示工具提示。我希望在保持不同键的单击功能的同时,不显示该内容。

这是我的tooltips发现options

        tooltips: {
            mode: 'index',
            intersect: false,
            callbacks: {
                label: function(tooltipItem, data) {
                    if((tooltipItem.yLabel) >= 1000000){
                        return data.datasets[tooltipItem.datasetIndex].label + ": $" + money_round((tooltipItem.yLabel)/1000000)+" M";
                    }else if((tooltipItem.yLabel) >= 1000){
                        return data.datasets[tooltipItem.datasetIndex].label + ": $" + money_round((tooltipItem.yLabel)/1000)+" K";
                    }else{
                        return data.datasets[tooltipItem.datasetIndex].label + ": $" + (tooltipItem.yLabel);
                    }
                }
            }
        },

在此处输入图片说明

我也在寻找一种方法,使tooltips显示的内容悬停在项目的左侧,并且/或者减少从光标到显示项目的距离,tooltip以防止tooltip在不需要时弹出。

猎头者凯夫

对于工具提示位置,您可以使用,xAlign: 'right'但是您必须确保在图表的左侧有足够的空间,因为工具提示将始终显示在该点的左侧。

使用时,“减小光标到显示工具提示的项目的距离”是不可能的,intersect: false因为它将始终使用此选项显示工具提示。

intersect: true对于工具提示之类的事件,我会结合使用(或直接忽略它,因为这是默认设置)并增加点击半径。

elements: {
  point: {
    hitRadius: 20
  }
},

这是一个JSBin来演示这些选项。

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章