我如何设置代码,将没有悬停效果,悬停选项,(悬停)链接等图表?
我使用chart.js。下面是我的代码,我在那里设置饼图。
超文本标记语言..
<div id="canvas-holder" style="width:90%;">
<canvas id="chart-area" />
</div>
...还有...
$(document).ready(function () {
var config = {
type: 'pie',
data: {
datasets: [{
data: [60,20],
backgroundColor: [
"#ddd",
"#58AC1C"
],
label: 'Dataset 1'
}],
labels: [
"Bla1 ",
"Bla2 "+
]
},
options: {
responsive: true
}
};
window.onload = function() {
var ctx = document.getElementById("chart-area").getContext("2d");
window.myPie = new Chart(ctx, config);
};
});
8条答案
按热度按时间8ljdwjyq1#
为了从vanilla chart.js中删除所有悬停
styles/tooltips
:Chart.js正在监视画布上的所有
mousemove
事件,它在画布中示例化了您的图表。将悬停“mode”设置为null似乎覆盖了画布查找匹配元素以将激活的:hover
类分配给这些元素的所有方式。工具提示事件看起来是独立的,所以我不得不使用这两行来使图表有效地保持静态。
请注意,初始动画仍然适用于具有这些选项的图表。
更新:最新的Chart.js已经重新捆绑了悬停被“监听”的方式:
将“events”选项设置为空列表(而不是
['click', 'hover', etc]
)会使图表变为blind'/static
,因为它不会侦听任何事件。2exbekwf2#
你可以试试
您还可以使用以下链接
http://jsfiddle.net/TZq6q/298/
mctunoxg3#
还有一个选择
rryofs0p4#
刚刚使用
只需删除其中一个您想要删除的文件。
tvokkenx5#
截至2020年
只需在选项对象中输入
tooltips: false
jk9hmnmh6#
您可以尝试以下操作:
rkue9o1l7#
在我的情况下,我需要禁用只有胡佛背景颜色的变化,保持工具提示
如果你不需要工具提示你可以选择这个选项
guicsvcw8#
如果您想要防止鼠标悬停在任何系列上时产生任何影响,则应禁用
tooltip
和hover
状态。您可以这样做:(模板取自Highcharts文件)。
希望有帮助:)