React Highcharts меняет цвет границы выбранного столбца из локального состояния

Question

У меня есть столбчатая диаграмма реагирования старших графиков и таблица, показывающая одни и те же данные, и я пытаюсь отобразить один и тот же выбранный элемент в обоих компонентах.Поэтому, когда строка выделена в таблице, соответствующий столбец должен изменить цвет границы.

Мне удалось получить таблицу для обновления из события щелчка на диаграмме, установив состояние, подобное этому

const plotOptions = {
  series: {
    point: {
      events: {
        click: e => this.setState({selectedColumn: e.point.x})
      }
    }
  }
}

<HighchartsChart plotOptions={plotOptions}>
...
</HighchartsChart >

, но я не знаю, как обновить диаграмму с помощьюсвойство состояния.

Я пытался найти выбранные свойства в документах старшей диаграммы, но я не нашел ничего, что решило бы мою проблему.

Answer 1

Вам необходимо и использовать метод select в точке, который связан с ячейкой с нажатой вкладкой.Пожалуйста, посмотрите на приведенный ниже пример:

handleClick(e) {
  let index = Number(e.currentTarget.innerHTML);
  this.setState({ index: index });
  this.chart.series[0].points[index].select();
}

Демонстрационная версия: https://codesandbox.io/s/61zx86993