JSFiddle - React, Tailwind, and code Playground

HTML

<div id="chart0">
	  <svg style='height:500px'> </svg>
  </div>
  <div id="chart1">
	  <svg style='height:500px'> </svg>
  </div>

JavaScript

var data = [{"data1":[{"x":"04","y":3.27},{"x":"05","y":3.34},{"x":"06","y":3.27},{"x":"07","y":3.2},{"x":"08","y":3.28},{"x":"09","y":3.17},{"x":"10","y":3.15}],"data2":[{"x":"04","y":4.02},{"x":"05","y":3.22},{"x":"06","y":2.65},{"x":"07","y":2.64},{"x":"08","y":2.88},{"x":"09","y":2.57},{"x":"10","y":2.55}]},{"data1":[{"x":"2013-02-04","y":3.27},{"x":"2013-02-05","y":3.34},{"x":"2013-02-06","y":3.27},{"x":"2013-02-07","y":3.2},{"x":"2013-02-08","y":3.28},{"x":"2013-02-09","y":3.17},{"x":"2013-02-10","y":3.15}],"data2":[{"x":"2013-02-04","y":4.02},{"x":"2013-02-05","y":3.22},{"x":"2013-02-06","y":2.65},{"x":"2013-02-07","y":2.64},{"x":"2013-02-08","y":2.88},{"x":"2013-02-09","y":2.57},{"x":"2013-02-10","y":2.55}]}];
  var chart;             
  nv.addGraph(function() {
	  for (var j = 0; j < data.length; j++) {
  		chart = nv.models.lineChart();
  		if(j==0)
  		{	
	  		chart.xAxis
	  		.axisLabel('Date')
	  		   .tickFormat(d3.format(',.1f'));;
  		} else {
  			chart.xAxis
   	       .axisLabel('Date')
   	       .tickFormat(function(d) { return d3.time.format('%b %d')(new    Date(d)); });
  	  	}
  	
  		chart.yAxis
  			.axisLabel('Usage (%)')
  			.tickFormat(d3.format(',.2f'));
  		var newDivId = "chart"+j;
  		var usageData = [
  							{
  								key: "data1 (%)",
  								values: data[j]['data1'],
  								color: "#ff7f0e"
  							},
  							{
  								key: "data2 (%)",
  								values: data[j]['data2'],
  								color: "#2ca02c"
  							}
  						];
  		d3.select('#'+newDivId+' svg')
  			.datum(usageData)
  			.call(chart);

  		chart.dispatch.on('stateChange', function(e) { nv.log('New State:', JSON.stringify(e)); });
	  }
  		return chart;
  	});