JSFiddle - React, Tailwind, and code Playground

by smarko

HTML

<body class="claro" style="background-color: #eee">

CSS

.chart-div
{
    width: 500px;
    height: 300px;
}

JavaScript

dojo.require("dojox.charting.Chart");
dojo.require("dojox.charting.axis2d/Default");
dojo.require("dojox.charting.plot2d.StackedLines");
dojo.require("dojox.charting.themes.Wetland");
dojo.require("dojo.parser");
dojo.require("dojo.json");

dojo.ready(function() {
    
    var div = dojo.create('div', {id: "chart"}, dojo.body());
    dojo.addClass(div, "chart-div");

    var datavalues = '{\n "charttype": "Stacked Lines",' + '\n "title": "sometitle",'
    + '\n "series1": [ 10, 2, 0.5, 1.5, 1, 2.1, 0.4 ],'
    + '\n "series2": [ 8, 2, 0.5, 1.5, 5, 2.8, 0.4 ]\n}';
   
    var jsonObj = JSON.parse(datavalues);
    
    var c = new dojox.charting.Chart("chart", {
        title : "sometitle",
        titleFont : "normal normal normal 12pt Arial"
    });

    c.addPlot("default", {
        type : dojox.charting.plot2d.StackedLines,
        tension : "S"
    }).addAxis("x", {
    fixLower : "major",
    fixUpper : "major"
    }).addAxis("y", {
        vertical : true,
        fixLower : "major",
        fixUpper : "major",
        min : 0
    }).setTheme(dojox.charting.themes.Wetland);

    c.addSeries("Series 1", jsonObj.series1);
    c.addSeries("Series 2", jsonObj.series2);
    c.render();

});