从未调用过chart.js图例标签的“filter”函数

1bqhqjot  于 2022-11-07  发布在  Chart.js
关注(0)|答案(2)|浏览(233)

如标题所示,我有一个带有图例的chart.js图表。我需要过滤各个项目,但过滤函数从未被调用。我的代码如下:

var theChart = new Chart(canvas, {
      type: 'scatter',
      data: {
        labels: labels,
        datasets: datasets
      },
      options: {
        legend: {
          display: true,
          labels: {
            generateLabels: function(a) {
              console.log("generateLabels");
            },
            filter: function(item, chart) {
                console.log("filter");
                return false;
            }
          }
        }
      }
    });

generateLabels在我没有调用任何东西的情况下就被记录了,但是filter从来没有被记录过。另外,因为我返回了false,所以图例应该不会出现,但是它仍然出现了。
一把小提琴再现了这个问题:http://jsfiddle.net/7bxdwfc0/1/
我不知道为什么这个函数没有被自动调用,因为其他标签函数被自动调用了。

ds97pgxw

ds97pgxw1#

也许应该更多的是一个评论而不是一个答案,但我正在玩你的小提琴,并删除了你的cdn为chart.js从小提琴,并添加了脚本标记的cdn(2.8.0)。这实际上使过滤器函数执行,并且看起来是这样工作的,虽然散点图中连接点的线随之消失。如果你只是使用Fiddle进行开发,你可能会检查一下,或者检查您正在使用的chart.js的版本。
我从这里抓起一个:Chart.js CDN's
我可以多弹一点小提琴,把它保存起来,只是为了让你知道我在说什么。
第一个
把它放在一个代码片段中。奇怪的是,即使你有一个数据集,过滤器也会运行两次。顺便说一句,你的小提琴和你的例子不同。

egdjgwm8

egdjgwm82#

我意识到你需要把过滤器放在标签下,而不仅仅是图例,否则它就不会工作。

plugins: {
        legend: {
            display:  true,
            position: 'right',
            labels: {
            filter: function(legendItem, data) {
                if (legendItem.index<6) {
                return legendItem}
                //console.log(legendItem.index)

            }},
        }
            //display:  true,
            //position: 'right',
            //font:{size:8},

    }

相关问题