TileCache を使用してマップの既知の部分を事前にキャッシュし、それらを PhoneGap モバイル アプリ データベースに保存し、OpenLayers を使用してロードする方法についての良いチュートリアルはありますか?
私は多くのチュートリアルを経験しましたが、これらすべてを一緒に行う方法をまだ見つけていません。
TileCache を使用してマップの既知の部分を事前にキャッシュし、それらを PhoneGap モバイル アプリ データベースに保存し、OpenLayers を使用してロードする方法についての良いチュートリアルはありますか?
私は多くのチュートリアルを経験しましたが、これらすべてを一緒に行う方法をまだ見つけていません。
独自のタイルがあり、それらをアプリケーション アーカイブに埋め込んでいる場合は、Leaflet を使用してローカル タイルをレンダリングできます。http://leafletjs.com/
カスタム タイルがリモート (サーバー上でホストされている) の場合でも、オフライン シナリオでそれらを使用することはできません。よろしければこちらのブログ
をご覧ください。
リーフレット タイルをオフラインで使用する可能性は十分にあります。タイルに使用するパスをローカル パスに変更するだけです。
例:
デフォルト:
// add a CloudMade tile layer with style #997
L.tileLayer('http://{s}.tile.cloudmade.com/[API-key]/997/256/{z}/{x}/{y}.png', {
attribution: 'Map data'
}).addTo(map);
オフライン:
L.tileLayer('file://path_to_your_tiles/{z}{x}{y}.png', {
attribution: 'Map data'
}).addTo(map);
タイルが同じパターンで名前が付けられていることを確認してください (例: 6_17_15.png)。にパターンを変更できます。
ディレクトリ構造を使用してマップ タイルをローカルに保存し、サーバーの構造と一致させて、タイルのローカルの場所に tileLayer を向けることができます。ただし、心に留めておくべきことの 1 つは、マップ タイルの一部のプロバイダーは、タイルをまとめてスクレイピングしてからローカルに保存すると動揺する可能性があることです。アプリを使用する多くの人がこれを行うように奨励するアプリを作成すると、彼らは特に動揺します。このようなアプリは、すぐにブロックされる可能性があります。たとえば、http://wiki.openstreetmap.org/wiki/Tile_usage_policyを参照してください。ローカルに保持する独自のタイルをいつでもレンダリングできます。