博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
arcgis api for js实现点击文字内容获取所对应的点高亮显示。
阅读量:7227 次
发布时间:2019-06-29

本文共 2349 字,大约阅读时间需要 7 分钟。

arcgis api for js 中经常会遇到想要点击文本就能获取所对应的点并高亮显示。其原理与搜索框内搜索属性值并高亮显示在地图中的原理是一样的。其核心的观念就是将所点击的文本值获取并替换给搜索框所要传入的值。即可得到我们的目的。

代码如下:

var name;//声明name为全局变量后面代替搜索框要传入的值$(function(){  $('.test2 a').click(function(){  $(this).parent().each(function () {
//移除其余非点中状态 $('.test2 a').removeClass("special_color"); }); $(this).addClass("special_color");//给所点中的增加样式name=$(this).text(); })})//获取所点击的文本值并赋给name; require([ "esri/map", "esri/layers/ArcGISTiledMapServiceLayer", "esri/layers/FeatureLayer", "esri/layers/GraphicsLayer", "esri/graphic", "esri/geometry/Point", "esri/symbols/SimpleFillSymbol", "esri/symbols/SimpleLineSymbol", "esri/symbols/SimpleMarkerSymbol", "dojo/_base/Color", "esri/tasks/query", "esri/tasks/QueryTask", "dojo/on", "dojo/dom", "dojo/domReady!"], function(Map, Tiled, FeatureLayer, GraphicsLayer, Graphic, Point, SimpleFillSymbol, SimpleLineSymbol, SimpleMarkerSymbol, Color, Query, QueryTask, on, dom) { $('.test2 a').click(function(event){ map.graphics.clear(); var city = new FeatureLayer("http://192.168.58.138:6080/arcgis/rest/services/%E6%9C%80%E5%90%8E%E7%9A%84%E5%9B%BE%E5%B1%82/%E4%B8%9D%E7%BB%B8%E4%B9%8B%E8%B7%AF/FeatureServer/0"); // var name = dom.byId("name").value; var query = new Query(); query.where = "name = '"+name+"'"; city.queryFeatures(query, function(results) { var features = results.features; console.log(features); map.centerAndZoom(features[0].geometry,4); var symbol= new esri.symbol.SimpleMarkerSymbol(); symbol.setSize(35); symbol.setColor(new dojo.Color([250,128,114,0.3])); map.graphics.add(new Graphic(features[0].geometry,symbol)); }); }); });

 

转载于:https://www.cnblogs.com/HuangDaDa/p/7352415.html

你可能感兴趣的文章
scrollview不充满屏幕的原因
查看>>
PHP单例模式
查看>>
解密敏捷自动化测试
查看>>
DelphiMVC拦截器介绍
查看>>
Spring Cloud构建微服务架构:分布式配置中心【Dalston版】
查看>>
iOS 11正式版终于来了!强力助攻小程序
查看>>
开放平台API接口调用频率控制系统设计浅谈
查看>>
Lucene4.3进阶开发之潜龙勿用( 七)
查看>>
DTD和schema小总结
查看>>
去掉导航栏的黑线
查看>>
怎样让html加载完毕后加载js代码
查看>>
piwik 案例介绍
查看>>
敏感字过滤
查看>>
为什么我们要从 NodeJS 迁移到 Ruby on Rails
查看>>
Android 文件式数据库Realm
查看>>
Linux 面试知识点笔记
查看>>
论flex布局和box布局的华为meta8手机自带浏览器的兼容
查看>>
dubbo与springcloud初识
查看>>
iis web.config 配置示例
查看>>
归并排序
查看>>