D3
OG
Old school D3 from simpler times
All examples
By author
By category
About
ruridge
Full window
Github gist
Spirals1: 8 points with 45° spacing
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> <script> var width = 500, height = 500, margin = {top: 0, left: 0, right: 0, bottom: 0}; var data = [], i = 0; for (i; i < 8; i++) { var x = Math.cos(degToRad(i * 45)) * 200; var y = Math.sin(degToRad(i * 45)) * 200; data.push({x: x, y: y}); } var svg = d3.select("body").append("svg") .attr("width", width) .attr("height", height) .attr("viewBox", [-width/2, -height/2, width, height]); svg.append("g") .selectAll("circle") .data(data) .enter() .append("circle") .attr("r", 5) .attr("cx", d => d.x) .attr("cy", d => d.y); // Helpers function degToRad(deg) { return deg * Math.PI / 180; } </script> </body>
https://d3js.org/d3.v4.min.js