Create  Edit  Diff  FrontPage  Index  Search  Changes  History  Source  RSS  Login

google_map.rb - History

{{toc}}

! 概要

GoogleMapを埋め込みます。GoogleでのAPIキー等は不要です。

以下2つの使い方があります。

# 緯度、経度を指定
# 住所または地名を指定


利用の際には、プレビュー画面での確認をお勧めします。(・∀・)

! 設置方法

# githubから取得し、プラグインディレクトリに配置ください。
## http://github.com/tamoot/tdiary_google_map/blob/master/google_map.rb
# 設定画面で有効にしてください。

! 使い方

!! 緯度、経度を指定する場合

 {{google_map '36.695952', '137.213677'}}
 <%= google_map '36.695952', '137.213677' %>

!! 住所または地名を指定する場合

 {{google_geomap '羽田空港'}}
 <%= '羽田空港' %>

!! オプションを追加する場合

本プラグインに指定可能な最後の引数はHashとなっています。
省略可能です。下記の緯度経度指定時のHashでの指定方法と変わりません。


||! シンボル ||! 指定する値について
||! :title   || Map中のマーカーに設定するタイトル。
||! :html    || マーカーをクリックした際に表示される吹き出し中のhtml要素。:titleとペアで指定してください。
||! :zoom    || GoogleMapに指定する倍率 1〜16までを指定します。数字が大きいと縮尺が小さくなります。デフォルト:10
||! :width   || 埋め込まれるGoogleMapの幅 [pixel]、デフォルト:320
||! :height  || 埋め込まれるGoogleMapの高さ幅 [pixel]、デフォルト:240

!!! オプション付きの使用例1

* 本当は一行です。

 {{google_map '36.695952', '137.213677', :title => '富山市役所', 
  :html => '<a href="http://www3.city.toyama.toyama.jp/machikado/genre/g13_s.asp?0009">展望台</a>いってきました', 
  :zoom => 10, :width => 400, :height => 300}}

!!! オプション付きの使用例2

* 本当は一行です。

 {{google_geomap 'フューチャーシティファボーレ', :zoom => 14, , :title => 'ファボーレ!', 
 :html => '<a href="http://www.favore.jp/">アル・プラザ富山と100の専門店 フューチャー シティー『ファボーレ』</a>'}}

! その他

* 以下のようにスタイルシートで位置を調整可能です。

 div.gmap {
   margin-left: 2em;
 }


! 注意

!! 住所・地名を指定する場合

* Google側で緯度経度に変換できなかった場合は、alertを表示します。プレビュー等で確認するようにしてください。

!!! 文字コードの問題

tDiary2.3以降のUTF8環境じゃないと、住所地名に日本語が利用できない恐れがあります。

大変申し訳ありませんが、EUC-JP環境で試していませんm(_ _)m

!!! 同時呼び出しにおける Google Map API側の制限

* http://code.google.com/intl/ja/apis/maps/faq.html#geocoder_limit

試していたところ、1つの日記セクション中に 6つ以上のgeocodeリクエストを送ると、6個目がエラーとなってしまいました。
あまり利用しすぎないようにしてくださいm(_ _)m
Last modified:2019/07/18 04:20:06
Keyword(s):
References: