Post

🧵Okay let's do some BTS for Axios' elections #dataviz. 1/5: We used <canvas> for our big maps, which means we had to do some tricks with color hashes to get interactivity. What the reader sees vs. what the computer sees. Details on how it works: observablehq.com/@camargo/can...

Jacque Schrag@jacqueschrag.com

With so much election #dataviz to choose from, pretty pleased to have the map I worked on for Axios included. Thinking about sharing some behind-the-scenes look at what we did, so stay tuned for that.

Sean Lynch

@techniq.dev

15 Nov 2024

Impressive work! I've reached for <canvas> for complicated maps and leveraged the same interactivity approach (abstracted as `<HitCanvas>` on LayerChart). The antialiased edges still cause some missed pointer hits along the edges, but it works great overall. www.layerchart.com/docs/compone...

Sean Lynch

@techniq.dev

I also considered using a r-tree/flatbrush technique, but ultimately the API for the HitCanavs was simpler (and doesn't require an external dependency / r-tree implementation). I plan to re-investigate this technique in the future. github.com/techniq/laye...

github.comCanvas events for path shapes · Issue #153 · techniq/layerchartWhile a voronoi or quadtree can be used as a technique for single point events (i.e. tooltips), hit detection for paths/rects/etc (ex. GeoPath or Pie arcs) are more challenging. Using the r-tree al...

15/11/24, 12:21 pm0 reposts3 likes

No replies yet.