D3
OG
Old school D3 from simpler times
All examples
By author
By category
About
Noelfish6
Full window
Github gist
sin circle
Built with
blockbuilder.org
<!DOCTYPE html> <head> <meta charset="utf-8"> <script src="https://d3js.org/d3.v4.min.js"></script> <style> body { margin:0;position:fixed;top:0;right:0;bottom:0;left:0; } </style> </head> <body> <div class="container"> <section class="canvas" id="canvas"></section> </div> <script> var arr = []; for(var i=0; i<50; i++){ var a = Math.random(); arr.push({ a:a, b:Math.sin(a*Math.PI*2)/2+.5, c:Math.random() }); } var plot = d3.select('.canvas') .append('svg') .attr('width', 960) .attr('height', 500) .append('g') .attr('transform', 'translate(' + 30+ ',' + 30 + ')') arr.forEach(function(d){ plot.append('circle') .attr('cx', d.a*900) .attr('cy', d.b*450) .attr('r', d.c*10); }); </script> </body>
https://d3js.org/d3.v4.min.js