D3
OG
Old school D3 from simpler times
All examples
By author
By category
About
tmcw
Full window
Github gist
scaled rects
<!DOCTYPE html> <meta charset="utf-8"> <style> body { font:normal 12px/20px 'Georgia'; background:#222; text-align:center; } path { fill:#ccc; stroke:red; stroke-width:2; } </style> <body> <script src="https://d3js.org/d3.v3.min.js"></script> <script> var g = d3.select('body').append('svg') .append('g') .attr('transform', 'translate(50, 50)'); var s = d3.scale.linear().domain([0, 1]).range([0, 400]); var l = d3.svg.line() .x(function(d) { return s(d[0]); }) .y(function(d) { return s(d[1]); }); var tri = [ [0, 0], [1, 0], [0.5, Math.sqrt(3)/2], [0, 0] ]; var tris =d3.range(0, 20).map(function(r) { return [r, tri]; }); g.selectAll('path') .data(tris) .enter() .append('path') .attr('transform', function(d) { return 'scale(' + Math.pow(2/3, d[0]) + ')'; }) .attr('d', function(d) { return l(d[1]); }); </script> </body>
Modified
http://d3js.org/d3.v3.min.js
to a secure url
https://d3js.org/d3.v3.min.js