{"id":20986260,"url":"https://github.com/hermanho/react-leaflet-pouchdb-tilelayer","last_synced_at":"2025-09-07T05:37:00.415Z","repository":{"id":35038840,"uuid":"199463100","full_name":"hermanho/react-leaflet-pouchdb-tilelayer","owner":"hermanho","description":null,"archived":false,"fork":false,"pushed_at":"2024-04-03T18:22:38.000Z","size":1547,"stargazers_count":4,"open_issues_count":4,"forks_count":4,"subscribers_count":3,"default_branch":"main","last_synced_at":"2024-10-31T22:35:28.167Z","etag":null,"topics":["pouchdb","react","react-leaflet","tilelayer"],"latest_commit_sha":null,"homepage":null,"language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/hermanho.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2019-07-29T13:56:00.000Z","updated_at":"2023-02-01T16:16:42.000Z","dependencies_parsed_at":"2024-06-21T05:44:17.922Z","dependency_job_id":"fb174bac-990a-4719-a87c-504604305799","html_url":"https://github.com/hermanho/react-leaflet-pouchdb-tilelayer","commit_stats":{"total_commits":43,"total_committers":1,"mean_commits":43.0,"dds":0.0,"last_synced_commit":"55fd0ca85189fe6c9166e27ff4c3a5760bf8fad1"},"previous_names":[],"tags_count":20,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hermanho%2Freact-leaflet-pouchdb-tilelayer","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hermanho%2Freact-leaflet-pouchdb-tilelayer/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hermanho%2Freact-leaflet-pouchdb-tilelayer/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hermanho%2Freact-leaflet-pouchdb-tilelayer/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/hermanho","download_url":"https://codeload.github.com/hermanho/react-leaflet-pouchdb-tilelayer/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":225304024,"owners_count":17453037,"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":["pouchdb","react","react-leaflet","tilelayer"],"created_at":"2024-11-19T06:12:53.164Z","updated_at":"2024-11-19T06:12:53.798Z","avatar_url":"https://github.com/hermanho.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# react-leaflet-pouchdb-tilelayer\n\n[![version](https://img.shields.io/npm/v/react-leaflet-pouchdb-tilelayer.svg?style=plastic)](http://npm.im/react-leaflet-pouchdb-tilelayer)\n\n[![leaflet compatibility](https://img.shields.io/npm/dependency-version/react-leaflet-pouchdb-tilelayer/peer/leaflet.svg?style=plastic)](https://github.com/hermanho/react-leaflet-pouchdb-tilelayer)\n[![react-leaflet compatibility](https://img.shields.io/npm/dependency-version/react-leaflet-pouchdb-tilelayer/peer/react-leaflet.svg?style=plastic)](https://github.com/hermanho/react-leaflet-pouchdb-tilelayer)\n[![react compatibility](https://img.shields.io/npm/dependency-version/react-leaflet-pouchdb-tilelayer/peer/react.svg?style=plastic)](https://github.com/hermanho/react-leaflet-pouchdb-tilelayer)\n[![pouchdb compatibility](https://img.shields.io/npm/dependency-version/react-leaflet-pouchdb-tilelayer/peer/pouchdb.svg?style=plastic)](https://github.com/hermanho/react-leaflet-pouchdb-tilelayer)\n\nReact version of [Leaflet.TileLayer.PouchDBCached](https://github.com/MazeMap/Leaflet.TileLayer.PouchDBCached)\n\n## Installation\n\n### Install via NPM\n\n```bash\nnpm i react-leaflet-pouchdb-tilelayer --save\n```\nOR\n```bash\nnpm i react-leaflet-pouchdb-tilelayer@3.2.2-beta --save\n```\n\n### Demo\n\nhttps://codesandbox.io/p/sandbox/strange-field-t7l4ly\n\n### Usage with React-Leaflet v3\n\nThis plugin is compatible with version 2 of React-Leaflet\n\n```javascript\nimport { Map, TileLayer, LayersControl } from \"react-leaflet\";\nimport PouchDBTileLayer from \"react-leaflet-pouchdb-tilelayer\";\n\n\u003cMap center={[22.287, 114.1694]} zoom={15}\u003e\n  \u003cLayersControl position=\"topleft\"\u003e\n    \u003cLayersControl.BaseLayer checked name=\"PouchDBTileLayer\"\u003e\n      \u003cPouchDBTileLayer\n        useCache={true}\n        crossOrigin={true}\n        attribution='\u0026copy; \u003ca href=\"http://openstreetmap.org/copyright\"\u003eOpenStreetMap\u003c/a\u003e contributors'\n        url=\"https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png\"\n      /\u003e\n    \u003c/LayersControl.BaseLayer\u003e\n    \u003cLayersControl.BaseLayer name=\"TileLayer\"\u003e\n      \u003cTileLayer\n        url=\"https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png\"\n        attribution='\u0026copy; \u003ca href=\"http://osm.org/copyright\"\u003eOpenStreetMap\u003c/a\u003e contributors'\n      /\u003e\n    \u003c/LayersControl.BaseLayer\u003e\n  \u003c/LayersControl\u003e\n\u003c/Map\u003e;\n```\n\n## Control options\n\n### position\n\n`{ useCache: true }`\n\nEnable the cache logic\n\n### saveToCache\n\n`{ saveToCache: true }`\n\nSave the map tile to PouchDB\n\n### useOnlyCache\n\n`{ useOnlyCache: false }`\n\nLoad from PouchDB cache and do not download from web\n\n### cacheFormat\n\n`{ cacheFormat: 'image/png' }`\n\nThe mine type\n\n### cacheMaxAge\n\n`{ cacheMaxAge: 3600000 }`\n\ncache age in millisecond unit\n\n### cacheNextZoomLevel\n\n`{ cacheNextZoomLevel: true }`\n\npre-load and cache the next level tile\n\n\n\n## Development\n1. Clone the project\n2. Run ```npm install```\n3. Run ```npm run build```\n4. Start coding\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fhermanho%2Freact-leaflet-pouchdb-tilelayer","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fhermanho%2Freact-leaflet-pouchdb-tilelayer","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fhermanho%2Freact-leaflet-pouchdb-tilelayer/lists"}