ArcGIS API for JavaScript 3.23汉化（下）

3具体使用
一、Default API configurations 默认API配置
Default API strings 默认API字符串
三、Retrieve data from a web server 从Web服务器检索数据
Map navigation 地图导航
五、Events（活动）事件
六、Set Extents 设置范围
七、Editing 编辑
Arcade 表达式语言
Time aware data 时间感知数据
十、Adding a task 添加任务
十一、Using QueryTask 使用QueryTask
Creating custom layer types 创建自定义图层类型
Web maps 网络地图
Working with Analysis Widgets 使用Analysis小部件
Working with the Search Widget 使用搜索小组件
Working with the Directions Widget 使用Directions Widget
Working with GeoEnrichment Widgets 使用GeoEnrichment小部件
Working with DataReviewer 使用DataReviewer
Location Providers (beta） 位置提供（测试版）
Graphics and feature layers图形和要素图层
Graphics overview
Feature layer overview
Symbols and renderers
Data Visualization
Styling features with CSS
Popups and Info Windows 弹出窗口和信息窗口
Info windows and graphics
Format info window content
Customize info windows
Popup overview
Format popup content
Customize popup
Geoprocessor 地理处理器
Geoprocessing overview
Creating the geoprocessor
Geoprocessor parameters
Geoprocessing results
Operations Dashboard操作仪表板
Overview
Get started
Create extensions
Test and debug
Deploy。。。。。。

4更为具体

一、Default API configurations 默认API配置

所有配置选项的默认值都存储在esri/config模块中。要修改默认值，请加载该模块，

require （[ “esri / config” ]，function （esriConfig ）{ //在此更新esriConfig属性以覆盖默认值}）;  

1.修改用于地图缩放框的符号。在下面的代码中，创建一个新符号，转换为JSON对象，然后设置为地图的默认缩放符号。

// AMD
require([
  "esri/config",
  "esri/symbols/SimpleFillSymbol", "esri/symbols/SimpleLineSymbol", "dojo/_base/Color"
], function(
  esriConfig,
  SimpleFillSymbol, SimpleLineSymbol, Color
) {
  var lineColor = new Color([0,0,255]);
  var fillColor = new Color([255,255,0,0.5]);
  var zoomSymbol = new SimpleFillSymbol(
    SimpleFillSymbol.STYLE_SOLID,
    new SimpleLineSymbol(SimpleLineSymbol.STYLE_DASHDOT, lineColor, 2), 
    fillColor
  );
  esriConfig.defaults.map.zoomSymbol = zoomSymbol.toJson();
});

JavaScript API的其他的配置属性名称和默认值：
2.关于 网络、域名、跨域、代理、等详见手册。
3.
esriConfig.defaults.map.panDuration
地图从一个范围平移到另一个范围所用的时间长度（以毫秒为单位）。
默认值： 350
示例： 自定义平移动画
4
esriConfig.defaults.map.panRate地图在平移到下一个范围时将刷新的时间长度
默认值： 25
示例： 自定义平移动画
5
esriConfig.defaults.map.slider 用于定义滑块的位置，大小和方向的参数。
从版本3.3开始，推荐的方法是使用CSS和地图构造函数选项的组合来自定义地图的滑块或缩放按钮。
默认值： {left：“30px”，top：“30px”，width：null，height：“200px”}
示例： 更改滑块方向
6等等…

三、Retrieve data from a web server 从Web服务器检索数据

esriRequest是一种从Web服务器检索数据的实用方法。
数据可以是静态的（存储在Web服务器上的文件中），
也可以是动态的（由Web服务按需生成）。
esriRequest可以处理以下格式：纯文本、XML、JSON、JSONP或“带填充的JSON”

在提出请求之前，需要一些信息：

• 数据的位置，即URL
• 对于Web服务，任何必需的参数和适当的值
• 数据格式

使用esriRequest：导入具有该函数源代码的模块。如果需要，请指定代理的位置。

 var request = esriRequest({
          // Location of the data
          url: "<String>",
          // Service parameters if required, sent with URL as key/value pairs
          content: {
            parameter1: <value>,
            parameter2: <value>
          },
          // Data format
          handleAs: "<String>"
        });

在上面的代码中，esriRequest不返回实际数据。如果它要返回实际数据，则必须等待下载数据 - 这通常需要一些时间，具体取决于网络流量，可用带宽和远程服务器上的负载。在此之前，应用程序将被冻结 - 不允许您与之交互。这称为synchronous行为。
相反，为使应用程序保持响应，esriRequest始终返回一个request对象，该对象代表您刚刚发出的请求，并在以后下载时使您可以使用这些数据。这称为asynchronous行为。

要在下载数据后访问数据，即callbacks“回调”。
如果检索到的数据没有错误，将执行第一个函数（在下面的示例代码中命名为requestSucceeded，函数名由开发人员决定）。
如果由于某种原因数据下载失败，将执行第二个函数（名为requestFailed）。

function requestSucceeded(data) {
  console.log("Data: ", data); // print the data to browser's console
}  
function requestFailed(error) {
  console.log("Error: ", error.message);
}    
request.then(requestSucceeded, requestFailed);

回调也可以内联定义：

request.then(
  function (data) {
    console.log("Data: ", data);
  },
  function (error) {
    console.log("Error: ", error.message);
  }
);

附加信息和使用案例
上传一个文件
esriRequest主要用于下载数据。但它也可用于将文件从用户的计算机上载到Web服务器。该文件可以是任何类型：Word文档，Excel表格，CSV，PDF，JPEG，PNG等。

要构建能够上载文件的应用程序，需要以下内容：

1. 导入相关的源代码。
2. 为应用程序设置代理
3. 使用文件输入控件创建HTML表单。用户可以单击此文件输入控件并从其计算机中选择一个文件
4. 调用esriRequest上传所选文件

关于代理与CORS规范 详见手册

五、Events（活动）事件12345

在ArcGIS API for JavaScript中，监听事件的推荐方法是使用on。也可以使用dojo / aspect或旧的dojo / _base / connect模块来监听或响应事件。
从版本3.6开始，ArcGIS API中的所有模块都支持事件on（）样式事件侦听器。
常见事件：

1.地图加载Map"load"
将地图添加到页面时，在添加第一个图层之前不能使用它。
向地图添加图层会初始化图形并触发onLoad事件。此时，您可以与地图进行交互。
此规则的一个例外是setExtent方法。您可以在地图的构造函数中设置地图的初始范围，也可以在添加第一个图层之前调用setExtent。

  require(["esri/map", ...], function(Map, ...) {
    			var map = new Map("mapDiv"),
    			mapOnLoad = map.on("load", configNavigation);
    			map.addLayer(...);	
    		function configNavigation(evt) {
    			evt.map.disableMapNavigation();
    			}
    });

2.ArcGISDynamicMapServiceLayer “load” and ArcGISTiledMapServiceLayer "load"
esri.layers.ArcGISDynamicMapServiceLayer和esri.layers.ArcGISTiledMapServiceLayer使用ArcGIS Server REST服务端点工作。
首次创建图层时，需要向ArcGIS Server发出请求以获取服务信息。
在与图层交互之前，您应该等到图层的onLoad事件被触发。
以下代码仅在onLoad触发后才使用事件处理程序访问初始范围属性。

require(["esri/layers/ArcGISDynamicMapServiceLayer", ... ], function(ArcGISDynamicMapServiceLayer, ... ){
  var layer = new ArcGISDynamicMapServiceLayer(...);
  layer.on("load", printInitialExtent);

  function printInitialExtent(evt) {
    alert(evt.layer.initialExtent);
  }
});

注意：在Internet Explorer中，由于资源缓存，一旦构造了图层，就会触发onLoad事件。因此，在为“load”事件注册侦听器之前，应检查图层的已加载属性是否为true：

require(["esri/layers/ArcGISDynamicMapServiceLayer", ...
], function(ArcGISDynamicMapServiceLayer, ... ) {
  var layer = new ArcGISDynamicMapServiceLayer(...);
  if(layer.loaded){
    printInitialExtent({"layer":layer});
  } else {
    layer.on("load", printInitialExtent);
  }

  function printInitialExtent(evt) {
    console.log(evt.layer.initialExtent);
  }
});

但是，on有一个伴侣功能，emit发射。 我们可以使用emit强制事件触发，而不是直接调用事件处理程序：

require(["esri/layers/ArcGISDynamicMapServiceLayer", ... ], function(ArcGISDynamicMapServiceLayer, ... ) {
  var layer = new ArcGISDynamicMapServiceLayer(...);
  layer.on("load", printInitialExtent);
  if(layer.loaded){
    layer.emit("load",{
      "layer":layer
    });
  }

  function printInitialExtent(evt) {
    console.log(evt.layer.initialExtent);
  }
});

3.地图和图形上的鼠标事件 Mouse events on maps and graphics
The ArcGIS JavaScript API map and graphics layer provide a large set of mouse events users can use to interact with these objects. To register to listen to a map’s onClick event:

require(["esri/map", ...], function(Map, ...) {
  var map = new Map("mapDiv"),
  map.on("click", myClickHandler);
  map.addLayer(...);

  function myClickHandler(evt) {
    ...
  }
});

当用户单击地图时，将生成鼠标事件并调用所有已注册的点击处理程序。mouse事件作为参数传递给每个处理程序。除了浏览器填充的所有属性外，还包含mapPoint和screenPoint作为事件的属性。
mapPoint表示地图坐标中单击的坐标，screenPoint表示屏幕坐标中单击的坐标。

function myClickHandler(event) {
  alert("User clicked at " +
    event.screenPoint.x + ", " + event.screenPoint.y +
    " on the screen. The map coordinate at this point is " +
    event.mapPoint.x + ", " + event.mapPoint.y
  );
}

除了mapPoint和screenPoint属性之外，返回的事件还包括一个图形属性，它是接收事件的esri.Graphic对象。
下面的代码显示了如何处理地图的onClick事件以报告用户点击的图形。
请注意，onClick事件的侦听器仅在Map的onLoad事件触发后才会生效。在这种情况下，侦听器依赖于另一个侦听器。

require(["esri/map", ...], function(Map, ...) {
  var map = new Map("mapDiv"),
  mapOnLoad = map.on("load", function(){
    map.graphics.on("click", myGraphicsClickHandler);
  });
  map.addLayer(...);

  function myGraphicsClickHandler(evt) {
    alert("User clicked on " + evt.graphic);
  }
});

4.地图“鼠标滚轮”Map "mouse-wheel"

鼠标滚轮事件已标准化，可在所有浏览器中使用。将值属性添加到MouseScroll / Wheel事件（Firefox）或MouseWheel事件（Internet Explorer / Safari / Chrome / Opera）。
正数表示鼠标滚轮向上滚动，负数表示鼠标滚轮向下滚动：

map.on("mouse-wheel", myMouseWheelHandler);

5.事件传播（冒泡）Event propagation (bubbling)
Internet Explorer事件模型有时会导致在页面中的多个元素上发生相同的事件。如果元素重叠，则会发生这种情况。要防止事件从一个元素传播（冒泡）到另一个元素，您可以停止该事件。

例如：假设您有一个应用程序，用户可以在其中单击地图以执行查询。用户还可以单击任何图形以在点击位置重新定位地图。假设图形具有点几何：如下

require(["dojo/_base/event",
  "esri/map", "esri/tasks/Query", "esri/tasks/QueryTask" ...],
  function(event, Map, Query, QueryTask, ...) {
    var map = new Map("mapDiv"),
    mapOnClick = map.on("click", executeQuery),
    mapOnLoad = map.on("load", function(){
      map.graphics.on("click", recenterMap);
    }),
    queryTask = new QueryTask(...);
    map.addLayer(...);

    function executeQuery(event) {
      var query = new Query({
        geometry: event.mapPoint
      });
      queryTask.execute(query, ...);
    }

    function recenterMap(event) {
      map.centerAt(event.mapPoint);
    }
});

在Internet Explorer中，当用户单击以重新定位地图时，上述代码可能会执行不需要的查询。这是因为click事件不仅在图形容器上触发，而且在map div上触发。要确保事件不会传播到map div，可以通过将以粗体显示的行添加到recenterMap函数来停止事件：

function recenterMap(evt) {
  // event is an alias for dojo/_base/event
  event.stop(event);
  map.centerAt(evt.mapPoint);
}

六、设置范围Set Extents

默认范围
如果在初始化地图时不包含范围信息，则默认范围是初始范围，即上次保存在地图文档中的地图范围。如果您使用多个服务，则默认范围是基本地图或添加的第一个图层的初始范围。
设置新的起始范围
方式一 ：在Map构造函数中设置范围。

function init() {
  var startExtent = new Extent(-95.271, 38.933, -95.228, 38.976,
          new SpatialReference({ wkid:4326 }) );
  var myMap = new Map("mapDiv", { extent: startExtent });
  var mapServiceURL = "https://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap_World_2D/MapServer";
  myMap.addLayer(new ArcGISTiledMapServiceLayer(mapServiceURL));
}

方式二：使用Map.setExtent方法设置范围。

function init() {
  myMap = new Map("mapDiv");
  var startExtent = new Extent(-95.271, 38.933, -95.228, 38.976,
          new SpatialReference({ wkid:4326 }) );

  myMap.setExtent(startExtent);
  var mapServiceURL = "https://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap_World_2D/MapServer";
  myMap.addLayer(new ArcGISTiledMapServiceLayer(mapServiceURL));
}

使用多个服务时设置开始范围

function initLayers() {
  var primaryMapServiceURL = "https://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap_World_2D/MapServer";
  var myService1 = new ArcGISTiledMapServiceLayer(primaryMapServiceURL);

  var secondaryMapServiceURL = "https://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Petroleum/KGS_OilGasFields_Kansas/MapServer";
  var myService2 = new ArcGISDynamicMapServiceLayer(secondaryMapServiceURL, {opacity:0.75});

  var layerLoadCount = 0;
  //When both layers have loaded, run addLayersSetExtent
  myService1.on("load", function(service) {
    layerLoadCount += 1;
    if (layerLoadCount === 2) {
      createMapAddLayers(myService1,myService2);
    }
  });

  myService2.on("load", function(service) {
    layerLoadCount += 1;
    if (layerLoadCount === 2) {
      createMapAddLayers(myService1,myService2);
    }
  });
}

//Create a map, set the extent, and add the services to the map.
function createMapAddLayers(myService1,myService2) {
  //create map
  myMap = new Map("mapDiv", { extent:myService2.fullExtent });
  myMap.addLayer(myService1);
  myMap.addLayer(myService2);
}

Getting the current extent using “ Map.onExtentChange” event.

function init(){
 var myMap = new Map("mapDiv");

 var mapServiceURL = "https://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap_World_2D/MapServer";
 myMap.addLayer(new ArcGISTiledMapServiceLayer(mapServiceURL));
 myMap.addLayer(mapServiceURL);

 myMap.on("extent-change", showExtent);
}

function showExtent(ext){
 var extentString = "";
 extentString = "XMin: " + ext.xmin +
   " YMin: " + ext.ymin +
   " XMax: " + ext.xmax +
   " YMax: " + ext.ymax;
 document.getElementById("onExtentChangeInfo").innerHTML = extentString;
}

七、编辑

ArcGIS API for JavaScript支持通过Web编辑地理数据。
API包括可帮助您向应用程序添加编辑功能的小部件。您可以在地图和Web应用程序中进行一些设计工作，以简化编辑时的最终用户体验。例如，您可以预定义一组ArcGIS 10中的新功能模板，以便用户更轻松地添加某些类型的常用功能。您还可以限制可添加的属性，并在下拉列表中添加一些可用的属性选项，以便于准确，统一的数据输入。作为Web编辑应用程序的设计者，您可以完全控制向用户公开的编辑体验的简单性或复杂性。

Web编辑需要对要素服务进行一些初始设置，该服务会公开有关图层要素几何和属性的信息。此外，几何服务可用于完成某些Web编辑任务。例如，要使用主编辑器窗口小部件，您必须具有正在运行的几何服务。

如何在ArcGIS Web API中进行编辑？
ArcGIS Web API提供简单的功能编辑。这些功能可能来自已注册的地理数据库，也可能来自ArcGIS Online或Portal for ArcGIS的托管要素服务。

使用Web API编辑数据时，可以添加，删除，移动，剪切，合并和重塑特征。您还可以编辑要素属性。如果您尝试与其他人同时修改同一功能，则最后一次编辑是提交给数据库的编辑。

对于某些Web编辑工作流程，让分析师使用ArcGIS Desktop定期检查编辑以验证数据完整性是个好主意。虽然编辑小部件可以执行某些数据验证，但是无法通过Web执行其他任务，例如验证拓扑。

如何为我的应用程序添加编辑功能？
ArcGIS API for JavaScript提供了小部件，使您可以更轻松地向Web应用程序添加编辑。可以使用以下小部件。：编辑小工具、模板选择器、属性检查器、附件编辑器
编辑小工具
如果您想快速入门，或者您只想使用API​​附带的默认编辑界面，请使用编辑器小部件。“编辑器”窗口小部件结合了其他窗口小部件的功能，以提供编辑图层所需的一切。您可以选择窗口小部件上可用的工具的数量和类型。
编辑器窗口小部件在编辑后立即保存您的编辑，例如，一旦完成绘制多边形。如果您决定不使用“编辑器”窗口小部件，则必须自行确定要应用编辑的时间和频率。
如果您不使用编辑器小部件，则需要编写自己的编辑体验代码。但是，您仍然可以利用模板选择器，属性检查器和附件编辑器小部件来帮助您。

模板选择器
该模板选取器显示的一组用户可以创建预配置功能的选择。模板选择器是一种很好的方式，可以显示预配置的要素类型，以便于编辑和质量控制。模板选取器中可见的符号可以来自您在要素服务的源地图中定义的编辑模板，也可以是您在应用程序中定义的一组符号。
模板选取器包含在编辑器小部件中。模板选择器可以单独使用，作为地图的简单图例。单击此处查看使用模板选择器显示地图图例的示例。

属性检查器
当您在Web上创建可用于编辑的属性时，需要为用户提供用于编辑属性的界面，并且必须确保他们输入的数据有效。在属性检查器插件可以帮助您与这两个任务。
Attribute Inspector读取通过要素图层可用的属性字段，并提供用户界面以轻松更新这些字段。它还验证在字段中输入的数据，确保输入与预期的数据类型匹配。例如，如果将编码值域应用于字段，则允许值将显示在下拉列表中，从而限制输入其他值的可能性。如果字段需要日期值，则会显示日历，帮助用户提供有效日期。
Attribute Inspector公开图层上的所有可用属性以进行编辑。如果要限制可用属性，则必须编写自己的接口以输入和验证值。
“编辑器”窗口小部件中包含“属性”检查器。

附件编辑器
在某些情况下，您可能希望将可下载文件与功能相关联。例如，您可能希望用户能够单击表示房地产的功能，并查看标题契约的PDF文件的链接。在ArcGIS Web API中，像这样的关联可下载文件称为功能附件。
该附件编辑器是一个小工具，可以帮助用户上传和查看功能附件。附件编辑器包括当前附件列表（使用“删除”按钮），以及可用于上载更多附件的“浏览”按钮。附件编辑器在信息窗口内运行良好，但可以放在页面的其他位置。
要使用要素附件，必须在源要素类上启用附件。您可以在ArcCatalog中为要素类启用附件，也可以在ArcMap中为目录窗口启用附件。如果编辑器窗口小部件检测到启用了附件，则它将包括附件编辑器。

编辑如何工作？
使用ArcGIS Web API进行编辑是通过要素服务进行的，这是ArcGIS 10提供的一种新型服务。编辑工作流也可以利用几何服务。

功能服务的作用
Web编辑需要要素服务来提供数据的符号系统和要素几何。要素服务只是启用了功能访问功能的地图服务。此功能允许地图服务以易于Web应用程序使用和更新的方式公开要素几何及其符号。

在构建Web编辑应用程序之前，您需要做一些工作来创建一个功能服务，公开要编辑的图层。这涉及设置地图文档，并可选择定义一些模板以进行编辑。模板允许您为一些常用的要素类型预先配置符号系统和属性。例如，要准备编辑道路，您可以配置“受控访问高速公路”，“其他分开的高速公路”，“州道”和“本地道路”的模板。模板是可选的，但它们使应用程序的最终用户可以轻松创建常用功能。

地图完成后，您需要将其发布到ArcGIS Server并启用功能访问功能。这会为地图服务和要素服务创建REST URL或端点。您将使用这些URL来引用应用程序中的服务。

可以通过称为要素图层的新类型在Web API中访问要素服务。要素图层可以执行各种操作，并可以引用地图服务或要素服务; 但是，当您使用要素图层进行编辑时，需要引用要素服务。

编辑时，Web应用程序会告诉要素图层哪些属性已更改，以及（如果适用）几何图形如何更改。功能层还会在编辑后显示更新的功能。您可以在要素图层上调用applyEdits方法以应用编辑，然后将编辑内容提交到数据库。

几何服务的作用
ArcGIS Server几何服务有助于执行常见的编辑操作，例如创建，剪切和重塑地理要素。在使用“编辑器”窗口小部件之前，需要在ArcGIS Server上创建几何服务。然后，在创建窗口小部件时，必须提供几何服务的URL。窗口小部件使用幕后服务，除非您决定不使用窗口小部件，否则您不必自己调用几何服务上的方法。

如果您决定不使用“编辑器”窗口小部件，则仍可以使用几何服务来帮助您编写自己的编辑工具。几何服务还可以帮助您验证数据。例如，您可以使用几何服务对编辑执行检查，例如“没有编辑可能会落在此框之外”，或“多边形边界可能不会跨越自身”。（在将几何图形提交到数据库之前，“编辑器”窗口小部件实际上会调用几何服务上的Simplify（）方法。）虽然通过“编辑器”窗口小部件或编辑相关的类不能使用ArcGIS拓扑验证，但几何服务可以帮助您实现通过这些类型的数据完整性检查得到类似结果

“编辑”工具栏
“编辑”工具栏是一个类，可帮助您编码顶点和图形的放置和移动。这在您不使用Editor小部件并且您需要编写自己的编辑逻辑的情况下很有用，尤其是客户端显示行为。与其他工具栏（绘图和导航）一样，“编辑”工具栏不是用户界面工具栏。相反，它是一个帮助程序类，可以更容易地编写一些常见的相关函数。

设计您的编辑体验
在构建Web编辑应用程序时，重要的是要考虑谁将使用该应用程序以及他们需要做什么。您应该为您的用户提供他们所需的工具。在大多数情况下，您可以通过API中包含的编辑小部件的组合为用户设计适当的编辑体验。请记住，虽然API包含一个全面的编辑器小部件来帮助您入门，但这个特定的小部件可能不是最适合您的方案。

在某些方面，已经为您简化了API的编辑体验。小部件不包括用于启动和停止编辑会话或用于保存编辑的按钮。您可以选择提供这些功能，但大多数应用程序都不需要这些功能。

考虑以下设计Web编辑应用程序的方法。每种方法都有自己的优点和类型应用程序，它们是最合适的。

功能草图
在这种类型的应用程序中，现场分析师需要在地图上绘制简单的事件或想法，并添加相关的注释。鸟类瞄准，设想的踪迹或拟议的荒野区域都是在这种类型的应用中可能勾勒出的所有特征类型的例子。在这种情况下，易于使用和在地图上直观绘图的自由比几何精度更重要。

构建要素草图绘制应用程序时，可以使用模板选取器来限制用户可以绘制草图的项目类型。Attribute Inspector也非常有用，允许编辑者在侧面板或单击该功能时出现的信息窗口中添加注释。拆分和合并功能，在X / Y位置添加点，捕捉或上传功能附件的选项可能会使应用程序混乱，除非绝对需要，否则应该避免使用。
单击此处查看显示如何构建功能草图绘制应用程序的示例。

仅属性编辑
某些编辑应用程序包含映射组件，但不需要更改地理要素。例如，您可能希望创建一个Web应用程序，允许任何办公室员工编辑数据库中宗地功能的属性。您希望阻止它们编辑几何图形，将该任务留给GIS分析人员。在此方案中，您可以在应用程序中包含地图，但仅通过“属性”检查器公开编辑。单击地块上的简单地图会显示要编辑的属性。您无需包含任何按钮或小部件来创建，删除或重塑功能。
单击此处查看显示如何构建属性编辑应用程序的示例。

十、Adding a task 添加任务

主要就是使用查询任务，该任务显示表格结果但不包括地图。

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <!--The viewport meta tag is used to improve the presentation and behavior of the samples
      on iOS devices-->
    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
    <title>Query State Info without Map</title>

    <script src="https://js.arcgis.com/3.23/"></script>
    <script>
      require([
        "dojo/dom", "dojo/on",
        "esri/tasks/query", "esri/tasks/QueryTask", "dojo/domReady!"
      ], function (dom, on, Query, QueryTask) {

        var queryTask = new QueryTask("http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Demographics/ESRI_Census_USA/MapServer/5");

        var query = new Query();
        query.returnGeometry = false;
        query.outFields = [
          "SQMI", "STATE_NAME", "STATE_FIPS", "SUB_REGION", "STATE_ABBR",
          "POP2000", "POP2007", "POP00_SQMI", "POP07_SQMI", "HOUSEHOLDS",
          "MALES", "FEMALES", "WHITE", "BLACK", "AMERI_ES", "ASIAN", "OTHER",
          "HISPANIC", "AGE_UNDER5", "AGE_5_17", "AGE_18_21", "AGE_22_29",
          "AGE_30_39", "AGE_40_49", "AGE_50_64", "AGE_65_UP"
        ];

        on(dom.byId("execute"), "click", execute);

        function execute () {
          query.text = dom.byId("stateName").value;
          queryTask.execute(query, showResults);
        }

        function showResults (results) {
          var resultItems = [];
          var resultCount = results.features.length;
          for (var i = 0; i < resultCount; i++) {
            var featureAttributes = results.features[i].attributes;
            for (var attr in featureAttributes) {
              resultItems.push("<b>" + attr + ":</b>  " + featureAttributes[attr] + "<br>");
            }
            resultItems.push("<br>");
          }
          dom.byId("info").innerHTML = resultItems.join("");
        }
      });
    </script>
  </head>

  <body>
    US state name :
    <input type="text" id="stateName" value="California">
    <input id="execute" type="button" value="Get Details">
    <br />
    <br />
    <div id="info" style="padding:5px; margin:5px; background-color:#eee;">
    </div>
  </body>
</html>

十一、使用QueryTask，Query和FeatureSet

QueryTask，Query和FeatureSet一起用于查询地图中的图层并显示结果。

第一步是Query。用户为查询提供输入。此输入可能包括：选择地图上的要素，从列表中选择值或键入值。这些输入用于创建“查询过滤器”。
第二步，QueryTask基于“查询过滤器”执查询。
最后一步，结果将在FeatureSet中返回。这些结果包括：突出显示地图上的要素而选择的每个要素的几何图形。还包括在InfoWindow或HTML表格中显示的表格数据。

过程如下：
1.创建init（）函数
您可以使用Init函数初始化将在以后的函数中使用的类。
初始化地图并添加图层。
初始化QueryTask层。请注意，URL包含图层ID。在该示例中，层ID是“0”。
初始化查询。您应指定除实际过滤器之外的所有内容。在此示例中，outFields中包含输出字段列表。指定输出字段时，应仅将字段限制为您希望在查询或结果中使用的字段。您包含的字段越少，响应速度就越快。您必须使用实际的字段名称而不是别名，但是稍后在显示结果时可以使用别名。
初始化InfoTemplate。如果您打算使用InfoWindow来显示结果，那么现在是构建InfoTemplate的好时机。语法$ {fieldName}在运行时被替换为实际属性值。第一个值是标题。其余值组成InfoWindow的文本。您可以使用任何有效的HTML。
初始化要用于在地图上显示突出显示的要素的符号。

// AMD
require([
  "esri/map",
  "esri/layers/ArcGISDynamicMapServiceLayer",
  "esri/tasks/QueryTask",
  "esri/tasks/query",
  "esri/symbols/SimpleMarkerSymbol",
  "esri/InfoTemplate",
  "dojo/_base/Color",
  "dojo/dom",
  "dojo/on",
  "dojo/domReady!"
], function(Map, ArcGISDynamicMapServiceLayer, QueryTask, Query, SimpleMarkerSymbol, InfoTemplate, Color, dom, on) {
  //create map and add layer
  map = new Map("mapDiv");
  var layer = new ArcGISDynamicMapServiceLayer(
    "http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Specialty/ESRI_StatesCitiesRivers_USA/MapServer");
  map.addLayer(layer);

  //initialize query task
  queryTask = new QueryTask("http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Specialty/ESRI_StatesCitiesRivers_USA/MapServer/0");

  //initialize query
  query = new Query();
  query.returnGeometry = true;
  query.outFields = ["CITY_NAME", "STATE_NAME", "POP1990"];

  //initialize InfoTemplate
  infoTemplate = new InfoTemplate("${CITY_NAME}", "Name : ${CITY_NAME}<br/> State : ${STATE_NAME}<br />Population : ${POP1990}");

  //create symbol for selected features
  symbol = new SimpleMarkerSymbol();
  symbol.setStyle(SimpleMarkerSymbol.STYLE_SQUARE);
  symbol.setSize(10);
  symbol.setColor(new Color([255,255,0,0.5]));

  //write "Get Details" button's click event 
  on(dom.byId("runQuery"), "click", executeQueryTask);
});

2.executeQueryTask函数 - 回调函数
根据用户输入创建查询过滤器并执行查询。用户输入可能包括选择地图上的要素，从列表中选择值或键入值。在该示例中，指示用户输入总体值。
创建回调函数executeQueryTask（）
回调函数是从HTML页面中的输入引用的函数。在此示例中，在用户键入填充值并单击“获取详细信息”按钮后，将调用名为“executeQueryTask”的函数。
The "population" value is plugged into Query.where. The where attribute is one of three filters you can use with Query:

**Query.where**: any valid SQL where statement. You need to make sure you have the correct sequence of single and double quotes when writing the where clause in JavaScript.
String query:

    query.where = "NAME = '" + stateName + "'";

Number query:

    query.where = "POP1990 > " + population;

**Query.text**: shorthand for a where clause using "like". The field used is the display field defined in the map document. You can determine what the display field is for a layer in Services Directory.

    query.text = stateName;

**Query.geometry:** when a user selects features on a map.

    query.geometry = evt.mapPoint;

3.创建查询过滤器后，执行查询。您可以通过QueryTask.execute（）方法执行此操作。方法的输入是Query和对名为“showResults”的函数的引用。

function executeQueryTask() {
  //set query based on what user typed in for population;
  query.where = "POP1990 > " + dom.byId("population").value;
 
  //execute query
  queryTask.execute(query,showResults);
}

4.创建一个显示结果的函数
showResults（）函数有一个FeatureSet作为输入。执行查询时将填充FeatureSet。此函数解析FeatureSet中的结果并将它们添加到GraphicsLayer。几何图形用于在地图上绘制图形要素。使用InfoTemplate将属性值添加到图形中。当用户单击突出显示的功能时，InfoWindow会弹出结果。

function showResults(featureSet) {
  //remove all graphics on the maps graphics layer
  map.graphics.clear();

  //Performance enhancer - assign featureSet array to a single variable.
  var resultFeatures = featureSet.features;

  //Loop through each feature returned
  for (var i=0, il=resultFeatures.length; i<il; i++) {
    //Get the current feature from the featureSet.
    //Feature is a graphic
    var graphic = resultFeatures[i];
    graphic.setSymbol(symbol);

    //Set the infoTemplate.
    graphic.setInfoTemplate(infoTemplate);

    //Add graphic to the map graphics layer.
    map.graphics.add(graphic);
  }
}

5.HTML body
该body部分包含用户在HTML页面上看到的内容。

用户可以输入人口。当用户单击“获取详细信息”按钮时，将调用onclick事件并调用executeQueryTask（）函数。
地图显示在mapDiv中。执行查询后，将突出显示所选要素。当用户单击某个功能时，会出现InfoWindow。

<body>
  <br/>
  US city population greater than : <input type="text" id="population" value="500000" />
  <input type="button" value="Get Details" id="runQuery" />
  <div id="mapDiv" style="width:600px; height:600px; border:1px solid #000;"></div>
  Click on a city once it's highlighted to get an InfoWindow.
</body>