WEB开发网      婵犻潧鍊婚弲顐︽偟椤栨稓闄勯柦妯侯槸閻庤霉濠婂骸浜剧紒杈ㄥ笚閹峰懘鎮╅崹顐ゆ殸婵炴垶鎸撮崑鎾趁归悩鐑橆棄闁搞劌瀛╃粋宥夘敃閿濆柊锕傛煙鐎涙ê鐏f繝濠冨灴閹啴宕熼鍡╀紘婵炲濮惧Λ鍕叏閳哄懎绀夋繛鎴濈-楠炪垽鎮归崶褍妲婚柛銊ュ缁傚秹鏁撻敓锟� ---闂佹寧娲╅幏锟�
开发学院网页设计JavaScript google map api 与jquery结合使用(3) --图标样式... 阅读

google map api 与jquery结合使用(3) --图标样式,使用xml和异步请求

 2010-09-14 13:29:39 来源:WEB开发网 闂侀潧妫撮幏锟�闂佸憡鍨电换鎰版儍椤掑倵鍋撳☉娆嶄沪缂傚稄鎷�婵犫拃鍛粶闁靛洤娲ㄩ埀顒佺⊕閵囩偟绱為敓锟�闂侀潧妫撮幏锟�  闂佺ǹ绻楀▍鏇㈠极閻愭娑樷枎閹邦剛娉氶梺鍛婎殔濞层劌鈻撻幋婵愬殫妞ゆ梻鍘х憴锟�
核心提示:创建图标map.js$(document).ready(function(){ if (GBrowserIsCompatible()) { var map = new GMap2(document.getElementById("map"));map.addControl(new GSmallMap

创建图标

map.js

$(document).ready(function()
{
   if (GBrowserIsCompatible()) {
     var map = new GMap2(document.getElementById("map"));
    map.addControl(new GSmallMapControl());
    map.addControl(new GMapTypeControl());
    map.setCenter(new GLatLng(36.94,106.08),4);
    //创建小图标
    var icon = new GIcon();
        //图标图片
    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);
    //随机的添加10个标记
    var bounds = map.getBounds();
    var southWest = bounds.getSouthWest();
    var northEast = bounds.getNorthEast();
    var lngSpan = northEast.lng() - southWest.lng();
    var latSpan = northEast.lat() - southWest.lat();
    for (var i = 0; i < 10; i++) {
    var point = new GLatLng(southWest.lat() + latSpan * Math.random(),
      southWest.lng() + lngSpan * Math.random());
    map.addOverlay(new GMarker(point, icon));
    }
    $(window).unload(function (){
        $('.').unbind();
        GUnload();
      });
   }else
   {
     alert('你使用的浏览器不支持 Google Map!');  
   }
});

1 2 3  下一页

Tags:google map api

编辑录入:爽爽 [复制链接] [打 印]
赞助商链接