【问题标题】:ChartJS Update Tooltip programmatically in V2ChartJS 在 V2 中以编程方式更新工具提示
【发布时间】:2020-04-19 19:22:19
【问题描述】:

在JS中更新图表时,不会更新通过修改回调而改变的工具提示。如何以编程方式更改它们?

举个例子,这是我在设置新图表时使用的代码:

tooltips: {
    intersect: false,
    callbacks: {
        title: function(tooltipItem, data) {
        //Return value for title
        return 'Second: ' + tooltipItem[0].xLabel;
    },
 label: function(tooltipItem, data) {
   var datasetLabel = data.datasets[tooltipItem.datasetIndex].label || 'Other';
   var label = values[tooltipItem.index];
   return datasetLabel + ': ' + label+'%';
 }

} }

使用新数据更新图表时现在发生的情况是图表中的数据已正确更新,但工具提示值仍与以前的数据相同。那么如何以编程方式设置这些工具提示标签呢?

在 chartJS 的 V1 上有一个非常相似的问题,但我认为它没有帮助,因为 V2 正确更改了“标签”(不是工具提示中的标签): ChartJS: Update tooltip

【问题讨论】:

    标签: javascript chart.js


    【解决方案1】:

    我找到了答案:

       var newTooltipConfig = {
           //mode: "dataset",
           intersect: false,
           callbacks: {
               title: function(tooltipItem, data) {
               //Return value for title
               return 'Second: ' + tooltipItem[0].xLabel;
           },
            label: function(tooltipItem, data) {
                var datasetLabel = data.datasets[tooltipItem.datasetIndex].label || 'Other';
                var label = values[tooltipItem.index];
                return datasetLabel + ': ' + label+'%';
        }
        }
        };
        linechart.options.tooltips = newTooltipConfig;
        linechart.update();
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2010-09-08
      • 2011-03-31
      • 2021-12-30
      • 1970-01-01
      • 1970-01-01
      • 2012-11-15
      • 1970-01-01
      相关资源
      最近更新 更多