javascript - Is it possible to animate the hidden/shown element when clicking its label in the legend in ChartJs Bubble Chart?

Question

I've been searching everywhere for a way to animate my bubble chart when an element is shown/hidden but couldnt find a solution anywhere. I tried using:

animation: {
  duration: 2000,
  show: {
    duration: 1000,
    x: {
      from: 0
    },
    y: {
      from: 0
    }
  },
  hide: {
    duration: 1000,
    x: {
      to: 0
    },
    y: {
      to: 0
    }
  }
},

as suggested by some websites but it doesnt work.

I have a custom legend with the following callback function:

function legendClickCallback(event) {
    var event = event || window.event;
    var target = event.target || event.srcElement;
    while (target.nodeName !== 'LI') {
        target = target.parentElement;
    }
    var parent = target.parentElement;
    var chartId = parseInt(parent.classList[0].split("-")[0], 10);
    var chart = Chart.instances[chartId];
    var indexData = parseInt($(target).attr('indexData'));
    var meta = chart.getDatasetMeta(indexData);
    meta.hidden = meta.hidden == null ? !chart.data.datasets[indexData].hidden : null;

    chart.update();
};

question from:https://stackoverflow.com/questions/66048657/is-it-possible-to-animate-the-hidden-shown-element-when-clicking-its-label-in-th

Answer 1

Waitting for answers