利用 Google API 调用谷歌地图 演示9
2010-08-06 20:32
316 查看
代码如下:
效果图:
![](http://pic002.cnblogs.com/img/%e8%87%aa%e7%94%b1%e7%9a%84%e7%94%9f%e6%b4%bb/201008/2010082620520327.jpg)
点击红色的小图标后:
![](http://pic002.cnblogs.com/img/%e8%87%aa%e7%94%b1%e7%9a%84%e7%94%9f%e6%b4%bb/201008/2010082620523612.jpg)
谢谢浏览!
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>演示9</title> <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> <style type="text/css"> html { height: 100%; } body { height: 100%; margin: 0px; padding: 0px; } #map_canvas { width:50%; height: 50%; margin: 50px auto; } </style> <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true&key=ABQIAAAAtzdEfkm0e6fFv-EqYY-XJRQdNSJsfUEFgMWL1fb2TrZ8t0A2pRQ10wAqRsmxpdHzRsHswMJAFavZ6g"></script> <!-- sensor 参数表示是否检测用户的地理位置 --> <script type="text/javascript"> var map; function initialize() { var myLatlng = new google.maps.LatLng(22.95, 113.4); var myOptions = { zoom: 5, center: myLatlng, mapTypeId: google.maps.MapTypeId.ROADMAP } map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); google.maps.event.addListener(map, 'zoom_changed', function() { setTimeout(moveToDarwin, 1500); }); var marker = new google.maps.Marker({ position: myLatlng, map: map, title: "Hello World!" }); google.maps.event.addListener(marker, 'click', function() { map.setZoom(12); }); } function moveToDarwin() { var darwin = new google.maps.LatLng(22.95, 113.4); map.setCenter(darwin); map.setZoom(12); } </script> </head> <body onload="initialize()"> <div id="map_canvas"> </div> </body> </html>
效果图:
![](http://pic002.cnblogs.com/img/%e8%87%aa%e7%94%b1%e7%9a%84%e7%94%9f%e6%b4%bb/201008/2010082620520327.jpg)
点击红色的小图标后:
![](http://pic002.cnblogs.com/img/%e8%87%aa%e7%94%b1%e7%9a%84%e7%94%9f%e6%b4%bb/201008/2010082620523612.jpg)
谢谢浏览!
相关文章推荐
- 利用 Google API 调用谷歌地图 演示4
- 利用 Google API 调用谷歌地图 演示5
- 利用 Google API 调用谷歌地图 演示6
- 利用 Google API 调用谷歌地图 演示7
- 利用 Google API 调用谷歌地图 演示8
- 利用 Google API 调用谷歌地图 演示10
- 利用 Google API 调用谷歌地图 演示11
- 利用 Google API 调用谷歌地图 演示12
- 利用 Google API 调用谷歌地图 演示13
- 利用 Google API 调用谷歌地图 演示1
- 利用 Google API 调用谷歌地图 演示2
- 利用 Google API 调用谷歌地图 演示3
- 利用 Google API 调用谷歌地图
- 抄google工程师的代码:通过读setting的源代码,利用反射机制调用系统隐藏的API
- 利用HTML5中Geolocation获取地理位置调用Google Map API在Google Map上定位
- Google Maps API 调用实例
- Android利用反射调用影藏API
- C# 调用 Google Earth Com API开发(三)(转载)
- 如何用Google APIs和Google的应用系统进行集成(3)----调用Google 发现(Discovery)API的RESTful服务
- C# 调用 Google Earth Com API开发(四)