Я пытаюсь воссоздать демонстрационную диаграмму highcharts x-range (https://www.highcharts.com/demo/x-range) с использованием официальной оболочки React, и я получаю сообщение об ошибке ReferenceError: Highcharts is not defined. Я новичок в реакциях и высоких диаграммах, поэтому не уверен, что мне здесь не хватает
вот код:
import React, { useState } from ‘react’; import Highcharts from ‘highcharts’; import HighchartsReact from ‘highcharts-react-official’; const AccountContractHistory = (props) => { const [chartOptions, setChartOptions] = useState({ chart: { type: ‘xrange’ }, title: { text: ‘Highcharts X-range’ }, xAxis: { type: ‘datetime’ }, yAxis: { title: { text: » }, categories: [‘Prototyping’, ‘Development’, ‘Testing’], reversed: true }, series: [{ name: ‘Project 1’, // pointPadding: 0, // groupPadding: 0, borderColor: ‘gray’, pointWidth: 20, data: [{ x: Date.UTC(2014, 10, 21), x2: Date.UTC(2014, 11, 2), y: 0, partialFill: 0.25 }, { x: Date.UTC(2014, 11, 2), x2: Date.UTC(2014, 11, 5), y: 1 }, { x: Date.UTC(2014, 11, 8), x2: Date.UTC(2014, 11, 9), y: 2 }, { x: Date.UTC(2014, 11, 9), x2: Date.UTC(2014, 11, 19), y: 1 }, { x: Date.UTC(2014, 11, 10), x2: Date.UTC(2014, 11, 23), y: 2 }], dataLabels: { enabled: true } }], }); return ( <div> <HighchartsReact highcharts={Highcharts} options={chartOptions} /> </div> ) }; export default AccountContractHistory;
Был бы признателен за любую помощь в выяснении того, что я делаю неправильно
Спасибо
Источник: