arcgis api for JavaScript学习-查询FindTask

it2025-10-17  6

FindTask查询

Findtask:用于属性查询,可以查询多个图层,不能进行空间查询思路: 创建需要的对象FindTask、FindParameters、渲染符号SimpleLineSymbol等。设置查询参数FindParameters执行查询渲染查询结果 示例代码:注意findtask可以实现精确查找(完全匹配),:contains参数决定是否查找搜索文本的完全匹配。如果为true,则搜索包含提供的searchText的值。这是不区分大小写的搜索。如果为false,则搜索searchText字符串的完全匹配项。精确匹配是区分大小写的。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>查询功能</title> <style> #mapDiv { width: 100%; height: 600px; border: 1px solid #000; } </style> <link rel="stylesheet" type="text/css" href="http://localhost/arcgis_js_api/library/3.17/3.17/dijit/themes/tundra/tundra.css"/> <link rel="stylesheet" type="text/css" href="http://localhost/arcgis_js_api/library/3.17/3.17/esri/css/esri.css" /> <script type="text/Javascript" src="http://localhost/arcgis_js_api/library/3.17/3.17/init.js"></script> <script> /** *思路: * 1. 创建查询对象FindTask,可以查询多个图层,但是只能属性查询 * 2. 创建属性查询参数 * 3. 处理查询结果 * 4. 执行查询 */ require(["esri/map", "esri/layers/ArcGISDynamicMapServiceLayer", "dojo/on", "dojo/dom", "esri/tasks/FindTask", "esri/tasks/FindParameters", "esri/symbols/SimpleLineSymbol", "esri/symbols/SimpleFillSymbol", "esri/graphic", "dojo/domReady!], function (Map, ArcGISDynamicMapServiceLayer,on,dom, FindTask, FindParameters, SimpleLineSymbol,SimpleFillSymbol,Graphic){ var map = new Map('mapDiv'); //地图服务URL var MapServer = "http://localhost:6080/arcgis/rest/services/TestServer/MyMapService/MapServer"; var layer = new ArcGISDynamicMapServiceLayer(MapServer); map.addLayer(layer); //创建属性查询对象并给button绑定点击事件 //创建属性查询对象 var findTask = new FindTask(MapServer); //创建属性查询参数 var findParams = new FindParameters(); on(dom.byId('btn'), 'click', function () { //是否返回给我们几何信息 findParams.returnGeometry =true; //对哪一个图层进行属性查询 findParams.layerIds = [3]; //查询的字段 findParams.searchFields = ['name']; //searchText和searchFields结合使用,即查询name=J4 findParams.searchText = 'J4'; //执行查询对象 findTask.execute(findParams, ShowFindResult); //console.log(findParams); }); //处理属性查询返回给我们的数据 function ShowFindResult(queryResult) { //创建线符号: var lineSymbol = new SimpleLineSymbol("solid", new dojo.Color([255, 0, 0]), 2); //创建面符号 var fill = new SimpleFillSymbol("solid", lineSymbol, new dojo.Color("#87CEEB")); console.log(queryResult); if (queryResult.length === 0) { dom.byId('divShowResult').innerHTML = ""; return; } var htmls = ""; if (queryResult.length >= 1) { htmls = htmls + "<table style='width: 100%;'>"; htmls = htmls + "<tr><td>名称</td></tr>"; console.log(htmls); for (var i = 0; i < queryResult.length; i++) { //获得图形graphic var graphic = queryResult[i].feature; //如此就可以判断这个graphic是什么类型,对应的设置相应的高亮显示的符号了 console.log(graphic.geometry.type === "polygon"); //赋予相应的符号 graphic.setSymbol(fill); //将graphic添加到地图中从而实现高亮效果 map.graphics.add(graphic); //获得教学楼名称(此处是和shp属性表对应的) var ptName = graphic.attributes["alias"]; if (i % 2 === 0) { htmls = htmls + "<tr>"; }else { htmls = htmls + "<tr bgcolor='#F0F0F0'>"; } htmls = htmls + "<td><a href='#'>" + ptName + "</a></td>"; htmls = htmls + "</tr>"; } htmls = htmls + "</table>"; dom.byId('divShowResult').innerHTML = htmls; } } }); </script> </head> <body> <div id="mapDiv"></div> <input type="button" value="属性查询" id="btn"> <div id="divShowResult"></div> </body> </html>
最新回复(0)