FC2ブログ

Google Map の表示

Google Map の表示

#02 最初の地図を表示させよう
http://dotinstall.com/lessons/basic_google_maps/3502
を参考に
Google Map を表示してみる

APIリファレンスは
https://developers.google.com/maps/documentation/javascript/reference?hl=ja&csw=1

そして編集するのは index.html の
script タグの中


ドットインストールの解説によると
英語では南北の緯度のことをlatitude、
東西の経度のことをlongitudeと言うので、
Google Maps APIでは「latlng」という表現が
使われるということ

パラメータは
英語の意味がわかると意外とわかりやすいかもしれない

地図を表示するには
まず緯度経度を指定する
vat latlng = new google.maps.LatLng(35.66, 139.69);
これは渋谷の座標

次にオプション
これにはオプションとはいっても必須項目がある
これは他のAPIでも、ものによっては
必須項目がある
zoom: 15
でズームレベルを15に

center: latlng,
これで地図の中心座標
大抵の場合、
変数にしたものを指定する
今回なら
var latlng で座標を格納して、これを指定している

mapTypeId: google.maps.MapTypeId.ROADMAP
これは、表示するマップの種類
Yahoo地図の場合、地下などの指定もできる
mapTypeId については
https://developers.google.com/maps/documentation/javascript/reference?hl=ja&csw=1#MapTypeId
にあり
ROADMAPは、普通の地図になる

そして、地図を表示するには
var map = new google.maps.Map(document.getElementById('map'), options);
で表示する

new google.maps.Map(
表示する場所,
オプション
}
となる

document.getElementById('map')
なので id=map のところに
地図表示

options
なので、var options
で指定した mapの設定になる

new google.maps.Map()は
google のAPIの関数
スポンサーサイト



テーマ : プログラミング
ジャンル : コンピュータ

コメント

非公開コメント

最新記事
検索フォーム
GREEハコニワ攻略サイト
リンク
カテゴリ
月別アーカイブ
フリーエリア
最新記事
FXプライムレート
最新コメント
最新トラックバック