Jquery 的google map 应用

郗唯
2023-12-01
 <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>

 类似资料: