GoogleMap

[wp] GoogleMaps を記事本文内に埋め込むショートコードの作成(基本)

2010/03/17 wordpress No comments , ,

各記事ごとにマップを埋め込むのはプラグイン使えばいいんだけど、
地図のポイントと記事を連動させる必要がない場合もあるし、
WordPressのページ機能で作成されたページ(例えば会社概要だとか)にだけ埋め込みたいとか、
地図に表示するマーカーが複数あるとか、タブで表示する情報を自由に制御したい…なんてケースもあるわけで。

プラグイン使うほどでもないならショートコード自作して埋め込めばいいじゃないか! 😀 という記事です

単体マーカー

(さらに…)

[GoogleMaps] グーグルマップとストリートビューを双方向連動表示させる

2010/01/04 GoogleMap No comments , , ,

久しぶりにGoogleマップ弄ったらいろいろと変わっていたので遊びついでに作ってみた。
Ajaxローダーを利用して導入しやすく作ってみたので是非お試しあれ!

このスクリプトは、Googleマップとストリートビューを同時に表示した上で、移動した時の表示を連動させるものです。

  • GooleMapsで中央に表示している地点がストリートビューに対応している場合、ストリートビューを表示
  • Googleマップでマーカーを移動したらストリートビューも移動させる
  • ストリートビューで移動したらマップのポイント(中心)も移動させる
  • ストリートビューで表示している場所の住所表示
  • ストリートビューに未対応の場合エラーを表示する
  • 3Dコントローラーの利用

GoogleMapsとStreetViewの双方向連動表示

DEMOはこちら

使用上の注意

  • 光のような高速回線環境でないと表示がもたつきます
  • ローカル環境(サーバーではない)ではクリック移動時のストリートビューが機能しません
  • ストリートビューを表示する要素は、直接縦横のサイズを指定しないと横幅が100%になります
  • MITライセンスです

(さらに…)

GoogleMapSample11:複数のマーカーを表示(応用編)

2008/05/28 GoogleMap No comments ,

Sample8の応用スクリプト。リンクをクリックしたら対応したマーカーを表示する。
支店マップとか散策マップみたいな用途に向いてる。


(さらに…)

Transparency GoogleMaps

2008/02/20 GoogleMap No comments ,

GoogleMapを透明にしたいしたい!と言い出して作ったボツになった方をこっちにのせとく…。
CSSで半透明というのではなく、陸の部分だけ不透明で他透明ということをやりたかった。
透過GIFのほか、アルファチャンネルpngも使用出来る。(しかもpngはIEでも表示される!)

(さらに…)

GoogleMapSample7:XMLと非同期RPC(“AJAX”)の利用

2008/02/08 GoogleMap No comments ,

サーバー上にあるXMLファイルを読み込んでマーカーを表示する。
公式サンプルそのまま。

(さらに…)