如何通过 highcharts 中的 JSON 文件制作图表？请帮我

Question

我正在使用 highchat 制作图表，但效果不佳。

我的代码

     const [newData, setNewData] = useState();
  const [datas, setDatas] = useState({
    x: null,
    y: null,
  });
  useEffect(() => {
    for (let key in data) {
      return setNewData(data[key]);
    }
  }, []);
  useEffect(() => {
    newData?.map((u) => {
      delete u.time;
      for (let key in u) {
        setDatas({
          x: null,
          y: u[key],
        });
      }
    });
  }, []);

Json文件

{"dataset":[

    {
      "time": "2020.3.29 21:45",
      "EC_slab1": 5.614382,
      "EC_slab2": 5.084232,
      "EC_drain_PC": 6.48888298,
      "WC_slab1": 67.823,
      "WC_slab2": 56.684,
      "CO2air": 610.0000001,
      "HumDef": 1.819999991,
      "Rhair": 87.5000001,
      "Tair": 17.2,
      "EnScr": 0,
      "BlackScr": 94.9999995,
      "PipeGrow": 37.49999999,
      "PipeLow": 0,
      "Iglob": 0,
      "RadSum": 1766,
      "Tout": 3.7
    },

我将把数据放在 x 轴上，将每个项目的维度放在 y 轴上。我怎样才能继续工作？请给我一些建议。

Answer 1

在这里您可以看到如何使用动态数据创建图表：

class App extends React.Component {
  constructor(props) {
    super(props);
  }

  componentDidMount() {
    fetch("https://api.myjson.com/bins/q4us4")
      .then(response => response.json())
      .then(data => {
        options.series[0].data = data;
        this.setState({ data: data });
      });
  }

  render() {
    return (
      <div>
        {this.state &&
          this.state.data && (
            <Chart options={options} highcharts={Highcharts} ref={"chart"} />
          )}
      </div>
    );
  }
}

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

演示：https://codesandbox.io/s/mz35zwxjoj

如何通过 highcharts 中的 JSON 文件制作图表？请帮我

How can I make a chart through JSONfile from highchats? please help me

highcharts

reactjs