{"id":20398356,"url":"https://github.com/nickpeihl/offline-maps-playground","last_synced_at":"2026-03-16T08:33:56.712Z","repository":{"id":147063305,"uuid":"84598727","full_name":"nickpeihl/offline-maps-playground","owner":"nickpeihl","description":"An experiment in storing and displaying custom vector tiles from IndexedDB (using level-js)","archived":false,"fork":false,"pushed_at":"2018-01-31T20:40:40.000Z","size":1431,"stargazers_count":27,"open_issues_count":4,"forks_count":2,"subscribers_count":2,"default_branch":"gh-pages","last_synced_at":"2025-04-12T13:12:20.222Z","etag":null,"topics":["gis","indexeddb","level-js","offline-first","vector-tiles","webmaps"],"latest_commit_sha":null,"homepage":"https://nickpeihl.github.io/offline-maps-playground/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/nickpeihl.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null}},"created_at":"2017-03-10T20:36:14.000Z","updated_at":"2024-05-16T23:13:47.000Z","dependencies_parsed_at":null,"dependency_job_id":"5916003d-22fa-4fd0-bd0d-b31fcd41c198","html_url":"https://github.com/nickpeihl/offline-maps-playground","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nickpeihl%2Foffline-maps-playground","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nickpeihl%2Foffline-maps-playground/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nickpeihl%2Foffline-maps-playground/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/nickpeihl%2Foffline-maps-playground/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/nickpeihl","download_url":"https://codeload.github.com/nickpeihl/offline-maps-playground/tar.gz/refs/heads/gh-pages","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248571876,"owners_count":21126522,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["gis","indexeddb","level-js","offline-first","vector-tiles","webmaps"],"created_at":"2024-11-15T04:20:42.914Z","updated_at":"2026-03-16T08:33:56.685Z","avatar_url":"https://github.com/nickpeihl.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Offline maps playground\n\nAn experiment in storing and displaying custom vector tiles from IndexedDB (using [level-js](https://github.com/maxogden/level.js)).\n\nWork in progress\n\n![screenshot](screenshot.png)\n\n## Demo\n\n[http://npeihl.com/offline-maps-playground](http://npeihl.com/offline-maps-playground)\n\nClick the checkmark button to save map layers into IndexedDB. When complete the layers should display on the map. The map layers persist even after reload and in an offline state.\n\n## What's going on here?\n\nOn the first load you are presented with a blank map canvas. When you click the checkmark button, the web application downloads [Natural Earth](http://naturalearthdata.com) GeoJSON files from [GeoJSONXYZ](http://geojson.xyz). \n\nThese GeoJSON files are then converted into [Mapbox Vector Tiles](https://www.mapbox.com/vector-tiles/) within the browser. These tiles are stored in the browser's [IndexedDB](https://developer.mozilla.org/en-US/docs/Web/API/IndexedDB_API) database for offline use. Progress is logged in the browser developer console.\n\nAfter the tiles are stored, a custom Leaflet module based on [Leaflet.VectorGrid](https://github.com/Leaflet/Leaflet.VectorGrid) is used to request and display the tiles from IndexedDB as a custom [offline-first](http://offlinefirst.org/) basemap. The basemap tiles persist for display even after closing and reopening the browser. Clicking the checkmark button again refreshes the tile cache.\n\nThe map's zoom levels are limited to between 0 and 5. This is because it takes a rapidly increasing amount of time and storage to construct tiles over zoom level 5 for the entire earth. Additionally, the Natural Earth datasets being used are designed for small scale maps. We could limit the map extent to a small area and introduce regional datasets for a local offline map (see [this commit](https://github.com/nickpeihl/offline-maps-playground/tree/12eac18f54debbf8835b5056a5630cbaccd0f1ad)).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnickpeihl%2Foffline-maps-playground","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fnickpeihl%2Foffline-maps-playground","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnickpeihl%2Foffline-maps-playground/lists"}