Insert it in <head>
<!-- Choose one for Light Mode -->
<link id="themecss" rel="stylesheet" type="text/css" href="https://i-as.dev/devui/css/light/all.min.css" />
<!-- Choose one for Dark Mode -->
<link id="themecss" rel="stylesheet" type="text/css" href="https://i-as.dev/devui/css/dark/all.min.css" />
<script type="text/javascript" src="https://i-as.dev/devui/js/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="https://i-as.dev/devui/js/devui-all.min.js"></script>
Use Components
<body class="theme-light">
<div id="chart"></div>
<script type="text/javascript">
$(function () {
$("#chart").devuiChart({
theme: "light",
exportOptions: {
image: false,
print: false
},
primaryHeader: {
text: "Number of websites and domains"
},
axisX: {
categoricalValues: ["08/30/13", "08/29/13", "08/28/13", "08/27/13", "08/26/13", "08/25/13", "08/24/13", "08/23/13", "08/22/13", "08/21/13"]
},
tooltipSettings: {
axisMarkers: {
enabled: true,
mode: "xy",
width: 2,
color:'red',
zIndex: 3
}
},
chartLegend: {
align: "center",
verticalAlign: "top"
},
dataSeries: [{
seriesType: "polarspline",
collectionAlias: "Number of sites",
data: [1.322, 1.324, 1.333, 1.339, 1.338, 1.338, 1.338, 1.338, 1.335, 1.334]
}]
});
});
</script>
</body>