描述

本例展示了如何使用查找任务搜索数据。本例在地图上用图表显示结果并用DojoX的grid格式化结果为表格样式。

FindTask构造函数需要一个ArcGIS Server地图服务的URL。本例使用ESRI sample server上的ESRI_StatesCitiesRivers_USA服务。

findTask = new esri.tasks.FindTask("http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Specialty/ESRI_StatesCitiesRivers_USA/MapServer");

FindParameters指出哪些图层和字段将被搜索。如果多个图层包含相同的字段名称(例如"NAME")两个字段都要被搜索。注意returnGeometry被设置为true以便结果能被显示在地图上。

findParams = new esri.tasks.FindParameters();
findParams.returnGeometry = true;
findParams.layerIds = [0,1,2];
findParams.searchFields = ["CITY_NAME","NAME","SYSTEM","STATE_ABBR","STATE_NAME"];

FindParameters的searchText参数是任务将要搜索什么。这个文本来自输入框并且当单击Find按钮时被发送到execute函数。这行代码执行任务:

findTask.execute(findParams,showResults);

当任务执行结束,showResults函数循环访问FindResult里的graphics数组并增加每个图形到地图。函数也增加每个结果的属性到表格。

注意: ArcGIS JavaScript API的版本1.2使用Dojo 1.2,这有一个改良的表格DataGrid。如果移植应用到ArcGIS JavaScript API 1.2并且想要在本例中继续使用旧版的表格,在代码中查找这行:

dojo.require("dojox.grid._data.model");

修改为:

dojo.require("dojox.grid.compat._data.model");
 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=7" />
<title>Find Task</title>
<style type="text/css">
@import "http://serverapi.arcgisonline.com/jsapi/arcgis/1.5/js/dojo/dijit/themes/tundra/tundra.css";
@import "http://serverapi.arcgisonline.com/jsapi/arcgis/1.5/js/dojo/dojox/grid/compat/_grid/Grid.css";
@import "http://serverapi.arcgisonline.com/jsapi/arcgis/1.5/js/dojo/dojox/grid/compat/_grid/tundraGrid.css";
body { font-size: 0.9em;
font-family: Geneva, Arial, Helvetica, sans-serif;
}
.heading { font-weight: bold;
padding-bottom: 0.25em;
}
#grid { border: 1px solid #333;
width: 33em;
height: 30em;
}
</style>
<script type="text/javascript">djConfig={parseOnLoad:true}</script>
<script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=1.5"></script>
<script type="text/javascript" language="Javascript">
dojo.require("dojox.grid.Grid");
dojo.require("dojox.grid.compat._data.model"); //Because of changes in the Dojo data grid and model you must load the comapt_data.model if using version 1.3.
dojo.require("esri.map");
dojo.require("esri.tasks.find"); var findTask, findParams, map; function init() {
map = new esri.Map("map");
var censusMapLayer = new esri.layers.ArcGISDynamicMapServiceLayer("http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Specialty/ESRI_StatesCitiesRivers_USA/MapServer", {id:"usa"});
map.addLayer(censusMapLayer); //实例化FindTask
findTask = new esri.tasks.FindTask("http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Specialty/ESRI_StatesCitiesRivers_USA/MapServer");
//FindTask的参数
findParams = new esri.tasks.FindParameters();
//返回Geometry
findParams.returnGeometry = true;
//查询的图层id
findParams.layerIds = [0,1,2];
//查询字段
findParams.searchFields = ["CITY_NAME","NAME","SYSTEM","STATE_ABBR","STATE_NAME"]; } //根据输入的关键字进行findTask操纵
function execute(searchText) {
//set the search text to find parameters
findParams.searchText = searchText;
findTask.execute(findParams,showResults);
}
//显示findTask的结果
function showResults(results) { //清除上一次的高亮显示
map.graphics.clear();
var dataForGrid = []; for (var i=0, j=results.length; i<j; i++) {
var curFeature = results[i];
var graphic = curFeature.feature; //把查询到的字段信息等插入到dataForGrid
var layerName = curFeature.layerName;
var layerId = curFeature.layerId;
var foundFieldName = curFeature.foundFieldName;
var foundFieldValue = graphic.attributes[foundFieldName]; var attValues = [layerName,layerId,foundFieldName,foundFieldValue];
dataForGrid.push(attValues);
//根据类型设置显示样式
switch (graphic.geometry.type) {
case "point":
var symbol = new esri.symbol.SimpleMarkerSymbol(esri.symbol.SimpleMarkerSymbol.STYLE_SQUARE, 10, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID, new dojo.Color([255,0,0]), 1), new dojo.Color([0,255,0,0.25]));
break;
case "polyline":
var symbol = new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_DASH, new dojo.Color([255,0,0]), 1);
break;
case "polygon":
var symbol = new esri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_NONE, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_DASHDOT, new dojo.Color([255,0,0]), 2), new dojo.Color([255,255,0,0.25]));
break;
}
//设置显示样式
graphic.setSymbol(symbol);
//添加到graphics进行高亮显示
map.graphics.add(graphic);
} var model = new dojox.grid.data.Table(null, dataForGrid); var view1 = {
cells: [
[{name: 'Layer Name'},{name: 'Layer ID'},{name: 'Found Field Name'},{name: 'Found Field Value'}]
]
}; var layout = [ view1 ];
gridWidget.setModel(model);
gridWidget.setStructure(layout); } dojo.addOnLoad(init);
</script>
</head>
<body class="tundra">
<div class="heading">Find State/City/River: <input type="text" id="searchText" value="KS" />
<input type="button" value="Find" onclick="execute(dojo.byId('searchText').value);" /></div>
<div id="map" style="width:400px; height:300px; border:1px solid #000;"></div>
<div id="grid" dojoType="dojox.Grid" jsId="gridWidget" structure="layout"></div>
</body>
</html>

ArcGIS api for javascript——查找任务-在地图上查找要素的更多相关文章

  1. ArcGIS API For Javascript :如何在地图上做出点位脉冲闪烁的效果

    日常地图表达中我们通常使用的地图符号多是静态地图符号,时间久了会造成视觉审美疲劳,也没有现代感. 在这种背景下,对现有地图符号进行简单处理,即可得到色彩鲜艳,对比度强烈,活灵活现的地图表达形式. 灵感 ...

  2. ArcGis API for JavaScript学习——加载地图

    ArcGis API for JavaScript开发笔记——加载地图 在这个例子中使用的离线部署的API(请参见 http://note.youdao.com/noteshare?id=f42865 ...

  3. ArcGIS API for JavaScript开发初探——基本地图组件使用

    1.前言 在上一篇我们已经我们已经讲述了第一个地图应用程序的HelloMap的创建过程,这一篇我们来讲述基本地图组件:Home Button.比例尺.鹰眼图的使用方法. 2.基本地图组件 在ArcGI ...

  4. Arcgis api for javascript学习笔记-控制地图缩放比例尺范围(3.2X版本与4.6版本)

    Ⅰ. 在3.X版本中,设置Map对象的 "maxScale" 和 "minScale" 属性 <!DOCTYPE html> <html> ...

  5. ArcGIS API For Javascript :如何制作地图切换器

    大部分情况下我们开发会使用原生的地图切换器,由于每个项目的页面风格不同,业务场景不同,因此需要做一些样式不同的地图切换器. 首先可以照猫画虎,自己照着地图切换器的样式抄一个,或者看看主流的地图切换器都 ...

  6. 基于ArcGIS API for Javascript的地图编辑工具

    最近工作上需要用ArcGIS API for Javascript来开发一个浏览器上使用的地图编辑工具,分享一下一些相关的开发经验. 我开发的地图编辑工具是根据ESRI提供的例子修改而来的,参考的例子 ...

  7. ArcGIS.Server.9.3和ArcGIS API for JavaScript地图实现Toorbar功能(四)

    转自:http://www.cnblogs.com/hll2008/archive/2008/11/22/1338630.html 目的:1.ArcGIS API for JavaScript实现To ...

  8. ArcGIS API for JavaScript 4.2学习笔记[1] 显示地图

    ArcGIS API for JavaScript 4.2直接从官网的Sample中学习,API Reference也是从官网翻译理解过来,鉴于网上截稿前还没有人发布过4.2的学习笔记,我就试试吧. ...

  9. ArcGIS API for JavaScript根据两个点坐标在地图上画线

    ArcGIS API for JavaScript根据两个点坐标在地图上画线比如说a(xxxx,xxxxx),b(xxxx,xxxxx).利用这两个点画一条线 var polyline = new e ...

随机推荐

  1. 50个极好的bootstrap框架

    转自:http://sudasuta.com/bootstrap-admin-templates.html  https://www.cnblogs.com/sanhao/p/9184323.html ...

  2. sublime text3前端常用插件

    安装Package Control 在安装插件之前,需要让sublime安装Package Control.打开Sublime Text的控制台,快捷键ctrl + ~,在控制台中输入以下代码. im ...

  3. ORACLE查询优化之is null和is not null优化

    最近工作的时候遇到了比较大的数据查询,自己的sql在数据量小的时候没问题,在数据量达到300W的时候特别慢,只有自己优化sql了,以前没有优化过,所以记录下来自己的优化过程,本次是关于is null和 ...

  4. 将对象a的属性赋值给对象b

    BeanUtils.copyProperties(a,b); 将a的属性赋值给b(ab的共同属性)

  5. 添加ArcGIS数据

    加载arcgis server的rest服务瓦片数据:ol.layer.Tile+ol.source.TileArcGISRest 加载arcgis online的在线瓦片数据:ol.layer.Ti ...

  6. linux下mysqldump简单命令导出数据库和表

    进入mysql的bin目录执行: 导出单个表: mysqldump -uroot -ppassword --database dbname --tables users > /home/root ...

  7. Tomcat跨域资源共享

    1.下载Jar包 cors-filter-1.7.jar java-property-utils-1.9.jar 下载完成后将Jar拷贝到tomcat下lib目录中 2.修改web.xml配置 在29 ...

  8. sed 替换 引用变量值,记录一个自己学习错误的地方。

    先上脚本,脚本的目的是虚拟机克隆-连接克隆,然后修改ip这个搞定,修改hostname就很简单了 declare oldipdeclare -i Anamedeclare newipoldip=`ca ...

  9. 实验二实验结论&实验总结与体会

    Part1:格式化输出函数printf()和格式化输入函数scanf() ① /* <C语言程序设计教程学习指导>p118 实验内容(1) 这是一个常用格式控制符使用示例 运行程序,结合运 ...

  10. 【图灵杯 E也即POJ 3368】简单的RMQ

    Description 给定一个数组,其中的元素满足非递减顺序.任意给定一个区间[i,j],求其中某个元素重复出现的最大次数. Input 多组数据输入.每组数据的第一行包含两个整数n和q(1< ...