使用来自highcharts-react-official的PieChart

Question

有没有一个工作的例子，从highcharts使用PieChart-react-official [https://www.npmjs.com/package/highcharts-react-official]

在下面的链接中提到了PieChart标签，但我找不到任何有用的例子：Setting Highcharts piechart chartDefaults from calling jsx file in React

下面的链接还有一个工作示例，但它不使用PieChart标记：https://codesandbox.io/s/ovx6kqokqq

有没有人知道PieChart标签的一个例子？

谢谢。

Answer 1

您不需要使用PieChart标签来使用pie创建highcharts-react-official图表。选项中的图表或系列的类型很重要，但标签的名称不是，所以例如你可以这样做：

...

import PieChart from "highcharts-react-official";

const options = {
  chart: {
    type: "pie"
  },
  series: [...]
};

class App extends React.Component {
  ...

  render() {
    return (
      <div>
        <h2>Highcharts</h2>
        <PieChart highcharts={Highcharts} options={options} />
      </div>
    );
  }
}

现场演示：https://codesandbox.io/s/139x5p4qpq

Answer 2

您可以使用Highchart js库构建您的已知组件。 https://www.highcharts.com/demo/pie-basic

另外，看看Highcharts编辑器 - http://editor.highcharts.com/full.html