web-dev-qa-db-ja.com

キャッシュによってオフラインマップ（リーフレットOSMを使用）を作成する方法は？

ブラウザでキャッシュ（IndexedDB）を使用してオフラインマップを作成しようとしています。私は、インターネットに接続しているときに最初にマップのタイルをダウンロードして保存するという概念を理解しています。

次に、タイルを論理的にオフラインでロードする必要があります。

しかし、それを理解することはできません。

それらをどのように保存し、論理的に再度ロードするのですか？ここで行き詰まっています。地図にはleaflet APIを使用しています。これはどのように実装できますか？

offlineindexeddbleafletoffline-caching
22
Abhi Ram A

これに関する私の広範な研究を参照してください：

オフラインWebアプリケーションのイメージデータの保存（クライアント側のストレージデータベース）

そして：

https://gis.stackexchange.com/questions/44813/database-for-offline-slippy-map-tiles

あなたがやりたいことの鍵は、DBからものを取得するためのFunctional Tileレイヤーです：

https://github.com/ismyrnow/Leaflet.functionaltilelayer

ところで、私は今、これについてPouchDBをテストしています。これは、生のIndexeDBよりもはるかにクリーンです。

私の結果をフォローしてください：

https://groups.google.com/forum/?fromgroups#!topic/pouchdb/RG6wUsAi2R

11
Dr.YSG

キャッシュの実装例 http://tbicr.github.com/OfflineMap/leaflet/index.html とコード https://github.com/tbicr/OfflineMap/tree/master/leaflet_idb_sql_site 。

使用されるストレージについては、IndexedDBおよびWebSQL。ストレージのパフォーマンスは低く、テストされていません。

5
tbicr

同じ問題の解決に取り組んでいます。 tileserverからタイルを保存し、dbからleafletjsにタイルをロードします。

利用可能な場合は、db（indexeddb/webdatabase）からタイルをロードし、タイルサーバー（Access-Control-Allow-Originヘッダーがあるタイルサーバーにフォールバックします。 https：//developer.mozilla。 org/en-US/docs/Web/HTTP/Access_control_CORS＃Access-Control-Allow-Credentials ）

Indexeddbまたはwebdatabaseに現在表示されているタイルを保存するコントロールを実装しました。

コードはオンです https://github.com/allartk/leaflet.offline これは現時点でまだ進行中です！

3
Allartk