如何在 amcharts 4 中为 LineSeries 添加 click\hit 事件?
How to add a click\hit event for LineSeries in amcharts 4?
我想知道如何在 amcharts 4 中获取X\Y 单击的行项目的项目详细信息。
我这里有代码:
https://stackblitz.com/edit/angular-playground-3qpqlq
series2.segments.template.events.on("hit", (ev) => {
alert('line clicked');//this gets triggered
//but how to i get the line item details here, like X axis and Y axis
//value of the clicked point of the line?
}, this);
LineSeries 数据项不像列那样直接从 hit
事件中获取。您必须查看事件的 target.dataItem.component.tooltipDataItem.dataContext
对象才能获得单击项目符号的信息:
series2.segments.template.interactionsEnabled = true;
series2.segments.template.events.on(
"hit",
ev => {
var item = ev.target.dataItem.component.tooltipDataItem.dataContext;
alert("line clicked on: " + item.country + ": " + item.marketing);
},
this
);
也许情况有所改善,因为您现在可以通过
访问它
bullet.events.on('over', (ev: any) => {
const val = ev.target.dataItem.dataContext.value;
this.dosomethingwith(val)
}, this);
不用子弹也可以。只需将 Cursor 添加到图表,监听 "hit" 事件,series.tooltipDataItem 是当前悬停的光标。
chart.cursor = new am4charts.XYCursor();
chart.events.on("hit", function(){
console.log(series.tooltipDataItem);
})
https://codepen.io/team/amcharts/pen/de5de2f65752517c07afb4ffe7e110ef
我想知道如何在 amcharts 4 中获取X\Y 单击的行项目的项目详细信息。
我这里有代码: https://stackblitz.com/edit/angular-playground-3qpqlq
series2.segments.template.events.on("hit", (ev) => {
alert('line clicked');//this gets triggered
//but how to i get the line item details here, like X axis and Y axis
//value of the clicked point of the line?
}, this);
LineSeries 数据项不像列那样直接从 hit
事件中获取。您必须查看事件的 target.dataItem.component.tooltipDataItem.dataContext
对象才能获得单击项目符号的信息:
series2.segments.template.interactionsEnabled = true;
series2.segments.template.events.on(
"hit",
ev => {
var item = ev.target.dataItem.component.tooltipDataItem.dataContext;
alert("line clicked on: " + item.country + ": " + item.marketing);
},
this
);
也许情况有所改善,因为您现在可以通过
访问它bullet.events.on('over', (ev: any) => {
const val = ev.target.dataItem.dataContext.value;
this.dosomethingwith(val)
}, this);
不用子弹也可以。只需将 Cursor 添加到图表,监听 "hit" 事件,series.tooltipDataItem 是当前悬停的光标。
chart.cursor = new am4charts.XYCursor();
chart.events.on("hit", function(){
console.log(series.tooltipDataItem);
})
https://codepen.io/team/amcharts/pen/de5de2f65752517c07afb4ffe7e110ef