JSFiddle - React, Tailwind, and code Playground

by M F

HTML

<script src="http://canvasjs.com/assets/script/canvasjs.min.js"></script>
<div id="chartContainer" style="height: 360px; width: 100%;"></div>

JavaScript

var chart = new CanvasJS.Chart("chartContainer", {
       title: {
           text: ''
       },
       axisX: {
           labelAngle: -60,
       },
       axisY: {
           valueFormatString: "#0$"
       },
       data: [{
           type: "line",
           showInLegend: true,
           legendText: "Sales",
           indexLabelFontColor: '#ff4400',
           indexLabelBackgroundColor: '#ffffff',
           dataPoints: [{
               x: 0,
               y: 127937,
               label: '2006-12-27'
           }, {
               x: 1,
               y: 102678,
               label: ''
           }, {
               x: 2,
               y: 101180,
               label: ''
           }, {
               x: 3,
               y: 96111,
               label: ''
           }, {
               x: 4,
               y: 99960,
               label: ''
           }, {
               x: 5,
               y: 90223,
               label: '',
               indexLabel: 'test event 1',
               markerType: "triangle",
               markerColor: "#6B8E23",
               markerSize: 12
           }, {
               x: 6,
               y: 103858,
               label: ''
           }, {
               x: 7,
               y: 119192,
               label: ''
           }, {
               x: 8,
               y: 99457,
               label: ''
           }, {
               x: 9,
               y: 103149,
               label: ''
           }, {
               x: 10,
               y: 99108,
               label: ''
           }, {
               x: 11,
               y: 95631,
               label: ''
           }, {
               x: 12,
               y: 96127,
               label: ''
           }, {
               x: 13,
               y: 99745,
               label: ''
           }, {
               x: 14,
               y: 102745,
               label: ''
           }, {
               x: 15,
               y: 100885,
               label: ''
          ...