var data = [4, 8, 15, 16, 23, 42];
d3.select(".chart")
.selectAll("div")
.data(data)
.enter()
.append("div")
.text(function(d) {
return d;
})
.transition()
.duration(2000)
.style("width", function(d) {
return (d * 10) + "px";
})
<body> <div class="chart"></div> </body>
.chart div {
font: 10px sans-serif;
background-color: steelblue;
text-align: right;
padding: 3px;
margin: 1px;
color: white;
}
.chart div {
width: 100px;
}