JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://cdn.kendostatic.com/2012.3.1114/js/kendo.all.min.js"></script>
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.3.1114/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.3.1114/styles/kendo.default.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.3.1114/styles/kendo.dataviz.min.css">
<div id="chart" style="relative;"></div>

CSS

#watermark{
    position: absolute; left: 170px; top: 170px;
    width: 120px;
    height: 20px;
    filter: alpha(opacity=60); 
    opacity: .4;
    font-size: 20px;
}

JavaScript

$("#chart").kendoChart({
    theme: $(document).data("kendoSkin") || "default",
    title: {
        text: "Internet Users"
    },
    legend: {
        position: "bottom"
    },
    plotArea: {
        background: "transparent"
    },
    seriesDefaults: {
        type: "bar"
    },
    series: [{
        name: "World",
        data: [15.7, 16.7, 20, 23.5, 26.6]},
    {
        name: "United States",
        data: [67.96, 68.93, 75, 74, 78]}],
    valueAxis: {
        labels: {
            format: "{0}%"
        }
    },
    categoryAxis: {
        categories: [2005, 2006, 2007, 2008, 2009]
    },
    tooltip: {
        visible: true,
        format: "{0}%"
    },
    seriesClick: function(){alert("test")}

});

$('<div id="watermark">My watermark</div>').appendTo("#chart");