JSFiddle - React, Tailwind, and code Playground

HTML

<p>So here's those results I was telling you about:</p>

<p class="results">
    0.00 0.03 0.10 0.26 0.15 0.07 0.11 0.21 0.09 0.09 0.37 0.37 0.36 0.47 0.24 0.08 0.14 0.25 0.08 0.12 0.38 0.51 0.37 0.11 0.01 0.06 0.09 0.13 0.34 0.36 0.10 0.02 0.04 0.38 0.39 0.10 0.10 0.21 0.15 0.15 0.39 0.37 0.10 0.01 0.03 0.12 0.23 0.22 0.48 0.62 0.25 0.03 0.03 0.02 0.07 0.27 0.52 0.39 0.36 0.35 0.07 0.02 0.11 0.25 0.25 0.24 0.25 0.26 0.13 0.16 0.25 0.11 0.03 0.03 0.02 0.02 0.03 0.02 0.02 0.02 0.02 0.01 0.02 0.03 0.01 0.03 0.03    
</p>

<p>They are very interesting.</p>

CSS

canvas{display: inline;}

JavaScript

$(document).ready(function() {
    var $results = $(".results");
    var values = $results.text().split(" ");

    var canvas = $("<canvas>")[0]
    var ctx = canvas.getContext("2d");
    var graphHeight = 20;
    var graphWidth = 4;
    ctx.canvas.width = values.length * graphWidth;
    ctx.canvas.height = graphHeight;
    $results.html(canvas)
    for (var i = 0; i < values.length; i++) {
        var result = parseFloat(values[i]);
        ctx.fillRect(i * graphWidth, (graphHeight - (result * graphHeight)), graphWidth, result * graphHeight);
    }
})