可点击的自定义图例angular-chart.js条形图

时间:2017-04-25 08:07:03

标签: angularjs chart.js chart.js2

我正在尝试为条形图创建自定义图例。这是我尝试这样做的方式

                      generateLabels: function (chart) {
                      if (chart.data.labels.length && chart.data.datasets.length) {
                          return chart.data.labels.map(function (label, i) {
                              var meta = chart.getDatasetMeta(0);
                              var ds = chart.data.datasets[0];
                              return {
                                  text: $scope.languagesOfCurrentSiteObject[i].localizedName,
                                  fillStyle: chart.data.datasets[0].backgroundColor[i],
                                  hidden: isNaN(chart.data.datasets[0].data[i]) || meta.data[i].hidden,
                                  // Extra data used for toggling the correct item
                                  index: i
                              };
                          });
                      } else {
                          return [];
                      }
                  },  

它创造得很好,但当我点击我的图例的某些文字来隐藏点击的数据时,我得到了这样的错误

  

ncaught TypeError:无法读取未定义的属性“_meta”       在23.module.exports.Chart.Controller.getDatasetMeta

它出现在库方法

        onClick: function(e, legendItem) {
        var index = legendItem.datasetIndex;
        var ci = this.chart;
        var meta = ci.getDatasetMeta(index);

        // See controller.isDatasetVisible comment
        meta.hidden = meta.hidden === null? !ci.data.datasets[index].hidden : null;

        // We hid a dataset ... rerender the chart
        ci.update();
    },

在这一行var meta = ci.getDatasetMeta(index); beacouse中我只能使用index == 0的方法。 如果我设置index = 0然后我在下一行中得到错误,那么dataSets在数组中只有一个元素,然后在数据的elemenet内部,但只有不属于隐藏的属性值。

0 个答案:

没有答案