pawn002/d3-animated-map-reference — reverse-engineered prompt

Build me a small reference app in Angular with D3 that shows an animated world map using a proper geographic projection, starting with a simple flat equirectangular view. I want it to feel smooth when I drag to pan and use the mouse wheel to zoom, with a Reset View button and a little FPS readout so I can see performance. Please do the map movement with a custom requestAnimationFrame animation loop instead of D3’s normal transition system, since the whole point is to animate the map projection cleanly and keep it around 23 fps or better.

Include sample GeoJSON world data and a few city points, plus two demo tours that animate between preset regions and major cities. Keep the code organized so it is easy to swap in other projections later and leave room for a canvas rendering mode in the future. I’d like this to feel like a clear learning reference, not just a demo, so readable code and sensible structure matter. If you need details, look up current docs online.