基础功能---地理编码

留言

首先需要发布地理编码服务，再调用。
还没有使用过这一功能。记录贴

贴代码：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
<!DOCTYPE html>
<html lang="en">
<head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>地理编码_动态图层服务</title>
    <link rel="stylesheet" href="https://js.arcgis.com/3.28/esri/css/esri.css" />
    <script src="https://js.arcgis.com/3.28/"></script>
    <script  src="https://code.jquery.com/jquery-1.12.4.js"></script>
    <script>


        require(["esri/map","dojo/query","dojo/on","dojo/_base/array","dojo/dom",
            "esri/layers/ArcGISDynamicMapServiceLayer",
			"esri/tasks/locator",
			"esri/symbols/SimpleMarkerSymbol",
			"dojo/colors",
			"esri/InfoTemplate","esri/graphic",
            "dojo/domReady!"],
                function(Map,query,on,array,dom,ArcGISDynamicMapServiceLayer,Locator,SimpleMarkerSymbol,Color,InfoTemplate,Graphic){
                    var map = new Map("mapDiv");
                    var layer=new ArcGISDynamicMapServiceLayer("http://localhost:6080/arcgis/rest/services/demo/Practice/MapServer");
                    map.addLayer(layer);
                    query("#btn").on("click",function(){
                        //获得名称
                        var name=query(".nm")[0].value;
						//创建地理编码对象
						var locator = new Locator("http://localhost:6080/arcgis/rest/services/demo/nameLoc_geo/GeocodeServer");
						//参数和服务的参数对应
						var address = { "Single Line Input": name}; 
						//输出的空间参考
						locator.outSpatialReference = map.spatialReference; 
						var options = { 
							address: address, 
							outFields: ["*"] 
						} 
						//执行方法
						locator.addressToLocations(options,function(candidates){
							//获得运行之后的信息
							if (candidates.length > 0){
									var htmls = "<table style='width: 100%'>"; 
									htmls = htmls + "<tr bgcolor='#E0E0E0'><td>X 坐标</td><td>Y 坐标</td><td>得分</td></tr>"; 
									array.forEach(candidates, function (candidate, index) {  
										if (index % 2 == 1) { 
											htmls = htmls + "<tr  bgcolor='#E0E0E0'><td style='width: 60px'>" + candidate.location.x + "</td><td style='width: 60px'>" + candidate.location.y+ "</td><td>" + candidate.score + "</td></tr>"; 
										} else { 
											htmls = htmls + "<tr><td style='width: 60px'>" + candidate.location.x + "</td><td style='width: 60px'>" + candidate.location.y+ "</td><td>" + candidate.score + "</td></tr>";
										} 										
									}); 
									htmls = htmls + "</table>"; 
									dom.byId("divShowResult").innerHTML = htmls;
							}
                        },function(error){alert(error)});
                    });								
				});
                       
                              
    </script>
</head>
<body class="tundra">
<div id="mapDiv" style="width:900px; height:580px; border:1px solid #000;"></div>
    Name:<input class="nm" type="text">
    <input id="btn" type="button" value="定位">
	<div id="divShowResult"></div>
</body>
</html>

文章目录