D3.js selectors d3.select

by Imabot

HTML

<script src="https://d3js.org/d3.v5.min.js"></script>
<h1>Axes with D3.js</h1>


<div id="bar-chart"></div>

CSS

#bar-chart svg { background-color: Gainsboro; }
#bar-chart .bars { fill: LightSkyBlue; }

JavaScript

// Create our SVG container
var svg = d3.select("#bar-chart")
            .append("svg")
            .attr('width', 200)
            .attr('height', 100);


var xScale = d3.scaleLinear()
    			.domain([0, 10]) 
    			.range([10, 190]);

svg.append('g')
	.attr('transform', 'translate(0, 80)')
	.call(d3.axisBottom(xScale));