Get started with react-highcharts CDN

x
import React from 'react';
import ReactHighcharts from 'https://cdn.jsdelivr.net/npm/[email protected]/dist/es/ReactHighcharts.js';
import highcharts from 'https://cdn.jsdelivr.net/npm/[email protected]/dist/highcharts.js';
import highchartsMore from 'https://cdn.jsdelivr.net/npm/[email protected]/dist/highcharts-more.js';

highcharts.registerModule('exporting', highchartsMore);

class App extends React.Component {
  state = {
    chartOptions: {
      title: { text: 'Simple line chart' },
      xAxis: { categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'] },
      yAxis: { title: { text: 'Temperature (°C)' } },
      series: [
        {
          name: 'Temperature',
          data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6],
        },
      ],
      plotOptions: {
        line: {
          dataLabels: {
            enabled: false,
          },
        },
      },
      exporting: { enabled: false },
    },
  };

  render() {
    return <ReactHighcharts config={this.state.chartOptions} highcharts={highcharts} />;
  }
}

export default App;