D3
OG
Old school D3 from simpler times
All examples
By author
By category
About
jrzief
Full window
Github gist
Spinning World
Built with
blockbuilder.org
<!DOCTYPE html> <head> <meta charset="utf-8"> <script src="https://d3js.org/d3.v4.min.js"></script> <script src="https://d3js.org/topojson.v1.min.js"></script> <style> body { margin:0;position:fixed;top:0;right:0;bottom:0;left:0; } </style> </head> <body> <svg width="960" height="500"></svg> <script> // Feel free to change or delete any of the code you see in this editor! /* var svg = d3.select("body").append("svg") .attr("width", 960) .attr("height", 500) */ const path = d3.select('svg').append('path'); const projection = d3.geoOrthographic(); const geoPath = d3.geoPath().projection(projection); d3.json('world-110m.json', (error, world) => { const land = topojson.feature(world, world.objects.land); d3.timer(t => { projection.rotate([t * 0.05, Math.sin(t * 0.0005) * 45]); path.attr('d', geoPath(land)); }); }); </script> </body>
https://d3js.org/d3.v4.min.js
https://d3js.org/topojson.v1.min.js