Jquery 的google map 应用

转载 2012年03月30日 16:31:04
[javascript] view plaincopyprint?

    <script language="javascript" type="text/javascript">  
           $(document).ready(function () {  
               $.ajax({  
                   type: "POST",  
                   url: "GetMap.ashx/ProcessRequest",  
                   dataType: "json",  
                   success: function (data) {  
                       var datalist = data;  
                       var map = new GMap2(document.getElementById("mapdiv")); //地图信息                      
                       map.addControl(new GMapTypeControl()); //选择地图类型的控件(如卫星图到二维地图的切换控件)                      
                       map.addControl(new GLargeMapControl());   //大号平移和缩放控件,位置是左上角                      
                       map.addControl(new GOverviewMapControl());  //添加鹰眼控件                       
                       map.addControl(new GScaleControl());  // 比例尺控件                      
                       map.enableGoogleBar();  //显示google搜索框                      
                       var icon = new GIcon(); //设置ICO定位                      
                       icon.image = "http://labs.google.com/ridefinder/images/mm_20_red.png";  
                       icon.shadow = "http://labs.google.com/ridefinder/images/mm_20_shadow.png";  
                       icon.iconSize = new GSize(12, 20);        //图片尺寸                      
                       icon.shadowSize = new GSize(22, 20);  
                       icon.iconAnchor = new GPoint(6, 20);  
                       icon.infoWindowAnchor = new GPoint(5, 1);  
                       $(datalist).each(function (index, content) {  
                           map.setCenter(new GLatLng(content.LATITUDE, content.LONGITUDE), 13);  //设置显示地图中间位置,代表地图缩放级别                          
                           var point = new GLatLng(content.LATITUDE, content.LONGITUDE);         //组合坐标点                          
                           map.addOverlay(createMarker(point, content.ADDRESS));                 //注册坐标点                      
                       })  
      
                       window.setTimeout(function () {  
                           //等待2秒,然后平移到一个新的中心点                     
                           map.panTo(new GLatLng(content.LATITUDE, content.LONGITUDE));  
                       }, 2000);  
                   },  
                   error: function (data) {  
                       alert('获取数据超时...');  
                   }   
               });  
               //显示信息函数              
      
               function createMarker(point, number) {  
                   var marker = new GMarker(point);  
                   GEvent.addListener(marker, "click", function () {  
                       marker.openInfoWindowHtml("<b>" + number + "</b>");  
                   });  
                   return marker;  
               }  
           })    
       </script>  


Jquery 的google map 应用

$(document).ready(function () { $.ajax({ type: "POST", u...
  • fengyarongaa
  • fengyarongaa
  • 2011年04月23日 16:47
  • 1009

Google Map 截图使用

一些黄页APP例如Yelp之类的,会在商铺的详细页面画个小小的地图,我尝试点了下,会跳转到另一个页面,判断为一张图片或者一个不能交互的地图,于是找到了下面这个 Snapshot 的使用 ...
  • guyinglx1
  • guyinglx1
  • 2014年06月10日 23:40
  • 910

如何开始使用Google Map API(JavaScript)?

如何开始使用Google Map API(JavaScript)? 如何开始使用Google Map API(JavaScript) V3.0 Google Map的使用非常方便,...
  • d_hongran
  • d_hongran
  • 2012年06月12日 14:34
  • 2246

android上无法使用google map v2的解决方案

由于国产手机大部分都被厂商去掉了google服务框架,导致国产手机都不能使用google地图,这是一方面,即使你安装了google服务框架,也不一定就能使用,这就需要用到翻墙,你懂的. 1.首先让你...
  • junfeng120125
  • junfeng120125
  • 2014年07月22日 09:16
  • 4825

Google Maps API:自定义Marker图标,为图标添加文字等信息

代码:                   
  • youthpasses
  • youthpasses
  • 2011年06月30日 17:36
  • 3927

Google Map API如何自动缩放级别教程

最近花了两晚上的时间写了一个google地图的应用程序,采用了map api,weather api,localsearch api,我想的是有空写一些关于Google Map API的文章,今天就写...
  • lala515
  • lala515
  • 2011年07月14日 16:36
  • 2419

google map api中文版

Google Maps API 可以让你在你自己的网页上嵌入google地图。要使用这个API,你需要上这里去 http://www.google.com/apis/maps/signup.htm  ...
  • zhaobmox
  • zhaobmox
  • 2006年09月20日 13:28
  • 5271

一步步教你用Android Google Map

第一步:安装Google Map API   在默认情况下,在安装Google Android SDK时,是不需要必须安装Google Map API的。但要做Map应用的话,就必须安装Goog...
  • asheng1989321
  • asheng1989321
  • 2014年11月12日 16:30
  • 3158

android google map 入门 三

google map 事件,地图点击事件,地图长按事件,标记点击事件,信息窗口点击事件,代码举例...
  • T1DMzks
  • T1DMzks
  • 2016年11月27日 17:17
  • 2060

如何在Google Map中处理大量标记

MarkerManager Clusterer
  • wfy19850328
  • wfy19850328
  • 2010年09月27日 17:16
  • 4088
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:Jquery 的google map 应用
举报原因:
原因补充:

(最多只允许输入30个字)