JSFiddle - React, Tailwind, and code Playground

HTML

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

JavaScript

google.load('visualization', '1.1', {packages: ['table']});
google.setOnLoadCallback(drawTable);

function drawTable() {
    /* commented out because the AJAX won't do anything on jsfiddle
    var jsonTableData = $.ajax({
        url: "bin/get_data.php?page=1",
        dataType: "json",
        async: false
    }).responseText;
    */

    var jsonTableData = {
        "Individual": [
            {"name": "David Power", "amount": 300},
            {"name": "John Stelling", "amount": 50}
        ],
        "Company": [
            {"name": "BP", "amount": 3000},
            {"name": "Total", "amount": 4050}
        ],
        "Fundraising": [
            {"name": "London Marathon", "amount": 6000},
            {"name": "Tea Party", "amount": 500}
        ]
    };

    // this shouldn't be necessary - the $.ajax call should already parse the data as JSON
    // var obj = jQuery.parseJSON(jsonTableData);
    
    var data = new google.visualization.DataTable();
    data.addColumn('string', 'Name');
    data.addColumn('number', 'Amount');
    data.addColumn('string', 'Type');

    for (var x in jsonTableData) {
        for (var i = 0; i < jsonTableData[x].length; i++) {
            data.addRow([jsonTableData[x][i].name, jsonTableData[x][i].amount, x]);
        }
    }

    var options = {
        'width': 600
    };
    var table = new google.visualization.Table(document.getElementById('table_div'));
    table.draw(data, options);
}