Chartjs 在标签中显示具有不同单位的多个信息

Question

我知道如何显示多个信息。标签中的单位相同 by
multiTooltipTemplate: "<%=datasetLabel%> : <%= value %>%"
结果如下：
[]信息 A:50%
[]InfoB:50%

但我现在尝试用不同的单位显示信息，例如：
[]信息 A:50%
[]InfoB:50$

我该怎么做？

Answer 1

按标签更改工具提示模板

您可以使用 valuesObject 的 label 属性来计算索引并使用它来选择您的交易品种，就像这样

Chart.mySymbols = ['!', '@', '#', '$', '%', '^', '&'];

var ctx = document.getElementById("myChart").getContext("2d");
var myChart = new Chart(ctx).Line(window.data, {
    multiTooltipTemplate: "<%=datasetLabel%> : <%= value %><%= Chart.mySymbols[window.data.labels.indexOf(label)] %>"
});

请注意，data 和 mySymbols 集合都是全局可引用对象的属性（在本例中为 window 和 Chart，但它可以是任何全局对象） .这是因为只有 valuesObject 被注入到 template 函数中。除非你想更改库代码，否则使用全局对象将是这样做的方法（但是，请注意它不是好的设计）。

Fiddle - http://jsfiddle.net/z1nfqhfn/

按数据集更改工具提示模板

如果你想通过数据集做类似的事情，那就是

Chart.mySymbols = ['°C', '%'];

var ctx = document.getElementById("myChart").getContext("2d");
var myChart = new Chart(ctx).Line(window.data, {
    multiTooltipTemplate: "<%=datasetLabel%> : <%= value %><%= Chart.mySymbols[window.data.datasets.map(function(e) { return e.label }).indexOf(datasetLabel)] %>"
});

Fiddle - http://jsfiddle.net/fnu0dyd2/

Chartjs 在标签中显示具有不同单位的多个信息

Chartjs display multiple info with different units in label

javascript

label

chart.js

按标签更改工具提示模板

按数据集更改工具提示模板