JSFiddle - React, Tailwind, and code Playground

by Pawan Jadhav

HTML

<script src="http://code.highcharts.com/highcharts-more.src.js"></script>
<script src="http://code.highcharts.com/stock/highstock.src.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>

JavaScript

$(function () {
Highcharts.setOptions({
	global: {
		useUTC: false
	}
});
    $('#container').highcharts({
    
        "chart": {
           "zoomType": "xy"
        },
        "scrollbar": {
            //"enabled": true
        },
        "xAxis": {            
            "type": "datetime",
            units: [[
	'millisecond', // unit name
	[1, 2, 5, 10, 20, 25, 50, 100, 200, 500] // allowed multiples
], [
	'second',
	[1, 2, 5, 10, 15, 30]
], [
	'minute',
	[1, 2, 5, 10, 15, 30]
], [
	'hour',
	[1, 2, 3, 4, 6, 8, 12]
], [
	'day',
	[1]
], [
	'week',
	[1]
], [
	'month',
	[36]
], [
	'year',
	null
]]
        },
        "series": [{
            "type": "column",
            "data": [{
                "x": new Date('01/01/2010'),
                "y": 12
            },
            {
                "x": new Date('01/01/2012'),
                "y": 14
            },
            {
                "x": new Date('01/01/2013'),
                "y": 14
            },
            {
                "x": new Date('01/01/2015'),
                "y": 14
            },
            {
                "x": new Date('01/01/2018'),
                "y": 14
            },
            {
                "x": new Date('01/01/2020'),
                "y": 14
            },
            {
                "x": new Date('01/01/2021'),
                "y": 14
            },
            {
                "x": new Date('01/01/2025'),
                "y": 14
            }
			]
        }]
    });
});