AMCharts 簇状柱形图 - 系列名称 onclick 事件

Question

我正在 AMCharts 4 中制作簇状柱形图。该图表有 3 个系列，而且都很好用。

我想设置一个点击事件来提取系列名称和索引，稍后将在 Spring 启动应用程序中传递给@Controller，它将显示更多点击集的详细信息数据.

我已经设法让事件侦听器在每个系列部分工作以提供索引详细信息，但我正在努力提取系列名称（试图避免每个系列单独的 API 端点调用和而是将系列名称作为参数传递）。

 var series = chart.series.push(new am4charts.ColumnSeries())
    series.columns.template.tooltipText = "Result: {name}\nDate: {categoryX}\n#: {valueY}";
    series.dataFields.valueY = 'overall_findings'
    series.dataFields.categoryX = 'date'
    series.dataFields.index=40
    series.name = 'No Findings'
    series.columns.template.fill = am4core.color("#79DE79");
    series.columns.template.stroke = am4core.color("#d2d287");
    series.columns.template.events.on("hit", function(ev) {
        console.log("clicked on ", ev.target.dataItem.name);
        console.log("clicked on ", ev.target.dataItem.categoryX);
    }, this);

尝试 override/assign 每个系列的各种 dataItem 值，看看我是否可以使用任何一个来提取这些信息，但没有运气。有趣的是，在设置上面的工具提示时，我可以将此值作为 'name' 传递 - 也尝试使用 series.columns.* fields

series.columns.template.tooltipText = "Result: {name}\nDate: {categoryX}\n#: {valueY}";

有人知道什么时候在事件中寻找这个值吗？

此致，杰瑞克

Answer 1

可以通过dataItem中的component属性获取关联的series

seriesName = ev.target.dataItem.component.name;

至于索引，如果您要查找系列的索引，可以使用图表系列列表中的indexOf 属性。您可以通过 baseSprite 属性:

访问图表对象

seriesIndex = ev.target.baseSprite.series.indexOf(ev.target.dataItem.component)

如果您要查找与该列关联的数据项的索引，请在系列的 dataItems 列表中调用 indexOf：

dataItemIndex = ev.target.dataItem.component.dataItems.indexOf(ev.target.dataItem);

AMCharts 簇状柱形图 - 系列名称 onclick 事件

AMCharts Clustered column chart - series name onclick event

javascript

amcharts4