本文介绍了ChartJS:更新工具提示的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用ChartJS构建图表.我在multipleTooltipLabel模板中包含了datasets.label,并面临更新问题.更改datasets.label并运行 chart.update()时,工具提示不会更新.我创建了一个 JSFiddle来演示此问题.

I'm having a chart build with ChartJS. I'm including datasets.label in multipleTooltipLabel template and facing an update issue. When changing a datasets.label and running chart.update() the tooltip is not updated. I created a JSFiddle demonstrating the issue.

我用来在工具提示中包含数据集标签的代码:

The code I use to include datasets label in tooltip:

var options = {
  multiTooltipTemplate: "<%=datasetLabel%>: <%= value + ' %' %>"
};

除了该选项外,我还按照 ChartJS用法示例进行操作折线图.

Beside that option I followed ChartJS usage example for Line charts.

更改标签并更新图表:

myNewChart.datasets[0].label = 'updated label';
myNewChart.update();

工具提示中显示的标签未更新...

Label shown in tooltip is not updated...

我查看了ChartJS源代码,发现 showTooltip 函数用未更新的 ChartElements 数组调用.

I had a look in ChartJS source code and figured out that showTooltip function is called with a ChartElements array which was not updated.

更新:我可能缓存了该问题. dataset label point 元素上设置nofollow>,并且在其发生更改时不会更新. showTooltip 在绘制工具提示时使用了此缓存"数据集标签.也许这应该不是StackOverflow上的问题,而是ChartJS的错误报告.

Update: I might cached the issue. label of dataset is set on each point element and not updated if it changes. showTooltip used this "cached" dataset label when drawing a tooltip. Perhaps this should not be a question on StackOverflow but a bug report for ChartJS.

推荐答案

我找到了解决方法:

myNewChart.datasets[0].points.forEach(function(point) {
  point.datasetLabel = 'updated label';
});

这也可能是应该完成的方式. update 方法说您应该设置 myLineChart.datasets [0] .points [2] .value = 50; 来更改值.这令人困惑,因为创建数据集需要 data 属性中的值. points 是在初始化时由 Chart.Line 类生成的.其他图表类型的命名可能有所不同(例如,条形图为 bars ).

This might also be the way it should be done. Chart.js documentation of update method says you should set myLineChart.datasets[0].points[2].value = 50; to change the value. That's confusing cause on creation dataset expects the values in data property. points is generated by Chart.Line Class on init. Naming may be different for other chart types (eg. it's bars for a bar chart).

我不确定是否在某处使用了 myLineChart.datasets [0] .label 值或该值是否可以保持不变.

I'm not quite sure if myLineChart.datasets[0].label value is used somewhere or if could be unchanged.

这篇关于ChartJS:更新工具提示的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!