A map minimap in SVG
· Updated
A recipe for a map with a minimap, using d3-geo, nested SVGs, viewBox, and <use>
I’m Jules. I’m a software engineer with a background in .
I like thinking about reduced representations. Maps, charts, diagrams, and engineering models all leave out most of reality to get the essentials across, and that is exactly what makes them understandable and useful. I like building on the web because it's a great medium for sharing them, and for making more things interpretable for more people.
At the moment, I’m working on making geotechnical data more useful at 
Bedrock.engineer.
Latest Writing
NS Line Diagrams, Recreated and Redesigned
A dive down a rabbit hole recreating and redesigning the line diagrams I saw on Dutch railway platforms, in code.
A macOS-style zoom loupe in SVG
A recipe to make a zoom loupe that follows the pointer, using nested SVGs,
viewBox, and<use>Hoistable SVG Defs, Take Two: Impersonating the DOM
Deduplicating SVG definitions in React by portaling them into a plain object that impersonates a DOM node, the trick behind React Aria's Collections.
Hoistable SVG Defs in React
Colocating SVG definitions with the components that use them, using portals and context. An overengineered but instructive exercise.