D3 : Colour Ranges - Column Chart

Colour Ranges - Column Chart

<!DOCTYPE html>
<html>
<head>
	<title>D3 : Colours Ranges - Column Chart</title>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js" charset="utf-8"></script>
	<style type="text/css">
		#chartholder {
			height: 400px;
			width: 600px;
		}
		.bar {		
			display: inline-block;
			width: 50px;
			height: 10px;
			margin-right: 2px;
			background-color: teal;
		}
	</style>
</head>
<body>
	<div id="chartholder"></div>

var svg = d3.select('#chartholder').selectAll('div')
			.data(data)
			.enter()
			.append('div')
			.attr('class', 'bar')
			.style('height', function (d) {
				return d * 400 + 'px';
			})
			.style('background-color', function (d) {
				return colorIndex(d);
			});
	</script>
</body>
</html>

https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js