各記事、ページ内の任意の場所にGoogle マップを貼り付けるためのプラグイン Google Maps Anywhere をリリースしました。
ダウンロードと詳細な使用方法については WordPress Plugins/JSeries を参照してください。
WordPress 2.5 以降で実装された「メディアボタン」と「ショートコードAPI」を使用しているため、WordPress 2.5 以降でしか動作しません。
っていうか、メディアボタンを操作する方法を調査するために作ったプラグインです。
プラグインを有効化すると、メディアボタンの右端に「Googleマップを追加」ボタンが追加されます。
Googleマップを検索して位置情報を取得する画面が表示されるので、ここから検索して「投稿に挿入」できます。
あと、おまけ機能として「カスタムフィールドに追加」ボタンも付けておきました。
Lightweight Google Maps で使用するカスタムフィールドの検索用としても使えますよ。
注意事項
2008/10/30 追記
右図のように Google Map の枠内に地図が表示されず、グレーの背景のみが表示される場合は style.css の記述が影響している可能性があります。
具体的には、以下のように img 要素の max-width プロパティを設定している場合。
img {
max-width:100%;
}
これを回避するには、style.css の最下行に以下の記述を付け加えて、img エレメントの max-width プロパティをリセットしてください。
div.each_map img, div.googlemaps img {
max-width:none;
}
つぶやく
RSSリーダーで購読する
をかもとさま、初めまして。
先日、「Google Maps Anywhere」プラグインをwordpressに入れてみました。
インストールまではうまくいったのですが、ブラウザで閲覧すると、縦150px・横300pxぐらいのアイボリー（グレー？）の背景色で塗りつぶされた四角いフィールドだけが出て、地図自体が表示されません。
リロードすると、一瞬だけ地図が見えますが、1秒後には消えます。
上記の色背景と、左上に「拡大・縮小」の+-ボタン、左下にロゴ、右下にzenrinという地図業者の文字だけが出ています。
また、表示する地図を決める画面で、「ストリートビュー」タブを押すと、右上の×を押していないのに画面が閉じたり、再度開いても地図画面が真っ白だったりもします。
OSはwin XP、ブラウザはIE7.0を使用しています。
解決方法を検索中に、FireFoxだと不具合が出たこともある…というのを拝見しましたが、IEでは無いような感じですが、どうでしょうか？
よろしければ、解決方法を教えていただければ幸いです。
（別にまとめサイトなどありましたら、誘導いただければ幸いです）
よろしくおねがいします。
※Win版Safari 3.1.2では無事表示されました。
※Win版FireFox 2.0.0.7では表示されませんでした。
rizzy さん、はじめまして。
以前 Firefox 2 で出ていた問題は、今回の問題とは別で、地図貼り付け時の問題でした。
今回のは、別の問題みたいですね。
サイトを見させてもらったのですが、原因が確定できません。
とりあえず、ソースを見直した新バージョンがあるので、こちらで確認してもらってもよいですか？
https://sourceforge.jp/projects/wppluginsj/downloads/33548/googlemaps-anywhere-0.3.6.zip(2008/10/29 23:20 不具合があったため、削除しました)
をかもとさま、こんにちは。
迅速なお答えとご対応に感謝します！
さっそく新verに変えたところ、地図が表示されました！
しかしまだ下記の問題があります。
・をかもとさまのサンプル表示だと、表示されている地図自体をドラッグして画面内で移動できるが、こちらではできない。
クリックしてグーグルマップにジャンプすることだけできる。
・プラグイン作業中に、「ストリートビュー」タブを押すと画面が真っ白になってしまう。もういちどマップビューに戻しても、やはり真っ白のまま。一度選択画面を閉じて再度メディアボタンを押しても、まだ真っ白のままのときがある。
・プラグイン作業で「カスタムフィールドを追加」ボタンを押すと、作業画面が閉じてしまう。
・+-マーク（拡大縮小ボタン）が消えた
また、
Lightweight Google Maps を入れたところ、
・+-マークが出ないが、地図が表示される（右下に、MAP DATA 2008 ZENRINと出る）
・+-マークが出るが、背景色のみで地図が出ない（右下に、地図データ(c)ZENRIN-利用規約と出る）
という2種類の地図の出方に分かれました。
あまりしつこくお聞きしては悪いと思いながらも、気になっているため追加でコメントさせていただきました。
ご容赦ください。
ちなみに、セキュリティソフト（カスペルスキー）を試しに切ってみても、同じ結果でした。
rizzy さん、どもです。
さきほどリリースしたバージョンはバグってました
Ver.0.3.6 を差し替えました。
お手数おかけしますが、もう一度ダウンロードして入れ替えてください。
https://sourceforge.jp/projects/wppluginsj/downloads/33564/googlemaps-anywhere-0.3.6.zip
ストリートビュータブをクリックすると画面が真っ白になるのは IE7 で発生している現象でしょうか？
こちらでは再現できないので、詳しく教えていただくと助かります。
作業画面と言うのが検索画面のことであれば、正常な動作です。
利用者の方の不具合報告は、助かります。
何度でも、コメントください。
また、当コメント欄がまどろっこしいのであればメールいただければ、お答えできます。
Twitter を利用されているのであれば wokamoto まで @ 返信か、DMを送ってもらっても結構です。
をかもとさまへ。
初めまして。coccoと申します。
早速ですが、rizzy さんと同じで下記のようになって困っています。
新版Ver.0.3.6 にも差し替えました。
・をかもとさまのサンプル表示だと、表示されている地図自体をドラッグして画面内で移動できるが、こちらではできない。
クリックしてグーグルマップにジャンプすることだけできる。
※作業画面ではドラッグしたり+-マーク（拡大縮小ボタン）は出ます。
・プラグイン作業中に、「ストリートビュー」タブを押すと画面が真っ白になってしまう。もういちどマップビューに戻しても、やはり真っ白のまま。一度選択画面を閉じて再度メディアボタンを押しても、まだ真っ白のままのときがある。
・+-マーク（拡大縮小ボタン）が消えた
プラスの情報としては、右下に、「Map data (c)2008 NFGIS,ZENRIN」と出ます。(c)は丸の中にc
MAC OSX Safari3.1.2です。
実際のサイトを確認してくださる場合は、メールを頂けたらアドレスをご連絡致します。
よろしくお願い致します。
cocco さん、はじめまして。
JavaScript でエラーが発生している可能性があります。
このプラグインでは jQuery を使用しているのですが、これが Prototype.js または mootools.js とコンフリクトを起こしているのでは無いでしょうか？
# そちらのサイトを確認してみないと、原因は分かりませんが…
どちらにせよ対処方法としては prototype.js , jQuery.js, mootools.js の順でロードして、jQuery.js 読み込み後、mootools.js を読み込む前に
jQuery.noConflict();を呼び出せば、コンフリクトは回避できます。私までメールをいただくか、Twitter を利用されているのであれば http://twitter.com/wokamoto まで＠リプライかダイレクトメッセージをいただければアドバイスできると思いますので、ご連絡ください。
をかもとさまへ。
お世話をかけました。
メールでのご指摘の点を直したら問題なく動作しました。ヤッター！！！ ありがとうございます。
自分の基本的なミスだとは思いますが、同様に困っている方がもしかしたらいるかもしれないので、
転載させていただきますね。
—
拝見させていただきました。JavaScript のロードが正常にできていないようですね。
お使いのテーマに問題があると思われます。
WordPress の管理画面 [デザイン]-[テーマエディタ] で、以下の点を確認してみてください。
ヘッダー（header.php）
・<head> 〜 </head> の間に <?php wp_head(); ?> と言う記述があること。
無ければ、</head> の直前に <?php wp_head(); ?> と言う行を追加してください。
フッター (footer.php)
・</body> の前に <?php wp_footer(); ?> と言う記述があること。
無ければ、</body> の直前に <?php wp_footer(); ?> と言う行を追加してください。
単一記事の投稿(single.php)、ページテンプレート(page.php)
・<?php get_header(); ?> と言う記述があること。
無いようなら、最初の行に <?php get_header(); ?> を追加してください。
(このテンプレートタグを書き込んだ所に ヘッダー（header.php） の内容が読み込まれます。)
ただし、<html> <head> で開始している場合は、</head> の直前に <?php wp_head(); ?> と言う行を追加してください。
・<?php get_footer(); ?> と言う記述があること。
無いようなら、最後の行に <?php get_footer(); ?> を追加してください。
(このテンプレートタグを書き込んだ所に フッター (footer.php) の内容が読み込まれます。)
ただし、</body> </html> で終了している場合は、</body> の直前に <?php wp_footer(); ?>
と言う行を追加してください。
—
私の場合は、ヘッダーとフッターにそれぞれ記述が有りませんでしたので、
追加したら、めでたく動作致しました。
本当にありがとうございました。
cocco さん、どもです。
動作するようになったようで、何よりです。
この辺の情報は ＦＡＱ としてまとめて配布元のページにも書いておきました。
http://wppluginsj.sourceforge.jp/googlemaps-anywhere/google-maps-anywhere-faq/
ストリートビューで投稿しましたが・・・
ほげほげ
しか表示されません。バグでしょうか？どうすればよろしいですか？
貼り付けコードは・・・
[googlemap lat="35.~" lng="139.~" yaw="138.62903225806448" pitch="-0.516129032258071" zoom="0" width="300px" height="300px" type="STREETVIEW"]ほげほげ[/googlemap]
なお
googlemaps-anywhere.1.1.0.zip Ver.1.1.0
をインストールしております。
宜しくお願いします。
うんぽこさん、はじめまして。
この貼り付けコードは正確でしょうか？lat, lng には数値以外は入らないはずなんですが…
ちょっと、この情報だけだと、こちらでも判断しかねます。
少なくとも、以下のことを確認して、ご連絡ください。
お返事ありがとうございます。一応箇条書きでお答えします。
1. 通常の Googleマップを挿入した場合は、表示されるか？
表示されます。こちらは問題ございません。
2. WordPress, PHP のバージョンは？
WP： 2.7.1（デフォルトのリッチテキストを使用） PHP： 5.2.5
3. 試してみたブラウザのバージョンは？
Firefox： 3.0.6
IE： 6.0.29…
4. JavaScript のエラーが発生していないか？
ありませんでした。
5. 差し支えなければ、サイトのURL
ごめんなさい。第三者に頼まれていますので、お許しください。
6. 使用中の「Google Maps Anywhere」以外のプラグインを、すべて停止しても表示されないか？
全て停止して、もう一度Google Maps Anywhereをインストールしなおしても、変わりません。
7. プラグインをすべて停止してストリートビューが表示される場合、一つずつ有効にしていって、どのプラグインを有効にしたときに表示されなくなるか？
8. どのプラグインを有効にしたときに表示されなくなったか分かったら、そのプラグインの名前と配布先、使用しているバージョン
最初からです・・・
Google Maps Anywhereのバージョンを変えたり、文字コードを合わせてもだめでした。
投稿画面では、
[googlemap lat="35.658004" lng="139.745748" yaw="268.5483870967745" pitch="-4.725806451612901" zoom="0" width="420px" height="300px" type="STREETVIEW"]35.658004,139.745748[/googlemap]
でやってみて、
表示部分では・・・（前投稿してたら、Aタグが無効になっちゃいましたね・・・＜＞は全角、URLをhを外します）
＜div class=”googlemaps” style=”width:420px;height:300px;”＞＜a href=”ttp://maps.google.com/maps?f=q&hl=ja&geocode=&q=35.658004,139.745748&ie=UTF8&ll=35.658004,139.745748&t=h&z=15&layer=c&cbll=35.658004,139.745748&cbp=1,268.5483870967745,,0,-4.725806451612901&maptype=STREETVIEW” title=”35.658004,139.745748″＞35.658004,139.745748＜/a＞＜/div＞
になってしまい、
＜div class=”googlemaps” style=”width:420px;height:300px;”＞＜embed src=”http://maps.google.com/mapfiles/cb/googlepano.072.swf” quality=”high” bgcolor=”#000000″ style=”width: 842px; height: 300px; position: relative;” wmode=”opaque” swliveconnect=”false” id=”panoflash1″ allowscriptaccess=”always” type=”application/x-shockwave-flash” pluginspage=”http://www.macromedia.com/go/getflashplayer” scale=”noscale” salign=”lt” flashvars=”panoId=BhnmUUmoKeB1DEhvDTcdkQ&directionMap=N:北,W:西,S:南,E:東,NW:北西,NE:北東,SW:南西,SE:南東&yaw=270&zoom=0&browser=firefox&pitch=-40&viewerId=1&context=api&animateOnLoad=false&useSsl=false&rtfArgs=hl:ja,gl:” align=”middle”＞＜/div＞
は表示されません。
何らかの形で、embedタグが表示されず、地図モードとして認識されているかもしれません。
中身は何もいじっておらず、変な状態です。
よろしくお願いします。
うんぽこさん、どもです。
うーん、挿入されるショートコード自体は問題ないですね。
# 私もテストサイトで、提示されたショートコードを挿入して試してみたんですが、問題ありませんでした。
とすると、使用されているテーマが問題なのかもしれません。
デフォルトテーマに変更して、ストリートビューが表示されるか確認してみてください。
デフォルトテーマで表示されるようであれば、使用されているテーマに問題があります。
テーマに問題がある場合の修正方法は、JSeries の Google Maps Anywhere 配布ページに FAQ としてまとめてありますので、そちらを参照してください。
http://wppluginsj.sourceforge.jp/googlemaps-anywhere/google-maps-anywhere-faq/
たいへん有用なプラグインを提供して頂き、感謝しております。
これまでローカルのアプリで緯度経度を調べていましたのでたいへん楽になりました。
一点だけ、ご報告があります。
当方環境（サーバー：Linux,PHP 5.x,MySQL 4.x WP2.84）
Google Maps AnywhereをCustom Field GUI Utility( Ver.2.1.0)と併用した場合のみの現象です。
Google Maps Anywhereのカスタムフィールド＞「アップロード/挿入」Googlemap挿入ボタン が、
Custom Field GUI Utilitのメディア挿入ボタンを上書きしてしまうようです。
結果、GoogleMap/メディア挿入,,どちらのボタンをクリックしてもGooglemapが開いてしまいます。
あくまでも当方の環境で起きることであり、プラグインのいずれかを使用しなければとくに問題はありません。
また分かっていれば、対処できますので大きな問題とはいえませんが、ご報告しておきます。
marimo さん、はじめまして。
ご報告ありがとうございました。こちらでも、時間のある時に確認しておきます。
はじめまして。
とてもすばらしいプラグインですね！
法人向けのWEBサイト制作をしていまして、GoogleMapsが必要なサイトにはすべて導入させていただいています。
1点、教えていただきたいことがあります。
ブログ内に「地図」で設置したマップをクリックした後の動作についてです。
クリック後に表示されるGoogleMapｓですが、「航空」をデフォルトにしてしまうようです。
クリック後も「地図」で表示するにはどうしたらよいでしょうか？
Crysta さん、どもです。
ホントだ。
以前は、そんなことは無かったんですが、Google 側で仕様変更が有ったんでしょうかね。
確認して、時間のある時に修正します。
ご指摘ありがとうございます。
をかもとさん
Crystaです。返信ありがとうございます。
実は、私もつい最近になってお客さまからのご指摘で気付いた次第です。
お忙しいところ申し訳ありません。修正版、お待ちしています。
Crysta さん、遅くなりまして申し訳ありません。
本日、修正版の Ver.1.1.7 をリリースしましたので、バージョンアップしてやってください。
をかもとさん
こんにちは、Crystaです。
プラグインの修正、ありがとうございます！先ほど管理サイトすべてでバージョンアップいたしました！！
…が、私の設定にどこか間違いがあるのか、他のプラグインが干渉しているのかでしょうか、動作が変わらないのです。
動作を見ていただきたいのですが、メールでご連絡いただくことは可能でしょうか？
コメント欄にお客様のサイトのURLを記載することはできませんので…
個別対応は不可でしょうか？
よろしくお願いいたします。
Crysta さん、どもです。
若干修正しました、これでどうでしょう？
http://dl.dropbox.com/u/110305/googlemaps-anywhere.1.1.7.zip
メールで連絡していただいても、構いませんよ。
# ただし、すぐに対応できるかは保障できませんが…
メールアドレスは、配布ファイルの
googlemaps-anywhere.php行頭の方に Copyright 表記と一緒に書いてあります。をかもとさん
Crystaです。
ご対応いただいていたのに、忙しさにかまけてすっかりお返事が遅くなってしまってごめんなさい…
コメント投稿から、何度も何度もバージョンアップしてくださっていましたね！本当にありがとうございます。
プラグインを導入しているすべてのサイトで、正常動作を確認しています。
お客さまからも「設定がとても楽で使いやすい」と大変ご好評をいただいています。
新規案件やリニューアルの予定がいくつもありますので、ずっと活用させていただきたいと思います！
今後とも、よろしくお願いいたします。
をかもとさん
はじめまして。
いつもGoogle Maps Anywhereを利用させていただいております。
ありがとうございます。
さて、最新の1.2.0にバージョンアップしたところ、
マーカーが表示されなくなってしまいました‥。
以前のバージョンでは問題なかったので、何か仕様に変更がありましたでしょうか？
該当ページはこちらです。
http://www.ita-trust.jp/tochigi/
お手数おかけいたしますが、よろしくお願いいたします。
サイトウ
サイトウさん、はじめまして。
すいません、こちらの不具合でした。修正した Ver.1.2.1 をリリースしましたので、そちらにバージョンアップ願います。
なお、Ver.1.2.x からは、マイマップの表示が可能になりました。
地図を挿入する際に「KML」という欄が追加されているので、そちらにマイマップのKMLファイルのURLを入力して頂くとマイマップがオーバーレイ表示されるようになります。
をかもとさん
早速ご対応いただきまして
まことにありがとうございました。
バージョンアップ後、マーカーが正常に表示されることを確認いたしました。
いずれマイマップの機能も使わせていただきたいと思います。
お忙しいところすみませんでした。
今後ともよろしくお願いいたします。
サイトウ
はじめまして、質問させてください。
[googlemap 省略]東京タワー[/googlemap]
とあった場合、この「東京タワー」という文字列はマーカーに表示される仕様ではないのでしょうか？
てっきりマーカーをクリックすると間の文字列が表示されるのかと思っていたのですが
表示されている地図をクリックするとgooglemaps本体に飛ぶので
それが仕様かどうか教えてください。
takacello さん、はじめまして。
Ver.1.2.3以前の Google Maps Anywhere では、そのような仕様は存在しませんでした。
先ほどリリースした Ver.1.2.4以降で、対応してマーカーにマウスを重ねると情報ウィンドウが表示されるようにしました。
貴重な、ご意見ありがとうございました。
要望があれば、お伝えください。
対応できそうなもの、良さそうなものは取り入れていきます。
をかもと さま
早速ありがとうございました。
WP-SimpleGmapsってのを使っていたのですがadmin画面でエラーが出るので他に良い物を探していてテストしておりました。
稼働中のサイトはバックが黒画面で文字は白系なのですが、情報ウインドウと似たような文字色になり見えにくくなってしまいます。class=”googlemaps”で文字色を指定すれば良いんでしょうか？
takacello さん、どもです。
情報ウィンドウは、Google Maps が出しているモノなので変更はできないです。
背景は画像なので、白地を変更することはムリですね。
文字色は、以下の記述をCSSに追加すれば変更できます。
# color:#000 の所は、お好みの色を指定してください。
FCKeditor をいれると、地図が表示されなかったので報告いたします。
とりあえず、下記ページの方法で動くようになります。
http://www.ii-sys.jp/2010/07/21/google-maps-anywhere-%e3%81%a8-fckeditor-%e3%81%ae%e5%85%b1%e5%ad%98/