JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://www.google.com/jsapi?fake=.js"></script>
<div id="chart_div" style="width: 900px; height: 500px;"></div>
JavaScript
// Load the Visualization API and the piechart package.
google.load('visualization', '1.0', {
'packages': ['corechart']
});
// Set a callback to run when the Google Visualization API is loaded.
google.setOnLoadCallback(drawChart);
// Callback that creates and populates a data table,
// instantiates the pie chart, passes in the data and
// draws it.
function drawChart() {
var origData = [
['Bønne', 1],
['Kris', 2],
['Ole', 3]
];
var transformedData = [];
for (var i = 0; i < origData.length; i++) {
transformedData[i] = [origData[i][0], origData[i][1]]
}
//console.log(origData);
//var transformedData = origData;
// Create the data table.
var data = new google.visualization.DataTable();
data.addColumn('string', 'Student');
data.addColumn('number', 'Value');
data.addRows(transformedData);
var options = {};
// Instantiate and draw our chart, passing in some options.
var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
chart.draw(data, options);
}