如何在chart.js的插件部分访问getDatasetMeta

时间:2019-07-17 10:21:03

标签: javascript chart.js

我试图显示X轴下方堆积的条形图的总和。为此,我直接将其绘制在画布上,因为在chart.js文档中找不到其他方法。

通过使用以下函数并在动画完成时调用它,我已经成功实现了这一点。但是,我希望在图表加载完成后调用它,而不是在动画完成时调用它,因为它每次都会在悬停时重新加载函数。

 animation: {
            onComplete: function(){

              // draw total count

              var chartInstance = this.chart;
              var ctx = chartInstance.ctx;
                this.data.datasets[0].data.forEach(function(data, index) {
                  var total = data + this.data.datasets[1].data[index];

                  var meta = chartInstance.controller.getDatasetMeta(1);
                  var posX = meta.data[index]._model.x - 20;
                  var posY = chartInstance.height - 45;

                  ctx.fillStyle = "#554344";                      
                  ctx.fillText(total, posX,  posY);
                  console.log(chartInstance);
                }, this);



            }
          }

我尝试使用相同的代码,并在“插件”部分中创建了一个新插件。但是,我无法在插件部分访问getDatasetMeta。我在控制台中收到错误消息,即getDatasetMeta返回null。我在插件部分评论了代码。 https://jsfiddle.net/sohail710/d9v5p8jk/8/

0 个答案:

没有答案