JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://www.google.com/jsapi?fake=.js"></script>
<div id="chart"></div>

JavaScript

function drawChart() {
    var data1 = new google.visualization.DataTable();
		data1.addColumn('date','Date');
		data1.addColumn('number','Index');
    data1.addColumn('number','Earning');
    data1.addRows([
        [new Date('2013-01-01'), 0, 312],
        [new Date('2013-01-02'), 1, 600],
        [new Date('2013-01-03'), 2, 520]
    ]);
    
    var data2 = new google.visualization.DataTable();

    data2.addColumn('date','Date');
		data1.addColumn('number','Index');
		data2.addColumn('number', 'Cost');
    data2.addRows([
        [new Date('2013-02-01'), 0, 582],
        [new Date('2013-02-02'), 1, 162],
        [new Date('2013-02-03'), 2, 432]
    ]);
    
    var joinedData = google.visualization.data.join(data1, data2, 'full', [[1, 1]], [0, 2], [0, 2]);
    
    console.log(joinedData);
    
    var chart = new google.visualization.LineChart(document.querySelector('#chart'));
    chart.draw(joinedData, {
        height: 300,
        width: 600,
        interpolateNulls: true
    });
}
google.load('visualization', '1', {packages:['corechart'], callback: drawChart});