JSFiddle - React, Tailwind, and code Playground

by Shestac92

HTML

<script src="https://cdn.anychart.com/js/7.14.0/anychart-bundle.min.js"></script>
<link rel="stylesheet" href="https://cdn.anychart.com/css/7.14.0/anychart-ui.min.css">
<div id="container"></div>

CSS

html, body, #container {
            width: 100%;
            height: 100%;
            margin: 0;
            padding: 0;
        }

JavaScript

anychart.onDocumentReady(function () {

    table = anychart.data.table();
    table.addData(getData());

    // mapping the data
    mapping = table.mapAs();
    mapping.addField('open', 1, 'first');
    mapping.addField('high', 2, 'max');
    mapping.addField('low', 3, 'min');
    mapping.addField('close', 4, 'last');
    mapping.addField('value', 4, 'last');

    // defining the chart type
    chart = anychart.stock();

    // create series
    var ohlcSeries = chart.plot(0).ohlc(mapping);
    ohlcSeries.name('ACME Corp.');

    // setting the chart title
    chart.title('AnyStock Demo');

		//set A3 format as default landscape
    chart.contextMenu().itemsFormatter(function () {
        for (var i = 0; i < this.length; i++) {
            var item = this[i];
            if (item && item.text.indexOf("Print") === 0) {
                item.action = function () {
                        chart.print('a3', true); // prints chart as A3
                    };
            }
        }
        return this;
    });

    chart.container('container');
    chart.draw();
});

function getData() {
    return [
        ['2015-12-25 12:00:00', 512.53, 514.88, 505.69, 507.34],
        ['2015-12-26 12:00:00', 511.83, 514.98, 505.59, 506.23],
        ['2015-12-27 12:00:00', 511.22, 515.30, 505.49, 506.47],
        ['2015-12-28 12:00:00', 510.35, 515.72, 505.23, 505.80],
        ['2015-12-29 12:00:00', 510.53, 515.86, 505.38, 508.25],
        ['2015-12-30 12:00:00', 511.43, 515.98, 505.66, 507.45],
        ['2015-12-31 12:00:00', 511.50, 515.33, 505.99, 507.98],
        ['2016-01-01 12:00:00', 511.32, 514.29, 505.99, 506.37],
        ['2016-01-02 12:00:00', 511.70, 514.87, 506.18, 506.75],
        ['2016-01-03 12:00:00', 512.30, 514.78, 505.87, 508.67],
        ['2016-01-04 12:00:00', 512.50, 514.77, 505.83, 508.35],
        ['2016-01-05 12:00:00', 511.53, 516.18, 505.91, 509.42],
        ['2016-01-06 12:00:00', 511.13, 516.01, 506.00, 509.26],
        ['2016-01-07 12:00:00',...