#やりたいこと
leafletを使って、自前の画像を利用して、GoogleMapのように画像を動かしたいです。
必要な機能は、
1.自前の画像が使えること
2.東西南北移動ができる
3.拡大縮小ができる
4.画像の座標がマイナスになっても良い
5.任意の画像をスケールとして表示できる
6.最初に表示される位置を任意に指定できる
具体的に言いますと、下のリンク先にあるようなものを、自前の画像でやりたいです。
(リンク1) https://teratail.com/questions/30916
(リンク2) https://qiita.com/wakufactory/items/13204ae04f39b7bbeb51
基本的に上記のアドレスにあるソースを改造してやろうと思いますが、どの部分を変えたらいいでしょうか?
#発生している問題
同様の物をGoogleMapのAPIで試したものがこちらです。
(リンク3) http://souzoumap.webcrow.jp/Smap/gmap3/
最初に表示される位置を任意に指定できなかったうえ、ある日突然、x座標がマイナスになる領域の画像が表示されなくなるトラブルが発生しました。
そこで、改めて自由度の高そうなleafletで作り直したいと思います。
#分割した画像に関して
分割されたそれぞれの画像は、
・全部で400枚くらいある
・大きさは、どれも全て「縦2377×横1681 ピクセル」
・ズームレベルと位置座標に基づいた、以下に示すような番号がついている
jm_[ズームレベル][南北方向の位置][東西方向の位置].png
地図はメルカトル図法ではありません。
よって、リンク2にあるように、タイルのピクセルサイズを緯度経度として使いたいです。
南北方向の位置や東西方向の位置は、0よりも左側や上側にも地図が広がっているため、マイナスにもなります。
リンク3では、なぜかxがマイナスになる領域の画像が表示されません。1週間くらい前までは表示されていたのですが、ある日突然表示されなくなりました。
#初期位置・初期ズームレベルに関して
最初に読み込んだときに表示される位置を指定できるようにしたいです。
リンク3では、最初に表示される位置はjm_17_0_0.png付近で、それ以外の場所を初期位置に指定する方法が分かりませんでした。
あなたの回答
tips
プレビュー