highcharts - 替代highcharts-more

Question

根据npm highcharts-more.js 已弃用，我们只需要从 highcharts 文件夹中导入相应的模块。但是当我尝试删除 highcharts-more 依赖时，我得到了错误。我们正在尝试使用 react-highcharts v16.0.2 构建箱线图。

我什至尝试从他们的演示中删除 highcharts-more.js 导入，但发现它失败了。

我在这里的实施方面有什么遗漏吗？

Answer 1

将所需的依赖项导入为

import ReactHighchart from 'react-highcharts';
import HighchartMore from 'highcharts/highcharts-more';
HighchartMore(ReactHighchart.Highcharts);

StackBlitz演示

没有弃用的依赖项

Answer 2

尝试highcharts-react-official而不是react-highcharts：

import React from "react";
import { render } from "react-dom";
// Import Highcharts
import Highcharts from "highcharts";
import HighchartSankey from "highcharts/modules/sankey";
import HighchartsWheel from "highcharts/modules/dependency-wheel";
import HighchartsReact from "highcharts-react-official";

HighchartSankey(Highcharts);
HighchartsWheel(Highcharts);

const Viz = () => {
  return (
    <HighchartsReact
      highcharts={Highcharts}
      options={{
        series: [{
          type: "dependencywheel",
          data: [{
            from: "Category1",
            to: "Category2",
            weight: 2
          }, {
            from: "Category1",
            to: "Category3",
            weight: 5
          }]
        }]
      }}
    />
  );
};

render(<Viz />, document.getElementById("root"));