JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://www.google.com/jsapi?.js"></script>
<div id='chart_div'></div>
JavaScript
function drawChart() {
var data = new google.visualization.DataTable();
data.addColumn('string', 'Device');
data.addColumn('number', 'Received');
data.addColumn('number', 'Sent');
data.addRows([
['Device 1', 17848, 14222],
['Device 2', 12655, 11898]
]);
var formatter = new google.visualization.NumberFormat({pattern: '#,### bytes'});
formatter.format(data, 1);
formatter.format(data, 2);
var chart = new google.visualization.ColumnChart(document.querySelector('#chart_div'));
chart.draw(data, {
height: 400,
width: 600,
isStacked: true,
legend: {
position: 'none'
},
colors: ['#2513ac', '#b61230'] // colors array contains [received, sent]
});
}
google.load('visualization', '1', {packages:['corechart'], callback: drawChart});