JSFiddle - React, Tailwind, and code Playground

by Сергей Тарасевич

HTML

<script src="http://code.highcharts.com/stock/highstock.js"></script>
<script src="http://code.highcharts.com/stock/modules/exporting.js"></script>
<div id="container3" style="height:400px;width:660px;margin:10px;display:inline-block;vertical-align:top;"></div>

JavaScript

$(function () {

    var averages = [
        [1256406400000, 2150],
        [1256492800000, 2210],
        [1256579200000, 2304],
        [1256665600000, 2380],
        [1256752000000, 2140],
        [1256838400000, 2135],
        [1256924800000, 2830],
        [1257011200000, 2540],
        [1257097600000, 3648],
        [1257184000000, 2770],
        [1257270400000, 3259],
        [1257356800000, 2760],
        [1257443200000, 2970],
        [1257529600000, 3880],
        [1257616000000, 3770],
        [1257702400000, 3631],
        [1257788800000, 3280],
        [1257975200000, 3810]
    ];

    // Create the chart
    $('#container3').highcharts('StockChart', {


        rangeSelector: {
            inputEnabled: $('#container3').width() > 480,
            selected: 1
        },

        legend: {
            enabled: true,
            layout: 'horizontal',
            align: 'center',
            verticalAlign: 'bottom',
            borderWidth: 0
        },

        title: {
            text: 'График пополнения балансов.'
        },
        yAxis: {
            title: {
                text: 'Сумма',
                style: {
                    color: Highcharts.getOptions().colors[0]
                }
            },
            labels: {
                format: '{value}.р',
                style: {
                    color: Highcharts.getOptions().colors[0]
                }
            },
            opposite: true
        },
        series: [{
            name: 'Пополнение баланса',
            data: averages,
            type: 'area',
            marker: {
                enabled: true,
                radius: 3
            },
            fillColor: {
                linearGradient: {
                    x1: 0,
                    y1: 0,
                    x2: 0,
                    y2: 1
                },
                stops: [
                    [0, Highcharts.getOptions().colors[0]],
                    [1,...