Hoạt ảnh động cho grafana thông qua biểu đồ apache

Vì vậy, tôi đang sử dụng plugin tùy chỉnh Apache Echarts cho grafana. Tôi đang cố gắng triển khai tính năng chuyển đổi phổ quát của ECharts trong mã JavaScript của mình để tự động chuyển đổi giữa biểu đồ thanh và biểu đồ hình tròn dựa trên khoảng thời gian xác định. Điều này có thể thực hiện được hay tôi chỉ đang lãng phí thời gian của mình?

Những gì tôi đã thử:

Tôi đã sử dụng JS bên dưới để có được hoạt ảnh mong muốn nhưng không có gì được phản ánh trong Grafana.

let intervalData = [];
let systemCount = [];
let isPieChart = false; 

data.series.map((s) => {
  if (s.refId === "A") {
    intervalData = s.fields.find((f) => f.name === "Interval").values;
    systemCount = s.fields.find((f) => f.name === "System Count").values;
  }
});

const colors = [
  '#2b821d',
  '#c12e34',
  '#0098d9',
  '#005eaa',
  '#339ca8',
  '#cda819',
  '#32a487',
  '#e6b600'
];

const barOption = {
  color: colors,
  tooltip: {
    show: true,
  },
  legend: { show: true },
  xAxis: {
    type: 'category',
    data: intervalData,
    name: 'Interval',
    nameLocation: 'middle',
    nameGap: 35,
    axisLabel: {
      fontWeight: 'bold',
    },
  },
  yAxis: {
    type: 'value',
    name: 'System Count',
    nameLocation: 'middle',
    nameGap: 40,
    axisLabel: {
      fontWeight: 'bold',
    },
  },
  series: [
    {
      data: systemCount,
      name: 'System Count',
      type: 'bar',
      smooth: true,
      barWidth: 15,
    },
  ],
};

const pieOption = {
  color: colors,
  tooltip: {
    show: true,
  },
  legend: { show: true },
  dataset: {
    dimensions: ['name', 'count'],
    source: intervalData.map((interval, index) => [interval, systemCount[index]]),
  },
  series: [
    {
      type: 'pie',
      radius: [0, '50%'],
    },
  ],
};

function toggleChartOption() {
  isPieChart = !isPieChart;
  return isPieChart ? pieOption : barOption;
}

setInterval(() => {
  myChart.setOption(toggleChartOption(), true);
}, 2000);