JSFiddle - React, Tailwind, and code Playground

by Nick Hulea

HTML

<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>
<script src="http://www.theconfluencegroup.com/highjs/grid2.js"></script>
<div id="container" style="margin: 0px auto; height: 400px; min-width: 400px;"></div>

JavaScript

$(function () {
    var chart = new Highcharts.Chart({
        credits: {
            enabled: false
        },

        chart: {
            renderTo: 'container',
            type: 'spline'
        },
        title: {
            text: 'Confluence Media/Other Media'
        },
        subtitle: {
            text: ''
        },
        xAxis: {
            categories: [
                'Sep-26',
                'Sep-27',
                'Sep-28',
                'Sep-29',
                'Sep-30',
                'Oct-1',
                'Oct-2',
                'Oct-3',
                'Oct-4',
                'Oct-5',
                'Oct-6',
                'Oct-7',
                'Oct-8',
                'Oct-9',
                'Oct-10',
                'Oct-11',
                'Oct-12',
                'Oct-13',
                'Oct-14',
                'Oct-15',
                'Oct-17',
                'Oct-18',
                'Oct-22',
                'Oct-23',
                'Oct-24',
                'Oct-25',
                'Oct-27',
                'Oct-30',
                'Nov-4',
                'Nov-6',
                'Nov-8',
                'Nov-14',
                'Nov-16',
                'Nov-19',
                'Dec-21',
                'Dec-22',
                'Dec-23',
                'Jan-11',
                'Jan-12',
                'Jan-13',
                'Jan-14',
                'Jan-16'],
            tickmarkPlacement: 'on',
            title: {
                enabled: false
            }
        },

        yAxis: {
            title: {
                text: 'Millions'
            },
            startOnTick: false
        },
        series: [{
            name: 'Coverage using other photo/video',
            data: [
            2944853,
            5421931,
            6270192,
            6494263,
            8549233,
            10083430,
            10430190,
            10909893,
            11137938,
           ...