JSFiddle - React, Tailwind, and code Playground

by tayhaithian

HTML

<body class=" claro ">
        <div id="simplechart" style="width: 400px; height: 300px;">
        </div>
    </body>

CSS

body, html { font-family:helvetica,arial,sans-serif; font-size:90%; }

JavaScript

dojo.require("dojox.charting.Chart2D");
            dojo.require("dojox.charting.plot2d.Candlesticks");
            makeCharts = function() {
        var charts = new dojox.charting.Chart2D("candle",{
                    title: "Eric Plotting",
                    titlePos: "bottom",
                    titleGap: 25,
                    titleFont: "15pt Arial",
                    titleFontColor: "orange"
                });
        charts.addPlot("default", {type: "Candlesticks", gap: 1});
        charts.addAxis("x", {fixLower: "major", fixUpper: "major", includeZero: true});
        charts.addAxis("y", {vertical: true, fixLower: "major", fixUpper: "major", natural: true});
        charts.addSeries("Series A", [
            { open: 20, close: 16, high: 22, low: 8 },
            { open: 16, close: 22, high: 26, low: 6, mid: 18 },
            { open: 22, close: 18, high: 22, low: 11, mid: 21 },
            { open: 18, close: 29, high: 32, low: 14, mid: 27 }]);
            
            
             
                charts.render();
            };
            dojo.addOnLoad(makeCharts);