Highcharts.gauge.App.js

import Highcharts from 'highcharts';
import HighchartsReact from 'highcharts-react-official';
import _ from 'lodash';
import './App.css';
import HighchartsExporting from 'highcharts/modules/exporting';
import HighchartsMore from 'highcharts/highcharts-more';
HighchartsExporting(Highcharts);
HighchartsMore(Highcharts);

const getOptions = (type) => ({
  chart: {
    type,
  },
  title: {
    text: _.startCase(`${type} chart`),
  },
  yAxis: {
    min: 0,
    max: 100,
    title: {
      text: 'Speed',
    },
  },
  series: [
    {
      data: [80],
    },
  ],
  credits: {
    enabled: false,
  },
});

function App() {
  return (
    <HighchartsReact highcharts={Highcharts} options={getOptions('gauge')} />
  );
}

export default App;