Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Webteko#10 GoogleMaps

2,418 views

Published on

Webteko#10でお話しさせていただいたGoogleMapsの発表です。

Published in: Technology
  • Be the first to comment

  • Be the first to like this

Webteko#10 GoogleMaps

  1. 1. Google Maps ふるかわだいすけ/mogya.com
  2. 2. •Googleマイマップ •GoogleMapsAPI •GoogleStaticMaps •その他 目次
  3. 3. •Googleマイマップ •GoogleMapsAPI •GoogleStaticMaps •その他 目次
  4. 4. Googleマイマップ
  5. 5. マイマップ
  6. 6. マイマップ
  7. 7. マイマップ
  8. 8. マイマップ
  9. 9. マイマップ
  10. 10. マイマップ
  11. 11. マイマップ
  12. 12. マイマップ
  13. 13. マイマップ
  14. 14. マイマップ
  15. 15. マイマップ
  16. 16. マイマップ
  17. 17. •Googleマイマップ •GoogleMapsAPI •GoogleStaticMaps •その他 目次
  18. 18. http://code.google.com/intl/ja/apis/maps/documentation/ GoogleMapsAPI
  19. 19. : http://code.google.com/intl/ja/apis/maps/signup.html キーの取得
  20. 20. http://code.google.com/intl/ja/apis/maps/ documentation/introduction.html#Intro GoogleMapsAPI
  21. 21. APIキー sensor=true iPhoneとか携帯でGPSを使う時はtrue APIのロード
  22. 22. 地図がロードされる場所を作っておく APIのロード
  23. 23. 出た
  24. 24. GMap2 → google.maps.Map2 GLatLng → google.maps.LatLng 動かないことが・・・(><) 余談:Google AJAX API
  25. 25. ピンを打つ
  26. 26. ピンを打つ
  27. 27. ピンを打つ
  28. 28. ピンを打つ
  29. 29. ピンを打つ
  30. 30. InfoWindow
  31. 31. InfoWindow
  32. 32. InfoWindow
  33. 33. ピンを打つ
  34. 34. •Googleマイマップ •GoogleMapsAPI •GoogleStaticMaps •その他 目次
  35. 35. iPhone上で GoogleMapsは 使いにくい! •3Gでのロード時間が長い •指で操作しにくい やってみてわかったこと
  36. 36. (○)画像なので軽量 (○)マーカーも出せます (×)画像なので ユーザーは操作ができない そこで、GoogleStaticMaps
  37. 37. <img src =" http://maps.google.com/staticmap?center=35.636157, 139.883723&size=310x310&maptype=mobile&markers =35.636157,139.883723,tinyorange%7C35.6615013,13 9.8733166,midblue0%7C35.6628428,139.8723138,mid blue1%7C35.6643148,139.8721888,midblue2%7C35.6 650962,139.8920179,midblue3%7C35.6657128,139.89 20762,midblue・・・ 出し方
  38. 38. 地図の中心位置を指定 <img src =" http://maps.google.com/staticmap?center=35.636157, 139.883723&size=310x310&maptype=mobile&markers =35.636157,139.883723,tinyorange%7C35.6615013,13 9.8733166,midblue0%7C35.6628428,139.8723138,mid blue1%7C35.6643148,139.8721888,midblue2%7C35.6 650962,139.8920179,midblue3%7C35.6657128,139.89 20762,midblue・・・ マーカー マップのサイズ ※詳しくは http://code.google.com/intl/ja/apis/m aps/documentation/staticmaps/ 出し方
  39. 39. •Googleマイマップ •GoogleMapsAPI •GoogleStaticMaps •その他 目次
  40. 40. http://maps.smartnetwork.co.jp/view?m=49 ドラクエGoogleMaps
  41. 41. http://maps.smartnetwork.co.jp/ だれでもちず
  42. 42. http://www.monopolycitystreets.com Monopoly City Streets
  43. 43. http://www.monopolycitystreets.com Monopoly City Streets

×