Highchart - событие OnClick, получить «категорию» и «имя» из гистограммы с накоплением

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

Answer 2

Вам нужно отладить его, попробуйте запустить console.log(this) на прослушивателе событий, после чего вы сможете найти свойства, которые вы ищете. Самый простой способ сделать это - посмотреть на консоли браузера, в которой вы запускаете приложение.

Это должно быть в таком объекте, как это:

this.chart.series[index].name