JSFiddle - React, Tailwind, and code Playground

by adityads

HTML

<script src="https://www.gstatic.com/charts/loader.js"></script>

<div id='chart_div'></div>
<div id='png'></div>

JavaScript

google.charts.load("current", {packages:['corechart']});
		google.charts.setOnLoadCallback(drawChart);
		function drawChart() {

			var data = google.visualization.arrayToDataTable([
	        ['Daily', 'Sales'],
        ['Mon', 4],
        ['Tue', 6],
        ['Wed', 6],
        ['Thu', 5],
        ['Fri', 3],
        ['Sat', 7],
        ['Sun', 7]
            ]);

			var options = {
				title: "Density of Precious Metals, in g/cm^3",
				bar: {groupWidth: '95%'},
				legend: 'none',
			};

			var chart_div = document.getElementById('chart_div');
			var chart = new google.visualization.ColumnChart(chart_div);

      google.visualization.events.addListener(chart, 'ready', function () {
      	chart_div.innerHTML = '<img src="' + chart.getImageURI() + '">';
      	document.getElementById('png').outerHTML = '<a href="' + chart.getImageURI() + '">Print</a>';
      	console.log(chart_div.innerHTML);

      });

      chart.draw(data, options);

  }