经过试验，成功的加载了本地服务器上发布的地图服务，实现了要素查询。具体的代码如下： （不足之处望指正） <!DOCTYPE html><html dir="ltr"><head> <meta h
经过试验，成功的加载了本地服务器上发布的地图服务，实现了要素查询。具体的代码如下：
（不足之处望指正）
<!DOCTYPE html><html dir="ltr"><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no" /> <title>利用Search工具搜索要素图层上的要素</title> <link rel="stylesheet" href="https://js.arcgis.com/3.16/dijit/themes/claro/claro.css"> <link rel="stylesheet" href="https://js.arcgis.com/3.16/esri/css/esri.css"> <style> html, body, #map, .map.container { padding: 0; margin: 0; height: 100%; width: 100%; } #info { top: 2px; color: #444; height: auto; font-family: arial; font-weight: bold; left: 69px; margin: 5px; padding: 10px; position: absolute; width: 260px; z-index: 40; border: solid 1px #003300; border-radius: 4px; background-color: #E5E5E5; } #search { display: block; position: absolute; z-index: 2; top: 70px; left: 74px; } /*Beginning of search box modifications*/ .arcgisSearch .searchClear { background-color: #E5E5E5; } .arcgisSearch .esriIconZoom { background-image: url("finding.png"); background-size: 20px 20px; } .esriIconZoom:before { content: ""; } .arcgisSearch .searchGroup .searchInput, .arcgisSearch .searchBtn, .arcgisSearch .noResultsMenu, .arcgisSearch .suggestionsMenu { border: 1px solid #003300; background-color: #E5E5E5; } .arcgisSearch .noValueText { color: red; font-size: 14px; } /*Beginning of popup modifications*/ .esriPopup .titlePane { background-color: #003300; border-bottom: 1px solid #121310; font-weight: bold; } .esriPopup a { color: #DAE896; } .esriPopup .contentPane, .esriPopup .actionsPane, .esriPopup .pointer, .esriPopup .outerPointer { background-color: #B3B3B3; } </style> <script> var dojoConfig = { parseOnLoad: true }; </script> <script src="https://js.arcgis.com/3.16/"></script> <script> var map; require([ "esri/map", "esri/layers/FeatureLayer", "esri/dijit/Search", "esri/layers/ArcGISDynamicMapServiceLayer", "esri/InfoTemplate", "dojo/domReady!" ], function (Map, FeatureLayer, Search,ArcGISDynamicMapServiceLayer, InfoTemplate) { //添加一个动态图层，可利用本地服务器中的地图服务 var url=ArcGISDynamicMapServiceLayer("http://localhost:6080/arcgis/rest/services/交院地图/MyMapService/MapServer"); map = new Map("map", { // basemap: "streets", center: [100, 35], // lon, lat zoom: 4 }); map.addLayer(url); //ArcGIS Online feature service showing ecological footprints taken from Global FootPrint Network, //more information on this can be found http://jsapi.maps.arcgis.com/home/item.html?id=0f4c89208dce44b583d9219d843591c3 //添加一个要素图层，用于查询使用。查询要素图上面的属性信息 var layer = new FeatureLayer("http://localhost:6080/arcgis/rest/services/交院地图/MyMapService/MapServer/2", { outFields: ["*"] }); map.addLayer(layer); //Create search widget// //实例化一个搜索部件 var search = new Search({ map: map, //passing in empty source array to clear defaults such as //"All" and the ArcGIS Online World Geocoding service //search的属性 sources: [], zoomScale: 5000000 }, "search"); //listen for the load event and set the source properties //箭筒load事件设置源属性 search.on("load", function () { var sources = search.sources;//search的sources属性。源对象数组用于查找搜索结果 sources.push({ featureLayer: layer, placeholder: "Spain", //用来提示源输入文本 enableLabel: false, //是否在地图上显示一个文本标签，使用labelSymbol选中的源 searchFields: ["name"],// 指定搜索结果的要素层 displayField:"name",//显示正在使用的字段，默认显示第一个图层。 exactMatch: false,//搜索值完全匹配返回结果，一般为false outFields: ["*"],//指定返回搜索结果的字段 //Create an InfoTemplate and include three fields //用于选择结果，包含多个字段。 infoTemplate: new InfoTemplate("Ecological Footprint", "<a href= ${URL} target=_blank ;'>Additional Info</a></br></br>省会: ${name}</br>简介: ${SHAPE_Area}") }); //Set the sources above to the search widget //将搜索结果源显示在搜索部件上 search.set("sources", sources); }); search.startup(); }); </script></head><body><div id="search"></div><div id="info"> <div>Search a country to find its ecological footprint and rating.</div></div><div id="map"></div></body></html>
