Google Map API 应用 一 可拖动标记/图层显示级别

3 views
Skip to first unread message

TN

unread,
Oct 29, 2009, 2:36:05 AM10/29/09
to 任琥论坛, TNl论坛
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="SetMarker.aspx.cs" Inherits="WebApplicationGmap.WebForm1" %>
 
<!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 runat="server">
    <title>Set Marker</title>
 
 
    <!--markermanager.js-->
 
 
    <script type="text/javascript">
        function initialize()
        {
            if (GBrowserIsCompatible())
            {
                var map = new GMap2(document.getElementById("map_canvas"));
               
                /* map.setCenter(GLatLng,level)
                GLatLng:地图显示中心点的坐标（经/纬）；
                level:地图放大级别0-19 */
                map.setCenter(new GLatLng(40.000, 116.568), 11);
               
                //添加放大做小工具栏
                map.addControl(new GSmallMapControl());
               
                //地图右上角工具栏
                map.addControl(new GMapTypeControl());
 
                //消息窗口（气泡）
                map.openInfoWindow(map.getCenter(),
                                  document.createTextNode("Hello, world!请不要关闭，还有效果"));
 
                //MarkerManagerOptions 对象是对象常量，所以只需声明该对象而无需构造函数
                var mgrOptions = { borderPadding: 50, maxZoom: 15, trackMarkers: false };
 
                // 需要添加对markermanager.js的引用，见文件头 13行
                var mgr = new MarkerManager(map, mgrOptions);
 
                // 在随机位置向地图中添加 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());
                    /*添加坐标
                    addMarker(marker:GMarker, minZoom:Number, maxZoom?:Number)
                    向此管理器控制的标记集合添加单个标记。如果标记的位置在地图的当前视口范围内，
                    并且地图的缩放级别属于指定的缩放级别范围，则立即向地图添加标记。
                    minZoom 和可选的 maxZoom 参数指定显示标记的缩放级别范围。
                   
                    GMarker(point, { draggable: true })
                    { draggable: true } 为可选参数，true 为标记可被拖动。
                    */
                    mgr.addMarker(new GMarker(point, { draggable: true }), 11, 13);
                }
                window.setTimeout(function()
                {
                    map.panTo(new GLatLng(39.927, 116.407));
                    map.closeInfoWindow();
                }, 3000);
            }
        }
 
    </script>
 
</head>
<!--GUnload()删除所有注册的事件处理程序以防止内存泄漏。应作为 unload 事件的处理程序进行调用。-->
<body onload="initialize()" onunload="GUnload()">
    <form id="form1" runat="server">
    <div id="map_canvas" style="width: 800px; height: 500px">
    </div>
    </form>
</body>
</html>
Reply all
Reply to author
Forward
0 new messages