JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://cdn.kendostatic.com/2015.1.408/js/kendo.all.min.js">   </script>
<div id="chart"></div>

JavaScript

var stats1 = [
    {
        x: 100
        , y: 300
        ,k: 400,
        clr:'blue'

    }
    , {
        x: 6.00217915242074
       ,y: 699.98799853571
        ,k: 500,
        clr:'blue'
    }
    ];

var stats2 = [
    {
        x: 6.00217915242074
        , y: 699.98799853571
        ,k: 800,
        clr:'yellow'
    }
    , {
        x: 123.85446249323765
        , y: 500.986136830373
        ,k: 800,
        clr:'yellow'
    }
    , {
        x: 162.26067838482256
        , y: 1494.94787950881
        ,k:1100,
        clr:'yellow'
    }
 ];
 var stats3 = [
    {
        x: 162.26067838482256
        , y: 1494.94787950881
        ,k: 1200,
        clr:'red'
    }
    , {
        x: -4.07983548814565
        ,y: 1934.87946942842
        ,k: 1500,
        clr:'red'
    }
];

function createChart() {
    $("#chart")
        .kendoChart({
            xAxis: {},
            yAxis: {},
            seriesDefaults: {type: "scatterLine" },
            series: [{data: stats1, color: "blue"},{data: stats2, color: "yellow"},{data: stats3, color: "red"}],
  })
}



$(document).ready(createChart);