JSFiddle - React, Tailwind, and code Playground

by whoamiwho

HTML

<!DOCTYPE html>
<html>
<head>
    <title>KendoUI Test Page</title>
    
    <link href="http://cdn.kendostatic.com/2012.3.1315/styles/kendo.common.min.css" rel="stylesheet" />
    <link href="http://cdn.kendostatic.com/2012.3.1315/styles/kendo.default.min.css" rel="stylesheet" />
    <link href="http://cdn.kendostatic.com/2012.3.1315/styles/kendo.dataviz.min.css" rel="stylesheet" />
    <link href="http://cdn.kendostatic.com/2012.3.1315/styles/kendo.mobile.all.min.css" rel="stylesheet" />

    <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
    <script src="http://cdn.kendostatic.com/2012.3.1315/js/kendo.all.min.js"></script>
</head>
<body>
    <div id="stock-chart"></div>
    <script>

        $("#stock-chart").kendoStockChart({
            dataSource: {
                data: [
                    {
                        "Date": "01/01/2012 00:10:00",
                        "Open": 60,
                        "High": 100,
                        "Low": 60,
                        "Close": 60,
                        "Volume": 233
                    },
                    {
                        "Date": "01/01/2012 00:11:00",
                        "Open": 200,
                        "High": 200,
                        "Low": 100,
                        "Close": 200,
                        "Volume": 2333
                    }
                ]
            },
            series: [{
                type: "candlestick",
                openField: "Open",
                highField: "High",
                lowField: "Low",
                closeField: "Close"
            }],
            dateField: "Date"
        });
    </script>
</body>
</html>