|<- [[Creating a simple bar chart with SVG]]|[[Using ordinal scales]] ->| ===== adding quantitative scales ===== -> github.com/mbostock/d3/wiki/Scales Trois types d'échelles : * Échelles quantitatives - pour les domaines non continus d'entrées, comme les nombres * linear (plus courante) * identity * power * log * quantize * threshold * Échelles ordinales - pour les domaines discrets d'entrées, comme les noms ou catégories * Échelles temporelles - pour les domaines temporels var bardata = [20, 30, 600, 15, 85, 20, 30, 105, 15, 85, 20, 30, 105, 15, 85]; var height = 400; var width = 600; var barWidth = 50; var barOffset = 5; // linear scale var yScale = d3.scale.linear() .domain([0, d3.max(bardata)]) .range([0, height]); // ordinal scale var xScale = d3.scale.ordinal() .domain(d3.range(0,bardata.length)) .rangeBands([0, width]); d3.select('#chart').append('svg') .attr('width', width) .attr('height', height) .style('background', '#C9D7D6') .selectAll('rect').data(bardata) .enter().append('rect') .style('fill', '#C61C6F') .attr('width', xScale.rangeBand()) .attr('height', function (d) { return yScale(d); }) .attr('x', function (d, i) { return xScale(i); }) .attr('y', function (d) { return height - yScale(d); });