I built a vector map from scratch

Fantastic post, such a wonderful step by step guide!<p>Although everything loaded and “worked” on mobile (I’m using iOS), two small interaction hiccups would be great to solve:<p>- when panning (on mobile), the panned distance seemed to track the finger’s movement with some factor i.e. when moving “1 cm” of “finger space” (i.e. real world movement), the map moved by more than “1 cm”. (Sorry for the weird units, ha)<p>- the common pinch zoom gesture is either being detected as something else or just not working? I was able to zoom, somehow, but not in any controlled way<p>These don’t take anything away from the tutorial! I think that fixing these would make the learning&#x2F;demo experience even smoother, that’s all.<p>I may give it a stab since you shared the code :) Cheers<p>---<p>Opened an issue to track this: <a href="https:&#x2F;&#x2F;github.com&#x2F;kochis&#x2F;webgl-map&#x2F;issues&#x2F;1" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;kochis&#x2F;webgl-map&#x2F;issues&#x2F;1</a>

I&#x27;ve been working with maps&#x2F;mapbox for like 10 years, and knew of webgl and used libraries that used it but never myself. I&#x27;ve never dug into this level of detail for rendering. It&#x27;s been a while since I&#x27;ve seen such a high-effort post on HN, thanks for this, it&#x27;s great.

This reliably and repeatedly locks up and crashes my mobile embedded browser and its parent app, my HN reader (Materialistic). I&#x27;ve never seen a more aggressively crashing site in all my years... took me 6 tries to post this comment, only once I bypassed the linked article&#x2F;site.

Whoa, zooming and panning too fast crashed the entirety of Firefox. All windows just gone in an instant. How is that even possible nowadays?

This is great. I was thinking about doing something like this recently; however, I was considering WebGPU. Did you give any consideration to WebGL vs WebGPU for this purpose?

Nice tutorial! Brace yourself for the next step (text rendering and label placement) — this is way more difficult than it may seem at first, and contributes to a lot of complexity in Mapbox GL JS.

This tutorial is absolutely fantastic.

Thanks for sharing this! I recently went through the process of generating vector tiles for the world at all zoom levels using OpenMapTiles. Seemed like a fun way to make my computer sweat for a while. The process was pretty straightforward, but thought I might as well share the resulting mbtiles file here if anyone wants it.<p>Link to torrent: <a href="https:&#x2F;&#x2F;kiwiziti.com&#x2F;vector.mbtiles.torrent" rel="nofollow">https:&#x2F;&#x2F;kiwiziti.com&#x2F;vector.mbtiles.torrent</a>

I&#x27;ve been digging deep into the MapLibre GL Native source code this week to understand how it is built, and it turned out to be a huge and very complex project.<p>Yesterday I was wondering how hard it would be to implement a custom map which makes use of vector and raster tiles, and here is an article which is basically a step-by-step tutorial on how to build one.<p>Wow! It is amazing, very succinct and well-written, congratulations and thanks for sharing!

Having done this, with the added difficulty layer of completely geo-referencing a non-Earth world map from scratch in QGIS instead of using existing data, this is comprehensive, easy to read, with great examples. Fantastic work. It makes me want to finally write up the geo-referencing work in a similar format.

Wow I didn’t know maps are actually just a bunch of triangles. Really nice + comprehensive post.

Is there any simple way to generate some tiles for a small region (e.g. park or tiny village) to serve pbf files from static server (or CDN)? Map data won&#x27;t change too often.

The demo map crashed my iPhone in the weirdest way. After zooming in and out a bit, the screen went dark, then fully <i>pink</i>, then it restarted.

Looks great on desktop, but crashes Chrome on Android (beefy specs). Great work and awesome topic anyway!

I miss posts like these. Great work! Easy to understand and the result is just incredible.

This is pretty cool! Initially I thought it was a data structure :D

The tile server appears to be toast.