TE
TechEcho
Home24h TopNewestBestAskShowJobs
GitHubTwitter
Home

TechEcho

A tech news platform built with Next.js, providing global tech news and discussions.

GitHubTwitter

Home

HomeNewestBestAskShowJobs

Resources

HackerNews APIOriginal HackerNewsNext.js

© 2025 TechEcho. All rights reserved.

Show HN: Show HN: Interactive map of Earth's coastlines if all ice melts

1 pointsby overtowedover 4 years ago

1 comment

overtowedover 4 years ago
Hey author here. This is a map of Earth that uses NASA imagery[1] to roughly sketch how sea levels could change if all ice melts. Estimates of potential sea level rise vary, with most I&#x27;ve seen between 60 and 75 meters. (some are higher) This map shows about a 65 meter rise. The resolution is poor and just pixels, making it more of an aesthetic experience than a scientifically useful one. (there are many good tools for that)<p>The map[2] is not mobile friendly and requires WebGL. I recorded a video that tours through the map to music.[3] It&#x27;s the same experience as pressing &quot;begin tour&quot; on the map. The website version will have better visuals because of video compression.<p>The map is rendered with WebGL via PixiJS and the rest of the app is Svelte. The original DOM implementation was written in Svelte but it was too inefficient, the bottleneck being the DOM and not Svelte. You can test the difference yourself on the map by pressing `ctrl+backtick` to enter dev mode and clicking &quot;webgl&quot; to toggle over to the DOM version. On my machine, the Pixi version drops no frames in all browsers, and for the DOM version, Firefox drops about 1 in 10 frames and Chrome&#x2F;Edge are sludge, seemingly because they&#x27;re shy about using more GPU. The source code readme[4] has some technical notes discussing Svelte and Pixi[5], and it links to original DOM implementation with more comments if you&#x27;re curious.<p>I&#x27;d be glad to answer questions. Not about the science though, I&#x27;m a web developer.<p>[1] <a href="https:&#x2F;&#x2F;visibleearth.nasa.gov&#x2F;collection&#x2F;1484&#x2F;blue-marble" rel="nofollow">https:&#x2F;&#x2F;visibleearth.nasa.gov&#x2F;collection&#x2F;1484&#x2F;blue-marble</a><p>[2] <a href="https:&#x2F;&#x2F;www.cosmicplayground.org&#x2F;#deep-breath" rel="nofollow">https:&#x2F;&#x2F;www.cosmicplayground.org&#x2F;#deep-breath</a><p>[3] <a href="https:&#x2F;&#x2F;www.youtube.com&#x2F;watch?v=7xEPqg-Kyg4" rel="nofollow">https:&#x2F;&#x2F;www.youtube.com&#x2F;watch?v=7xEPqg-Kyg4</a><p>[4] <a href="https:&#x2F;&#x2F;github.com&#x2F;ryanatkn&#x2F;cosmicplayground" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;ryanatkn&#x2F;cosmicplayground</a><p>[5] <a href="https:&#x2F;&#x2F;github.com&#x2F;ryanatkn&#x2F;cosmicplayground#technical-notes" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;ryanatkn&#x2F;cosmicplayground#technical-notes</a>