JSFiddle - React, Tailwind, and code Playground

by Sub Taper

HTML

<script src="https://www.google.com/jsapi?fake=.js"></script>
Enter data as a CSV (separate all rows with a new line):
<textarea id="input" style="display: block; height: 400px; width: 300px;">
number, value 1
1, 10
2, 33
3, 51
4, 25
5, 11
6, 15
7, 36
8, 42
9, 28
</textarea>
<input type="button" value="Chart Me!" id="go" />
<div id="chart_div"></div>

JavaScript

google.load("visualization", "1", {packages: ["corechart"]});
google.setOnLoadCallback(init);

function init () {
    document.getElementById('go').onclick = function () {
        var csv = document.getElementById('input').value;
        // split on newlines
        var csvData = csv.split('\n');
        var row;
        var rowArray;
        var dataArray = [];
        for (var i = 0; i < csvData.length; i++) {
            // strip whitespace adjacent to commas, start of line, or end of line
            row = csvData[i].replace(/(^\s|(,)\s|\s(,)|\s$)/g, '$2');
            
            if (row.length > 0) {
                rowArray = row.split(',');
                for (var j = 0; j < rowArray.length; j++) {
                    // if the string value equals the parseFloat of the string, then it is most likely a number
                    // so translate to number, otherwise leave as string
                    if (rowArray[j] == parseFloat(rowArray[j])) {
                        rowArray[j] = parseFloat(rowArray[j]);
                    }
                }
                dataArray.push(rowArray);
            }
        }
        var data = google.visualization.arrayToDataTable(dataArray);
        
        var chart = new google.visualization.ChartWrapper({
            chartType: 'LineChart',
            containerId: 'chart_div',
            dataTable: data,
            options: {
                height: 300,
                width: 500,
                hAxis: {
                    title: data.getColumnLabel(0)
                },
                vAxis: {
                    title: data.getColumnLabel(1)
                }
            }
        });
        chart.draw();
    }
}