JSFiddle - React, Tailwind, and code Playground

by danvk

HTML

<!-- You may set style: "width: ...; height: ..." to size the chart -->
<div id="graph"></div>

CSS

/*
Relevant CSS classes include:

Labels on the X & Y axes:
.dygraph-axis-label
.dygraph-axis-label-x
.dygraph-axis-label-y
.dygraph-axis-label-y2

Chart labels, see http://dygraphs.com/tests/styled-chart-labels.html
.dygraph-title
.dygraph-xlabel
.dygraph-ylabel
.dygraph-y2label

The legend, see http://dygraphs.com/tests/series-highlight.html
.dygraph-legend
*/
.dygraph-title {
    color: gray;
}

JavaScript

g = new Dygraph(document.getElementById("graph"),
// CSV or path to a CSV file.
"Date,Temperature\n" +
"2014-05-07,75\n" +
"2014-05-15,70\n" + 
"2014-05-23,80\n"+
"2014-05-30,72\n" ,{ 
          axes: {
            x: {
              axisLabelFormatter: function(d, gran) {
                  var d = new Date(d.getTime() + 7200*1000);
                  return d.strftime("%Y-%m-%d");
              }
            }
          }
        });