JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://www.flotcharts.org/flot/jquery.flot.js"></script>
<div id="placeholder" style="width:400px; height: 300px"></div>

JavaScript

var data = [{data: [[0,1]], color: "red"},
            {data: [[1,2]], color: "yellow"},
            {data: [[2,3]], color: "green"}];

$.plot("#placeholder",data, {
    series: {
        bars: {
            show: true,
            barWidth: 0.3,
            align: "center",
            lineWidth: 0,
            fill:.75
        }
    },
    xaxis: {
        ticks: [[0,"Red"],[1,"Yellow"],[2,"Green"]]
    }
});