JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.2.918/styles/kendo.common.min.css">
<script src="http://cdn.kendostatic.com/2013.2.918/js/kendo.all.min.js"></script>
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.2.918/styles/kendo.default.min.css">
<div id="chart"></div>
JavaScript
$("#chart").kendoChart({
seriesDefaults: {
width: 1
},
series: [ {
type: "line",
line: {
width: 1
},
markers: {
visible: true,
size: 3
},
data: [1, 2, 3, 2, 4, 6, 2, 5, 1, 4, 1, 3, 4, 4, 2, 5, 6, 4, 3, 4, 2, 2, 4, 5, 6, 2, 3, 0, 1]
}],
categoryAxis: {
justified: true,
majorGridLines: {
visible: true,
step: 8
},
minorGridLines: {
visible: true,
step: 2
},
majorTicks: {
step: 8,
color: "#ff0000",
size: 10,
width: 2
},
minorTicks: {
visible: true,
step: 2,
color: "#ff00ff",
size: 5
}
}
});