PukiWikiにgooglemaps3を導入して、Google MAPを表示する方法


投稿日:2014年5月15日
  • 0
  • 0



googlemaps3プラグインを入れれば簡単に表示できます

googlemaps3

googlemaps3は以前紹介したgooglemaps2の後継です。Google Map APIの変更に合わせてバージョンアップされました。

公式ページ:PukiwikiでGoogleMaps3


使い方

基本的な使い方は2と変わリません。
地図の作り方などは以前の投稿で紹介したのでそちらを参照してください。

解凍したファイルをPukiWikiのプラグインフォルダに入れるだけです。(以前のバージョンgooglemaps2_hogeというファイルがある場合は削除してください。)

注意点があるとすれば「旧バージョン(2.3)から3.1の廃止、変更点(この章もういらない?)」という解説にありますが、kmlファイルの指定がgeoxmlからkmlに変わっています。

アクアリウムWiki Mapでは以下のように指定しています。

指定方法

&googlemaps3(width=590px, height=500px, lat=35.746512, lng=139.680176, mapctrl=small, zoomctrl=normal, streetviewctrl=normal, kml=http://aqwiki.net/aqmap.kml);

わざわざ作っていただいたpreserveviewport

自動でマーカーを追加した範囲全体を表示してくれるんですが、私の場合は特定のマーカーを拡大表示したかったのでコメント欄で質問したところ「preserveviewport」というオプションを追加していただきました。感謝感謝

preserveviewportを利用した例:アクアショップ郡山

指定方法

&googlemaps3(width=590px, height=300px, lat=37.4299652, lng=140.38072820000002, mapctrl=small, zoomctrl=normal, zoom=14, streetviewctrl=normal, preserveviewport=true, kml=http://aqwiki.net/aqmap.kml);

公式ページでもサンプルをたくさん用意してくれているので参考にしましょう。


追記

Google Earth(リリース 4.0 以降)ではdescriptionタグにURLを記述すると自動でリンク表示されるようになりました。
しかしこの機能はGoogle map上では正常に機能しますが、プラグインを利用して地図を表示している場合にはリンクが文字列として表示される不具合があります。

description内でタグを使う倍はCDATAで囲みますが、リンクだけはGoogle map上で自動的にリンクにするため、CDATAの外に記述する必要があるようです。

なんでリンク限定でこんな訳の分からない機能を付けたのかわかりませんが、Google map以上のマップAPIは無いので、長いものには巻かれろ精神で修正しますw


現在のページを共有する



現在のページに関連する記事

PukiWikiにgooglemaps3を導入して、Google MAPを表示する方法 PukiWikiにgooglemaps2を導入して、GoogleMAPを表示する方法
PukiWikiにgooglemaps3を導入して、Google MAPを表示する方法 Google Map APIでカスタムアイコンが表示されない不具合
PukiWikiにgooglemaps3を導入して、Google MAPを表示する方法 lazysizesの使い方を通して学ぶ、画像の遅延読み込みとレスポンシブイメージの基本
PukiWikiの初期設定 PukiWikiの初期設定
PukiWikiにgooglemaps3を導入して、Google MAPを表示する方法 PukiWikiのロゴURLを変更
PukiWikiにgooglemaps3を導入して、Google MAPを表示する方法 Google Feed APIの代替手段としてjQueryだけでRSSを表示する方法
PukiWikiにgooglemaps3を導入して、Google MAPを表示する方法 Google Hosted Librariesを利用して相互RSSを作る方法

おすすめの記事

エンティティとデコード用プラグイン「Entity Decode Button」を作成しました

エンティティとデコード用プラグイン「Entity Decode Button」…

Apacheのmod_expiresでファイルタイプごとにキャッシュをコントロールする方法

Apacheのmod_expiresでファイルタイプごとにキャッシュをコント…

DELL Inspiron 3250のHDDをSSDへ換装して、メモリを16GBへ増設

DELL Inspiron 3250のHDDをSSDへ換装して、メモリを16GBへ増設

サーバリソースをリアルタイムに監視するdstatのインストールと使い方

サーバリソースをリアルタイムに監視するdstatのインストールと…

ImageMagickをWindowsのXAMPPに導入する方法

ImageMagickをWindowsのXAMPPに導入する方法

「アマレコTV」でWindows 10のPC画面に表示されている動画を撮影する方法

「アマレコTV」でWindows 10のPC画面に表示されている動画を撮…

サーバの処理を自動実行するcronの仕組みと応用法

サーバの処理を自動実行するcronの仕組みと応用法

本気で作りたい人向け、WordPressプラグインの作成方法

本気で作りたい人向け、WordPressプラグインの作成方法


コメントを残す

コメントは認証制のため、すぐには反映されません。

プログラミングに関する質問は「日本語でプログラミングの悩みを解決するQ&Aサイト sukegra」をご利用ください。