chart.js remove on hover effect

xmq68pz9 于 12个月前发布在 Chart.js

关注(0)|答案(2)|浏览(131)

当你将鼠标悬停在chart.js中的条形图上时，它会变成一个较浅的颜色。我如何关闭它，使它始终保持正常的颜色？
这是它通常的样子：

这是当你越过任何一个条形图时的样子：

这是我用来显示图表的代码：

data-scales='{"yAxes": [{
   "ticks": { 
       "beginAtZero": "true", 
       "max": 3,
       "stepSize": 1,
       "fontSize": 0,
       "mirror": "true"
   }
   }],
   "xAxes": [{
       "barPercentage": 0.5
   }]
}' 
data-hide='["gridLinesX","tooltips", "legend"]'

字符串

chart.js

来源：https://stackoverflow.com/questions/43028827/chart-js-remove-on-hover-effect

2条答案

按热度按时间

1szpjjfi1#

只需将hoverBackgroundColor属性设置为与backgroundColor相同的值。然后悬停时不会更改条形图的颜色。
下面是一个使用hoverBackgroundColor的数据对象的示例。

var data = {
    labels: ["January", "February", "March", "April", "May", "June", "July"],
    datasets: [
        {
            label: "My First dataset",
            backgroundColor: [
                'rgba(255, 99, 132, 0.2)',
                'rgba(54, 162, 235, 0.2)',
                'rgba(255, 206, 86, 0.2)',
                'rgba(75, 192, 192, 0.2)',
                'rgba(153, 102, 255, 0.2)',
                'rgba(255, 159, 64, 0.2)'
            ],
            hoverBackgroundColor: [
                'rgba(255,99,132, 0.2)',
                'rgba(54, 162, 235, 0.2)',
                'rgba(255, 206, 86, 0.2)',
                'rgba(75, 192, 192, 0.2)',
                'rgba(153, 102, 255, 0.2)',
                'rgba(255, 159, 64, 0.2)'
            ],
            borderWidth: 1,
            data: [65, 59, 80, 81, 56, 55, 40],
        }
    ]
};

字符串

赞(0）回复(0）举报 12个月前

lsmepo6l2#

如果你想禁用悬停效果并隐藏工具提示，请从配置中删除悬停事件：http://www.chartjs.org/docs/latest/general/interactions/events.html
我猜你不想要任何事件（就像我在我的图表上做的那样），所以在你的选项中传递这个

options: { events: [] }

字符串
--编辑--见下文，您应该执行以下操作以避免他们现在给予的警告。

options: { events: null }

型

赞(0）回复(0）举报 12个月前

我来回答

chart.js remove on hover effect

2条答案

相关问题

热门标签

最新问答