Highchart基本条形图:如何知道点击了哪个特定的条形图部分

Highchart basic bar : How to know which specific bar section is clicked?

本文关键字：条形图部条形图本条何知道 Highchart 更新时间：2023-09-26

我有一个包含以下类别和系列的高图：

    xAxis: {
                categories: ['Africa', 'America', 'Asia', 'Europe', 'Oceania'],
                title: {
                    text: null
                }
            },
            yAxis: {
                min: 0,
                title: {
                    text: 'Population (millions)',
                    align: 'high'
                },
                labels: {
                    overflow: 'justify'
                }
            }

series: [{
            name: 'Year 1800',
            data: [107, 31, 635, 203, 2]
        }, {
            name: 'Year 1900',
            data: [133, 156, 947, 408, 6]
        }, {
            name: 'Year 2012',
            data: [1052, 954, 4250, 740, 38]
        }]

指针事件让我知道单击了哪个类别。但是我怎么知道点击了哪一年。假设用户点击了非洲下的1900年，那么我想知道用户点击了类别：非洲和1900年。

您可以使用plotOptions和内部代码来获取相应的项目。

plotOptions: {
            series: {
                cursor: 'pointer',
                point: {
                    events: {
                        click: function () {
                            alert('Category: ' + this.category + '   value: ' + this.y + '  Year :' + this.series.name);
                        }
                    }
                }
            }
        },

工作的JSFiddle可以在这里找到。

this.category：这将返回相应的类别名称。

this.y：这将返回相应的y轴值（数据）。

this.series.name：这将返回相应的系列名称。