JSFiddle - React, Tailwind, and code Playground

by Fusher

HTML

<script src="http://code.highcharts.com/highcharts.js"></script>

<div id="container" style="height: 400px"></div>
<button id="button1">Add series 1</button>

JavaScript

$(function() {



    var chart = new Highcharts.Chart({
        chart: {
            defaultSeriesType: 'area',
            ignoreHiddenSeries: true,
            zoomType: 'x',
            margin: [],
            renderTo: 'container'

        },
        plotOptions: {
            series: {
                cursor: 'pointer'
            },
             //pie: { stacking: 'percent'},
            areaspline: {
                shadow: false,
                lineWidth: 1,
                stacking: 'normal',
                marker: {
                    enabled: false,
                    states: {
                        hover: {
                            enabled: true,
                            radius: 5
                        }
                    },
                    radius: 2
                },
                states: {
                    hover: {
                        lineWidth: 1
                    }
                }
            }
        },
        xAxis: [
            {
            type: 'datetime',
            startOnTick: false,
            endOnTick: true,
            labels: {
                formatter: function() {
                    return Highcharts.dateFormat('%H:%M', this.value);
                }
            },
            showLastLabel: true,
            maxZoom: 3600000}

                ],
        yAxis: [
            {
            title: {
                style: {
                    fontSize: '10px',
                    fontWeight: 'normal'
                },
                text: 'Puissance (W-Wh)',
                rotation: 270
            },
            opposite: false,
            min: 0,
            showEmpty: false,
            id: 'W'}
        ]
    });



    // the button handler
    $('#button1').click(function() {
        chart.addSeries({
            data: [[1333492200000, null], [1333493100000, null], [1333494000000, null], [1333494900000, null], [1333495800000, null], [1333496700000, null], [1333497600000, null],...