torque.js internals: how to render 3M animated points on a map
summary
Torque.js renders millions by sending a custom temporal tile format from Postgres that aggregates points into Web Mercator pixels and time bins, so a 1M demo (and a reported 12M Twitter set) becomes compact tiles generated with a single SQL query per tile. Client converts JSON/binary into typed arrays and sprites, caches pre-rendered marker sprites, and draws layers onto a full-screen canvas, compositing several previous frames as semi‑transparent layers to simulate motion while avoiding per‑feature geometry.
AI-written summary · about
chapters (12)
- 0:00Start
- 0:14Confreaks
- 2:05a set of tiles per month
- 3:32pattern
- 5:20torque.js is a library that allows to render points on top of google maps or leaflet...
- 7:22tech
- 8:16quantification {js.geo} and aggreation coordinates and time
- 12:39processing
- 14:38styling - cartocss2js
- 15:11javascript shaders
- 16:42data, style and rendering
- 19:04sprites
related talks
37mVisualizing Large Datasets with JavaScript Using deck.gl
14mHigh Performance Data Visualisation with the M4 Algorithm
40mVisualizing Large Datasets with JavaScript Using Deck.gl
30mMaps Platform: A Deep Dive on Building for Performance and Scale
34mGoogle Maps Reimagined: Crafting Interactive, Animated Experiences
02h 02mInteractive 3D Web Mapping
36mCanvas Pixel Transformation: Beauty comes slowly
16mRaster tiles to vector tiles: how to cross the gulf