如何在echarts的事件句柄中添加一些参数?

问题描述 投票:0回答:1

我需要在ECharts中点击该行后在后台发送具体的数据。 我的codesandbox在这里https://codesandbox.io/s/stacked-line-chart-forked-u1qxvc?file=/index.js

单击该行后,我们将参数作为回调的参数。 如果我们使用 console.log(parameters),那么在控制台中我们可以看到这些东西:

componentType: "series"
componentSubType: "line"
componentIndex: 4
seriesIndex: 4
seriesName: "Search Engine"
seriesType: "line"
event: Object
type: "click"

我能以某种方式在此信息中添加一些数据吗?

喜欢:

componentType: "series"
componentSubType: "line"
componentIndex: 4
seriesIndex: 4
seriesName: "Search Engine"
seriesType: "line"
event: Object
type: "click"
newData: [1, 2, 3]

然后我可以从参数中获取这个新数据并将其发送到后端。

echarts
1个回答
0
投票

额外的数据可以存储在datasets中,然后在点击时检索。
另请查看other attributes to be retrieved in params.
示例 - 带有附加数据的“更多”列。

option = {
  dataset: {
    source: [
      ['score', 'amount', 'product', 'more'],
      [89.3, 58212, 'Matcha Latte','A'],
      [57.1, 78254, 'Milk Tea','B'],
      [74.4, 41032, 'Cheese Cocoa','C'],
      [50.1, 12755, 'Cheese Brownie','D'],
      [89.7, 20145, 'Matcha Cocoa','E'],
      [68.1, 79146, 'Tea','F'],
    ]
  },
  grid: { containLabel: true },
  xAxis: { },
  yAxis: { type: 'category' },
  series: [
    {
      type: 'bar',
      encode: {
        x: 'amount',
        y: 'product'
      }
    }
  ]
};
myChart.on("click", (params) => { // "series.bar",
  console.log(params.data[3]); // retrieve 'more' column content
});
© www.soinside.com 2019 - 2024. All rights reserved.