JSFiddle - React, Tailwind, and code Playground

by Brian von Konsky

HTML

<script src="https://www.google.com/jsapi"></script>
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <div id="chart">

CSS

#chart {
    width: 100%;
    height: 256px;
}

JavaScript

//Preliminaries to do line charts
google.load('visualization', '1', {
  packages: ['corechart', 'line']
});
google.setOnLoadCallback(initChart);

function initChart() {
      var MURvalue = [
      // 1 April 2015
      [91, 27.04446],
      // 2 April 2015
      [92, 27.04446],
      // 3 April 2016
      [93, 26.99678],
      // 4 April 2016
      [95, 26.6849],
      // 5 April 2016
      [96, 6.46349],
      // 6 April 2016
      [97, 26.7656],
      // 7 April 2016
      [98, 26.75766],
    ];

    var data = new google.visualization.DataTable();
  
    // Add columns to the data
    data.addColumn('number', 'Day');
    data.addColumn('number', 'MUR');
    
    // Add rows to the data from some source
    data.addRows(MURvalue);

  // Create the chart and data instances
    var chart = new google.visualization.LineChart(document.getElementById('chart'));
    
    chart.draw(data, {
    	hAxis: {title: 'Day of Year'},
    	vAxis: {title: 'MUR/AUD'},
    	legend:{position:'none'}
    });
}