score:0

Accepted answer

this is mainly because the animation.oncomplete event is called again when the legend is filtered.

you need to have an extra check like this dataset._meta[0].$filler.visible != false to only show values for only visible datasets.

below is corrected code or fiddle for your reference -> https://jsfiddle.net/x164l2z9/

var ctx = document.getelementbyid("canvas").getcontext("2d");
var nomi = [2017, 2018, 2019];

var mychart = new chart(ctx, {
  type: 'line',
  data: {
    labels: nomi,
    datasets: [{
        label: 'pp pervenuti',
        data: [50, 30, 45],
        backgroundcolor: "#8a0808",
        fill: false,
        bordercolor: "#8a0808",
        borderwidth: 3
      },
      {
        label: 'pp evasi',
        data: [60, 45, 12],
        backgroundcolor: "#0b610b",
        fill: false,
        bordercolor: "#0b610b",
        borderwidth: 3
      },
      {
        label: 'pi pervenuti',
        data: [20, 25, 35],
        backgroundcolor: "#8a0886",
        fill: false,
        bordercolor: "#8a0886",
        borderwidth: 3
      },
      {
        label: 'pi evasi',
        data: [10, 20, 30],
        backgroundcolor: "#0404b4",
        fill: false,
        bordercolor: "#0404b4",
        borderwidth: 3
      }
    ]
  },
  options: {
    legend: {
      display: true,
      position: "bottom"
    },
    hover: {
      animationduration: 0
    },
    animation: {
      oncomplete: function() {

        var ctx = this.chart.ctx;
        ctx.font = chart.helpers.fontstring(chart.defaults.global.defaultfontfamily, 'normal', chart.defaults.global.defaultfontfamily);
        ctx.fillstyle = "black";
        ctx.textalign = 'center';
        ctx.textbaseline = 'bottom';

        this.data.datasets.foreach(function(dataset) {
          if (dataset._meta[0].$filler.visible != false) {
            for (var i = 0; i < dataset.data.length; i++) {
              for (var key in dataset._meta) {
                var model = dataset._meta[key].data[i]._model;
                ctx.filltext(dataset.data[i], model.x, model.y - 5);
              }
            }
          }

        });
      }
    }

  }
});

Related Query

More Query from same tag