基础功能---地理编码

最新推荐文章于 2022-03-25 00:36:40 发布

Devin·Finn

最新推荐文章于 2022-03-25 00:36:40 发布

阅读量210

点赞数

分类专栏： WebGIS - ArcGIS API For Js

本文链接：https://blog.csdn.net/DanBo_C/article/details/99084506

版权

WebGIS - ArcGIS API For Js 专栏收录该内容

53 篇文章 18 订阅

订阅专栏

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

贴代码：

<!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>

Devin·Finn

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
基础功能---地理编码

首先需要发布地理编码服务，再调用。还没有使用过这一功能。记录贴贴代码：<!DOCTYPE html><html lang="en"><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title>地理编码...
复制链接

扫一扫