1 / 17

Google Map API

Google Map API. 演講者 : 陳奕仁 日期 : 2007/10/22. Reference. Google Map API concept http://www.google.com/apis/maps/documentation/index.html Google Map API Tutorial http://www.econym.demon.co.uk/googlemaps. What’s Google Map??. http://maps.google.com/ 可以客制化個人的 Google Map

Gideon
Download Presentation

Google Map API

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Google Map API 演講者: 陳奕仁 日期: 2007/10/22

  2. Reference • Google Map API concept • http://www.google.com/apis/maps/documentation/index.html • Google Map API Tutorial • http://www.econym.demon.co.uk/googlemaps

  3. What’s Google Map?? • http://maps.google.com/ • 可以客制化個人的 Google Map • 可以和他人分享個人 Google Map

  4. What’s Mapplet?? • Google Map 上的 Gadget

  5. Mapplet example <?xml version="1.0" encoding="UTF-8"?> <Module> <Content type="html"><![CDATA[ This example zooms out to a world map and adds a "Hello World!" info window. <script> // Center the map in the Mediterranean and zoom out to a world view var map = new GMap2(); var point = new GLatLng(37.71859, 6.679688); map.setCenter(point, 2); // Add a marker to the center of the map var marker = new GMarker(point); map.addOverlay(marker); // Open a "Hello World" info window var message = "Hello World!"; marker.openInfoWindowHtml(message); // Make user clicks on the marker open the info window GEvent.addListener(marker, "click", function() { marker.openInfoWindowHtml(message); }); </script> ]]></Content> </Module>

  6. Mapplet • 可以用來客制化個人 Google Map • 暫時無法使用在由 Google Map API 製作出來的 Google Map 上

  7. What’s Google Map API?? • 提供嵌入 Google Map 到使用者 web page 中的功能.

  8. What’s Google Map API?? 2 3 Web page Google map tell grab 1 Google Map API Part of Google Map Map 5 4 put in (or link) get

  9. Example 1

  10. Example 2

  11. Others • Another way to make your own Google Map without coding. • 1. 使用 Google Map 提供的連結功能. • http://maps.google.com • 2. 使用 Google 提供的 Map Search Wizard. • http://www.google.com/uds/solutions/wizards/mapsearch.html • Browsers supported by Google Map • IE 6.0+ • Firefox 0.8+ • Safari 1.2.4+ • Netscape 7.1+ • Mozilla 1.4+ • Opera 8.02+

  12. Conclusion • 可以透過 Google Map API 製作一個客製化的 Map 讓朋友分享. • 目前用 Google Map API 作出的 Map 的功能並不能和真正的 Google Map 相比. 但是未來可能會因為 API 的逐漸完善和 Mapplet 的數量越來越多而使得每個人的 Google Map 外表和功能都不一樣. Q & A

  13. Google Map API Link Google Map key Call Google Map API • Google Map API version • 目前版本為 2 • 有分 latest (v=2.x), normal (v=2), and stable (2.s) 版本 • 可以設定為某一特定版本. Ex. 設為 2.5版 (v=2.5)

  14. Google Map Key

  15. GMap Zoom Size (0~19) 緯度 經度

  16. Center the map, add markerand add message

More Related