天地图多边形工具-526互联

http://lbs.tianditu.gov.cn/api/js4.0/examples.html
 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4     <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
 5     <title>天地图－地图API－范例－工具集合</title>
 6     <script type="text/javascript" src="http://api.tianditu.gov.cn/api?v=4.0&tk=您的密钥"></script>
 7     <style type="text/css">
 8         body, html {
 9             width: 100%;
10             height: 100%;
11             margin: 0;
12             font-family: "微软雅黑";
13         }
14 
15         #mapDiv {
16             height: 400px;
17             width: 100%;
18         }
19 
20         p,input {
21             margin-top: 10px;
22             margin-left: 5px;
23             font-size: 14px;
24         }
25     </style>
26     <script>
27         var map, zoom = 12, handler;
28         function onLoad() {
29             //初始化地图对象
30             map = new T.Map("mapDiv");
31             //设置显示地图的中心点和级别
32             map.centerAndZoom(new T.LngLat(116.40969, 39.94940), zoom);
33             //允许鼠标双击放大地图
34             map.enableScrollWheelZoom();
35             
36             var config = {
37                 showLabel: true,
38                 color: "blue", weight: 3, opacity: 0.5, fillColor: "#FFFFFF", fillOpacity: 0.5
39             };
40             //创建标注工具对象
41             polygonTool = new T.PolygonTool(map, config);
42         }
43 
44         function openPolygonTool() {
45             if (handler) handler.close();
46             handler = new T.PolygonTool(map);
47             handler.open();
48         }
49 
50         function openPolylineTool() {
51             if (handler) handler.close();
52             handler = new T.PolylineTool(map);
53             handler.open();
54         }
55 
56         function openMarkerTool() {
57             if (handler) handler.close();
58             handler = new T.MarkTool(map, {follow: true});
59             handler.open();
60         }
61 
62         function openRectangleTool() {
63             if (handler) handler.close();
64             handler = new T.RectangleTool(map, {follow: true});
65             handler.open();
66         }
67         function openCircleTool() {
68             if (handler) handler.close();
69             handler = new T.CircleTool(map, {follow: true});
70             handler.open();
71         }
72 
73         function getLayerCount() {
74             return map.getOverlays().length;
75 
76         }
77 
78     </script>
79 </head>
80 <body onLoad="onLoad()">
81 <div id="mapDiv"></div>
82 <p>本例演示多种覆盖物工具</p>
83 <div>
84     <input type="button" value="点工具" onClick='openMarkerTool() '/>
85     <input type="button" value="多边形工具" onClick='openPolygonTool() '/>
86     <input type="button" value="线工具" onClick='openPolylineTool() '/>
87     <input type="button" value="矩形工具" onClick='openRectangleTool() '/>
88     <input type="button" value="画圆工具" onClick='openCircleTool() '/>
89     <input type="button" value="获取图层个数" onClick='alert(getLayerCount()) '/>
90     <input type="button" value="清除所有" onClick='map.clearOverLays()'/>
91 </div>
92 </body>
93 </html>
多边形
工具