ArcGIS api for javascript——加载查询结果，单击显示信息窗口
Posted xiaotian_小天
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了ArcGIS api for javascript——加载查询结果，单击显示信息窗口相关的知识，希望对你有一定的参考价值。
描述
本例在开始和地图交互前执行一个查询并加载结果。这允许用户点击任意郡县立即看到一个InfoWindow。
QueryTask构造函数接受被查询的图层，即 ESRI sample server上ESRI_Census_USA服务的郡县图层（索引号是3）。 注意这和地图使用的不是一个服务。地图使用来自 ArcGIS Online的ESRI_StreetMap_World_2D服务。 通过这种方式能够使用在视觉上匹配的不同服务作为地图和查询任务的服务。 注意本例中，街道地图被显示在没有郡县可见的比例，避免查询任务返回结果和郡县要素视觉冲突的可能性。
查询的where clause限制了结果是在美国南卡罗来纳州的郡县。还要注意 returnGeometry被设置为true以便要素能够被显示在地图上。
1 <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> 2 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 3 <html> 4 <head> 5 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 6 <meta http-equiv="X-UA-Compatible" content="IE=7" /> 7 <title>QueryTask with geometry, results as an InfoWindow onClick</title> 8 <link rel="stylesheet" type="text/css" 9 href="http://serverapi.arcgisonline.com/jsapi/arcgis/1.6/js/dojo/dijit/themes/tundra/tundra.css"> 10 <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=1.6"></script> 11 <script type="text/javascript" language="Javascript"> 12 dojo.require("esri.map"); 13 dojo.require("esri.tasks.query"); 14 15 function init() { 16 //开始时地图范围：经纬度、地理坐标系 17 var startExtent = new esri.geometry.Extent(-83.41, 31.98, -78.47, 35.28,new esri.SpatialReference({wkid:4326})); 18 //创建地图 19 var map = new esri.Map("mapDiv",{extent:startExtent}); 20 dojo.connect(map, "onLoad", initFunctionality); 21 22 //创建并添加层 23 var layer = new esri.layers.ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap_World_2D/MapServer"); 24 map.addLayer(layer); 25 } 26 27 function initFunctionality(map) { 28 //创建查询任务 29 var queryTask = new esri.tasks.QueryTask("http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Demographics/ESRI_Census_USA/MapServer/3"); 30 31 //创建查询过滤器 32 var query = new esri.tasks.Query(); 33 query.returnGeometry = true; 34 query.outFields = ["NAME", "POP2000", 35 "POP2007", "POP00_SQMI", "POP07_SQMI"]; 36 query.where = "STATE_NAME = ‘South Carolina‘"; 37 38 var infoTemplate = new esri.InfoTemplate(); 39 infoTemplate.setTitle("${NAME}"); 40 infoTemplate.setContent( "<b>2000 Population: </b>${POP2000}<br/>" 41 + "<b>2000 Population per Sq. Mi.: </b>${POP00_SQMI}<br/>" 42 + "<b>2007 Population: </b>${POP2007}<br/>" 43 + "<b>2007 Population per Sq. Mi.: </b>${POP07_SQMI}"); 44 45 map.infoWindow.resize(245,105); 46 47 //监听onComplete事件的处理结果，使用queryTask.execute方法回调 48 dojo.connect(queryTask, "onComplete", function(featureSet) { 49 map.graphics.clear(); 50 var symbol = new esri.symbol.SimpleFillSymbol( 51 esri.symbol.SimpleFillSymbol.STYLE_SOLID, 52 new esri.symbol.SimpleLineSymbol( 53 esri.symbol.SimpleLineSymbol.STYLE_SOLID, 54 new dojo.Color([255,255,255,0.35]), 55 1), 56 new dojo.Color([125,125,125,0.35]) 57 ); 58 //QueryTask返回featureSet类型.通过featureSet的循环把他们添加到信息窗口 59 for (var i=0, il=featureSet.features.length; i<il; i++) { 60 //从featureSet中得到当前实例. 61 //从当前实例赋值给graphic 62 var graphic = featureSet.features[i]; 63 graphic.setSymbol(symbol); 64 graphic.setInfoTemplate(infoTemplate); 65 66 //添加当前这个图形到地图图层中 67 map.graphics.add(graphic); 68 } 69 }); 70 71 queryTask.execute(query); 72 } 73 74 dojo.addOnLoad(init); 75 </script> 76 </head> 77 <body class="tundra"> 78 Single click a county in South Carolina to get more information. 79 <div id="mapDiv" style="width:900px; height:600px; border:1px solid #000;"></div> 80 </body> 81 </html>
以上是关于ArcGIS api for javascript——加载查询结果，单击显示信息窗口的主要内容，如果未能解决你的问题，请参考以下文章
arcgis api for javascript 4.10版本的本地部署
Map学习(arcgis api for javascript3.18)
ArcGIS API for JavaScript学习：第一个地图