首先,在options配置中添加一个具有labels的图表选项。然后,使用onDataPointClicked事件来获取标签的索引。最后,在控制台中输出所选标签的文本。
示例代码:
// 定义图表选项 var options = { chart: { type: 'bar', }, series: [{ data: [20, 30, 40, 50, 60, 70, 80, 90], }], labels: ['Apple', 'Banana', 'Cherry', 'Date', 'Eggfruit', 'Fig', 'Grapes', 'Honey'], plotOptions: { bar: { horizontal: false, } }, };
// 渲染图表 var chart = new ApexCharts(document.querySelector("#chart"), options); chart.render();
// 添加事件监听器 chart.addEventListener('dataPointClick', function(event, chartContext, { seriesIndex, dataPointIndex, w }) { console.log(options.labels[dataPointIndex]); });