出かけた場所などの紹介にGoogleマップのマイマップを使用していたが地図のカスタマイズをやりたくてLeafletを使うことにした
というかLeafletを使ってみたいだけかも
最初に試したのがLeafletのWordPress用プラグイン
これはショートコードを使用して簡単に地図を表示させることができた
とりあえずプラグインを使うことにしてブログ内地図の置き換え作業を行った
しかし・・・
とある問題が発覚！
トレッキングデータ表示用に使用してるプラグイン”WP GPX Maps”が内部でLeafletを使用してて相性が合わないようだ
同じ記事に”WP GPX Maps”と”Leafletプラグイン”で各地図を表示させると”WP GPX Maps”の地図が真っ白となる
やっぱりマイマップに戻そうかな・・・
いやいや”Leafletプラグイン”やめて独自にLeafletを使って再チャレンジすることに！
解決策は”iframe”
地図専用のページを作成して記事内に取り込む！
そうすればお互い干渉することはない！
簡単に実現可能だが凝った作りにすると意外と大変
データをどうするか？DB？
それを読み込むには？
表示するマーカーの種類はどうする？
地図の切り替えはどうする？
できるだけ汎用性の高いプログラムにするにはどうするか？
調べては試すの繰り返しでなんとか完成した
これは”WP GPX Maps”と独自Lefeletを同時表示した例
(画像をクリックすると別窓でそのページが開く)
とても納得のいく地図となった(^^)
Lefeletって最高だね！
コメント