JSFiddle - React, Tailwind, and code Playground

JavaScript

var datavars = [224, 84, 29, 3];
var prev_width = [0,
 									datavars[0],
 									datavars[0] +  datavars[1],
 									datavars[0] +  datavars[1] +  datavars[2]
 								 ];
var colors = ['green','blue','darkgray','#606060'];

var svg = d3.select('body')
.append('svg')
.attr('width', 500)
.attr('height', 100);

svg.selectAll('rect')
.data(datavars)
.enter()
.append('rect')
.attr('width', function(d){
    return d;})
               .attr('x',function(d, i){
               return prev_width[i]; })
.attr('fill', function(d, i){ return colors[i]; })
.attr('y',0)
.attr('height', 30);