如何在 React 应用程序中导入或加载哑铃图

Question

我正在尝试在 React 应用程序中使用 highcharts 的哑铃图。根据下面的 link，我已经导入了哑铃模块。 https://www.npmjs.com/package/highcharts-react-official#how-to-add-a-module

import highchartsDumbbell from 'highcharts/modules/dumbbell';
import Highcharts from 'highcharts'
import HighchartsReact from 'highcharts-react-official';

highchartsDumbbell(Highcharts);

并将选项和数据包装在 HichartsReact 组件中，如下所示：

<HighchartsReact highcharts={Highcharts} options={options} />

出现以下错误：

Uncaught TypeError: Cannot read property 'prototype' of undefined
at dumbbell.js:16
at h (dumbbell.js:8)
at dumbbell.js:15

如果这里有什么遗漏，请您提出建议。

Answer 1

请注意，哑铃系列还需要 highcharts-more 包。

API: https://api.highcharts.com/highcharts/series.dumbbell

演示：https://stackblitz.com/edit/react-xhxdyv?file=index.js

如何在 React 应用程序中导入或加载哑铃图

How to import or load Dumbbell chart in react app

highcharts

react-highcharts