javascript - 在 ChartJS 的工具提示中计算值

标签 javascript tooltip chart.js

我正在使用 chartJS 来显示包含 2 个或有时 3 个数据集的数据。

我能否让它不仅显示 tooltipItem.yLabel,还显示 yLabel (dataset1/(dataset1+dataset2)) 总量的百分比? 我想把这个值放在 afterLabel 中。

ChartJS 选项代码:

tooltips : {

    callbacks : {

        label : function(tooltipItem, data) {
            return data.datasets[tooltipItem.datasetIndex].label + ': ' + tooltipItem.yLabel;
        },
        afterLabel : function(tooltipItem, data) {
            return dataset1/(dataset1+dataset2);
        },
    }
}

我的“Y”数据集是数字数组。 X 数据集是日期数组。 我似乎无法弄清楚 chart.min.js 如何获取这些值。

最佳答案

我设法做了我想做的事,感谢@Kubilay Karpat 让我想到了如何找到所需的值。我会 +rep 你,但我没有足够的能力这样做。

afterLabel : function(tooltipItem, data) {
    var total = 0;
    total = parseInt(data.datasets[0].data[tooltipItem.index]) + parseInt(data.datasets[1].data[tooltipItem.index]);                    
    var percentage = data.datasets[tooltipItem.datasetIndex].data[tooltipItem.index] / total * 100;
    var percentage = percentage.toFixed(2);
    return percentage + " %";
},

关于javascript - 在 ChartJS 的工具提示中计算值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38654524/

相关文章:

javascript - 为什么我的按钮不起作用?

javascript - ChartJS onclick填充区域(雷达图)

javascript - 如何为 jvectormap jquery 插件生成新 map ?

javascript - 通过 JavaScript 将输出显示到多个类

objective-c - 在 Cocoa 中同时显示多个工具提示

tooltip - 没有值时如何禁用 Chart JS 工具提示?

javascript - Chart.js 属性 'type' 的类型不兼容。类型 'string' 不可分配给类型 '"行” | "bar"| "scatter"

javascript - 添加新 HTML 项目后丢失事件触发

javascript - Angular 4 无法在我的组件中运行 WaveSurfer

css - 鼠标跟随 css 工具提示示例