JSFiddle - React, Tailwind, and code Playground

HTML

<canvas id='output' width='500' height='500'></canvas>

CSS

html{
    background:#f2f2f2;
}

#output{
    margin:20px;
    background:#f2f2f2;
}

JavaScript

/* bar graph maker */

Array.prototype.min = function() {
    return Math.min.apply(Math, this)
};

Array.prototype.max = function() {
    return Math.max.apply(Math, this)
};

function log10(val) {
    return Math.log(val) / Math.LN10;
}


width = 500;
height = 500;



function drawGraph(data, labels, xLabel, yLabel) { //assume all positive numbers
    realmax = data.max();
    max = realmax * 1.1;
    min = data.min();

    interval = Math.pow(10, Math.ceil(log10(realmax)));
    if (realmax < interval / 2) {
        interval /= 2;
    }
    interval /= 10;
    if (realmax / interval < 4) {
        interval /= 2;
    }

    ctx = document.getElementById('output').getContext('2d');
    ctx.clearRect(0, 0, width, height)

    ctx.fillStyle = "#aaa";
    ctx.fillRect(75, 0, width - 75, height - 75);
    ctx.fillStyle = "#fafafa";
    ctx.fillRect(76, 0, width - 76, height - 76);


    for (i = interval; i < max; i += interval) {
        ctx.fillStyle = "#ddd";
        ctx.fillRect(76, height - 75 - Math.floor(i / max * (height - 76)), width - 76, 1);
    }

    for (i = 0; i < max; i += interval) {
        ctx.fillStyle = "#999";
        ctx.font = "13px sans-serif";
        ctx.textAlign = "right";
        ctx.textBaseline = "middle";
        ctx.fillText(i, 68, height - 75 - Math.floor(i / max * (height - 76)), 50);
    }


    interval = (width - 76) / (data.length * 2 + 1);
    start = 76;
    for (i = 0; i < data.length; i++) {
        start += interval;
        var y = height - 75 - Math.floor(data[i] / max * (height - 76));

        ctx.fillStyle = "#0081ff";
        ctx.fillRect(Math.floor(start), y, Math.floor(interval), height - 76 - y + 1);
        ctx.fillStyle = "#51a9ff";
        ctx.fillRect(Math.floor(start) + 1, y + 1, Math.floor(interval) - 2, height - 76 - y - 1);

        ctx.fillStyle = "#aaa";
        ctx.font = "13px sans-serif";
        ctx.textAlign = "center";
        ctx.textBaseline = "middle";
        ctx.fillText(data[i],...