Drawing a Discrete number of rects in an svg element.using D3.js -

js , trying figure out how draw discrete number of rectangles in svg element. 5 rectangles million. best way go this? should using ordinal scale since have discrete number of rectangles or should using linear scale? i'm thinking width of rectangles should shrink number of rectangles grows larger.

you have compute layout , create appropriate scales. example:

var width = 300,     height = 20,     margin = 2,     nrect = 20,     rectwidth = (width - (nrect - 1) * margin) / nrect,     svg = d3.select('#chart').append('svg')        .attr('width', width)        .attr('height', height);  var data = d3.range(nrect),     posscale = d3.scale.linear()         .domain(d3.extent(data))         .range([0, width - rectwidth]);  svg.selectall('rect')     .data(data)     .enter()     .append('rect')     .attr('x', posscale)     .attr('width', rectwidth)     .attr('height', height); 

i wrote small jsfiddle code: http://jsfiddle.net/pnavarrc/ca7ry/