サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
Pixel 9
lendl.sakura.ne.jp
地図タイルの試作 地図タイルの仕組み L.TileLayer で地図でない画像を扱う練習をするにあたり、できれば本物の地図でないタイルのサンプルセットが欲しかったんですが、そういうものをすぐ拾える心当たりがなかったので自分でタイルを作ってみました。 Leaflet は Google Maps モデルの地図タイル をそのまま使えるので 256×256 ピクセルのタイルをズームレベル0からズームレベルが1つあがるたびに縦横が2倍に拡大されるようにデータを作成します(実際には大きい画像から縮小しますけどね)。今回は 1024×1024 ピクセルの画像を用意してズームレベル0~2のタイルを作成しました。 こうして作ったタイルを L.TileLayer で読み込むには最初の引数で指定する URL がタイルのファイル配置と一致している必要があります。 L.tileLayer('tiles/{z}/{x
Leaflet で画像を扱う方法 まずは Leaflet で地図ではない画像を扱う方法を学びます。 基礎知識 GIS GISとは・・・(国土地理院) 測地系 日本の測地系(国土地理院) CRS Spatial reference system – Wikipedia 座標参照系とは何でしょうか?(国土地理院) 画像をベースにした地図 ドキュメント類にざっと目を通した感じだと、ゲームマップのような画像を Leaflet で地図のように扱うには、L.ImageOverlay を使って画像1枚を拡大縮小させる方法と、画像から Google Maps モデルの地図タイル を生成して L.TileLayer でズーム表示させる方法があるようです。 Leaflet にはこういう用途のときのための CRS(座標参照系)として L.CRS.Simple が用意されていて、緯度経度をシンプルな x, y に
このページを最初にブックマークしてみませんか?
『lendl.sakura.ne.jp』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く