JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://www.gstatic.com/charts/loader.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<div id="chart_div"></div>
JavaScript
// Load the Visualization API and the piechart package.
google.charts.load('current', {'packages':['corechart']});
// Set a callback to run when the Google Visualization API is loaded.
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var jsonData = {
"result":[
{
"cols":[
{"id":"","label":"Mês","pattern":"","type":"string"},
{"id":"","label":"Quantidade","pattern":"","type":"number"}
],
"rows":[
{"c":[{"v":"Agosto de 2016","f":null},{"v":191,"f":null}]},
{"c":[{"v":"Setembro de 2016","f":null},{"v":188,"f":null}]},
{"c":[{"v":"Outubro de 2016","f":null},{"v":230,"f":null}]},
{"c":[{"v":"Novembro de 2016","f":null},{"v":243,"f":null}]},
{"c":[{"v":"Dezembro de 2016","f":null},{"v":145,"f":null}]},
{"c":[{"v":"Janeiro de 2017","f":null},{"v":245,"f":null}]},
{"c":[{"v":"Fevereiro de 2017","f":null},{"v":206,"f":null}]},
{"c":[{"v":"Março de 2017","f":null},{"v":174,"f":null}]},
{"c":[{"v":"Abril de 2017","f":null},{"v":241,"f":null}]}
]
}
]
};
Console.log(jsonData.result);
// Create our data table out of JSON data loaded from server.
var data = new google.visualization.DataTable(jsonData.result);
var view = new google.visualization.DataView(data);
view.setColumns([0, 1, {calc: "stringify", sourceColumn: 1, type: "string", role: "annotation" }]);
// Instantiate and draw our chart, passing in some options.
var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
chart.draw(view, {width: 900, height: 300, legend: { position: "none" }, });
}