JSFiddle - React, Tailwind, and code Playground
by sonnyjitsu
HTML
<div id="bymonth"></div>
<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
JavaScript
window.onload = function() {
var chartmonth = new CanvasJS.Chart("bymonth",
{
theme:"light2",
backgroundColor: "#eee",
title:{
text: "Last 30 days"
},
axisX:{
lineThickness: 0,
tickThickness: 0,
gridThickness: 0,
labelMaxWidth: 100,
interval:1,
labelFontSize: 10,
labelFontStyle: 'normal'
//title: "timeline",
//valueFormatString: "DD"
},
axisY: {
lineThickness: 0,
gridThickness: 0,
tickThickness: 0,
//title: "Downloads"
},
data: [
{
type: "column",
dataPoints: [//array
{ label: 1, y: 0 },
{ label: 2, y: 0 },
{ label: 3, y: 0 },
{ label: 4, y: 0 },
{ label: 5, y: 0 },
{ label: 6, y: 0 },
{ label: 7, y: 0 },
{ label: 8, y: 0 },
{ label: 9, y: 0 },
{ label: 10, y: 0 },
{ label: 11, y: 0 },
{ label: 12, y: 0 },
{ label: 13, y: 0 },
{ label: 14, y: 0 },
{ label: 15, y: 0 },
{ label: 16, y: 0 },
{ label: 17, y: 1 },
{ label: 18, y: 0 },
{ label: 19, y: 2 },
{ label: 20, y: 0 },
{ label: 21, y: 0 },
{ label: 22, y: 0 },
{ label: 23, y: 0 },
{ label: 24, y: 0 },
{ label: 25, y: 0 },
{ label: 26, y: 0 },
{ label: 27, y: 0 },
{ label: 28, y: 0 },
{...