javascript - Highchart-OnClick事件，从堆叠条形图中获取 "category"和 "name"

Question

我有一个 Highchart 堆叠图表，其类别和数据集如下:

categories =["Clark","Steven","Steve","Robert","Max"]
series =[{
name: "Wins"
data: [0, 0, 0, 0, 0]
},
{
name: "Losses"
data: [0, 0, 0, 0, 0]
},
{
name: "Open"
data: [22, 9, 8, 7, 7]
}]

当前的输出可以在下面的屏幕截图中看到。

我已经通过文档了解了如何在堆叠图表的不同部分上创建单击事件。然而 - 我特别想将个人的名字(在“类别”集中找到和“名称”属性(胜利，失败，开放)传递给一个函数 - 最终在我的 React 应用程序中设置“状态”。

这可能吗？如何在同一函数中访问这两个变量>

感谢您的宝贵时间!

Answer 1

以下是如何触发自定义函数并将类别和名称作为参数传递的示例。

演示:https://jsfiddle.net/BlackLabel/sycqfv9e/

  plotOptions: {
    series: {
      point: {
        events: {
          click() {
            console.log(this.series.name)
            customFun(this.category, this.series.name)
          }
        }
      }
    }
  },

如果您想以这种方式更新 React 应用程序中的状态，请在我可以处理的在线编辑器上重现您当前的工作。您可以使用此模板:https://stackblitz.com/edit/react-nwseym?file=index.js