Webteko#10 GoogleMaps

ふるかわだいすけ/mogya.com

GoogleMaps

目次

•Googleマイマップ•GoogleMapsAPI•GoogleStaticMaps•その他

目次

•Googleマイマップ•GoogleMapsAPI•GoogleStaticMaps•その他

Googleマイマップ

マイマップ

マイマップ

マイマップ

マイマップ

マイマップ

マイマップ

マイマップ

マイマップ

マイマップ

マイマップ

マイマップ

マイマップ

目次

•Googleマイマップ•GoogleMapsAPI•GoogleStaticMaps•その他

GoogleMapsAPI

http://code.google.com/intl/ja/apis/maps/documentation/

キーの取得

http://code.google.com/intl/ja/apis/maps/signup.html

:

GoogleMapsAPI

http://code.google.com/intl/ja/apis/maps/documentation/introduction.html#Intro

APIのロード

APIキー

sensor=trueiPhoneとか携帯でGPSを使う時はtrue

APIのロード

地図がロードされる場所を作っておく

出た

余談：Google AJAX API

GMap2 → google.maps.Map2GLatLng → google.maps.LatLng

動かないことが・・・(＞＜)

ピンを打つ

ピンを打つ

ピンを打つ

ピンを打つ

ピンを打つ

InfoWindow

InfoWindow

InfoWindow

ピンを打つ

目次

•Googleマイマップ•GoogleMapsAPI•GoogleStaticMaps•その他

やってみてわかったこと

iPhone上でGoogleMapsは使いにくい！

•3Gでのロード時間が長い•指で操作しにくい

そこで、GoogleStaticMaps

(○)画像なので軽量(○)マーカーも出せます(×)画像なので

ユーザーは操作ができない

出し方

<img src ="http://maps.google.com/staticmap?center=35.636157,139.883723&size=310x310&maptype=mobile&markers=35.636157,139.883723,tinyorange%7C35.6615013,139.8733166,midblue0%7C35.6628428,139.8723138,midblue1%7C35.6643148,139.8721888,midblue2%7C35.6650962,139.8920179,midblue3%7C35.6657128,139.8920762,midblue・・・

出し方

<img src ="http://maps.google.com/staticmap?center=35.636157,139.883723&size=310x310&maptype=mobile&markers=35.636157,139.883723,tinyorange%7C35.6615013,139.8733166,midblue0%7C35.6628428,139.8723138,midblue1%7C35.6643148,139.8721888,midblue2%7C35.6650962,139.8920179,midblue3%7C35.6657128,139.8920762,midblue・・・

地図の中心位置を指定

マップのサイズ

マーカー

※詳しくはhttp://code.google.com/intl/ja/apis/maps/documentation/staticmaps/

目次

•Googleマイマップ•GoogleMapsAPI•GoogleStaticMaps•その他

ドラクエGoogleMaps

http://maps.smartnetwork.co.jp/view?m=49

だれでもちず

http://maps.smartnetwork.co.jp/

Monopoly City Streets

http://www.monopolycitystreets.com

Monopoly City Streets

http://www.monopolycitystreets.com