JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2015.2.902/js/kendo.all.min.js"></script>
<!DOCTYPE html>
<html>
    <head>
        <title>Bar chart</title>
    </head>
    <body>
    <div id="chart" style="width: 600px; height: 400px;"></div>
    </body>
</html>

JavaScript

var data = [
    {"THEYEAR": 2008, "UID": 1, "THEMONTH": 1, "SERIES": "Annað", "CHARTGROUP": 20081, "KRLAMOUNTTOTAL": 1},
    {"THEYEAR": 2008, "UID": 2, "THEMONTH": 1, "SERIES": "Sölulaun", "CHARTGROUP": 20081, "KRLAMOUNTTOTAL": 2},
    {"THEYEAR": 2008, "UID": 3, "THEMONTH": 2, "SERIES": "Annað", "CHARTGROUP": 20082, "KRLAMOUNTTOTAL": 3},
    {"THEYEAR": 2008, "UID": 4, "THEMONTH": 2, "SERIES": "Sölulaun", "CHARTGROUP": 20082, "KRLAMOUNTTOTAL": 4},
    {"THEYEAR": 2008, "UID": 5, "THEMONTH": 3, "SERIES": "Annað", "CHARTGROUP": 20083, "KRLAMOUNTTOTAL": 5},
    {"THEYEAR": 2008, "UID": 6, "THEMONTH": 3, "SERIES": "Sölulaun", "CHARTGROUP": 20083, "KRLAMOUNTTOTAL": 6},
    {"THEYEAR": 2008, "UID": 7, "THEMONTH": 4, "SERIES": "Annað", "CHARTGROUP": 20084, "KRLAMOUNTTOTAL": 7},
    {"THEYEAR": 2008, "UID": 8, "THEMONTH": 4, "SERIES": "Sölulaun", "CHARTGROUP": 20084, "KRLAMOUNTTOTAL": 8},

    {"THEYEAR": 2009, "UID": 9, "THEMONTH": 1, "SERIES": "Annað", "CHARTGROUP": 20091, "KRLAMOUNTTOTAL": 4},
    {"THEYEAR": 2009, "UID": 10, "THEMONTH": 1, "SERIES": "Sölulaun", "CHARTGROUP": 20091, "KRLAMOUNTTOTAL": 5},
    {"THEYEAR": 2009, "UID": 11, "THEMONTH": 2, "SERIES": "Annað", "CHARTGROUP": 20092, "KRLAMOUNTTOTAL": 6},
    {"THEYEAR": 2009, "UID": 12, "THEMONTH": 2, "SERIES": "Sölulaun", "CHARTGROUP": 20092, "KRLAMOUNTTOTAL": 7},
    {"THEYEAR": 2009, "UID": 13, "THEMONTH": 3, "SERIES": "Annað", "CHARTGROUP": 20093, "KRLAMOUNTTOTAL": 8},
    {"THEYEAR": 2009, "UID": 14, "THEMONTH": 3, "SERIES": "Sölulaun", "CHARTGROUP": 20093, "KRLAMOUNTTOTAL": 9},
    {"THEYEAR": 2009, "UID": 15, "THEMONTH": 4, "SERIES": "Annað", "CHARTGROUP": 20094, "KRLAMOUNTTOTAL": 10},
    {"THEYEAR": 2009, "UID": 16, "THEMONTH": 4, "SERIES": "Sölulaun", "CHARTGROUP": 20094, "KRLAMOUNTTOTAL": 11},
];


$(document).ready(function() {
    $("#chart").kendoChart({
        theme: "silver",
        title: {
            text: "Total records processed"
        },
        legend: {
            position:...