highcharts - 在 Highcharts 中突出显示区域

Question

我需要在列附近选择区域。
单击时如何使区域和列突出，就像将鼠标悬停在它上面一样。

这是我的例子:
https://jsfiddle.net/alexserden/wq6j0tnp/9/

$(function () {
    let chart = Highcharts.chart('bar', {
        tooltip: {
            shared: true,
            hideDelay:100,
            useHTML: true,
            outside: true,
            style: {
                fontSize: "13px",
                color: '#505050'
            }
        },
        credits: {
            enabled: false
        },
        plotOptions: {
            column: {
                dataLabels: {
                    enabled: false,
                    style: {
                        fontSize: '13px',
                        fontWeight: 'bold',
                        textOutline: undefined,
                        color: '#505050'
                    }
                }
            },
            ...
        },
        ...
    }
});

Answer 1

您需要为点击添加一个事件处理程序:

                series: {
                    cursor: 'pointer',

                    marker: {
                        enabled: false
                    },
                    point: {
                      events: {
                          click: function () {
                              // Handle selection
                          }
                      },
                    }
                }

在这个事件中你需要处理区域选择，有一个类似的帖子 here .所选区域是一个类别。 ( API reference )

点击事件的 API 文档: https://api.highcharts.com/highcharts/plotOptions.area.point.events.click