8、query鼠标移动选择面,并显示信息窗口
query选择面,并显示信息窗口
1、 首先完成地图的加载,详细见前面的介绍,本例使用的数据服务为:本地,地址为:
http://localhost/ArcGIS/rest/services/China/MapServer
要做查询的图层为:id=0
2、 添加query任务:
dojo.require("esri.tasks.query");
添加map的事件:dojo.connect(map,"onMouseMove",executeQueryTask);
即当鼠标在地图上移动时执行函数executeQueryTask查询
新建query任务:
//新建查询任务 queryTask = new esri.tasks.QueryTask("http://localhost/ArcGIS/rest/services/China/MapServer/0");//指定查询图层 query = new esri.tasks.Query();//初始化查询任务 query.returnGeometry = true;//可以返回Geometry query.outFields = ["FID"];//要查询的字段 infoTemplate = new esri.InfoTemplate("信息","ID:${FID}");//定义信息窗内容
3、 编写执行查询任务的函数:
function executeQueryTask(evt) { query.geometry = evt.mapPoint;//查询依据的输入图元 queryTask.execute(query, showResults);//执行查询,并在查询出后,调用showResults函数 }
4、 showResults函数的编写:
function showResults(featureSet) { map.graphics.clear();//删除所有图形 for (var i=0, il=featureSet.features.length; i<il; i++) { //从features中获取所有图元 //将features转成Graphics var graphic = featureSet.features[0]; 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]));//定义样式 graphic.setSymbol(symbol); graphic.setInfoTemplate(infoTemplate);//设置Graphics的信息窗口 map.graphics.add(graphic); //添加Graphics } }
5、 这样即可完成效果:
鼠标移动即可选择图元,选择后单击即可得到定制的信息。
6、 效果图为:
存在的问题:
因后台反应较慢,致使鼠标移动查询结果滞后,须等待一会才可以完成查询!!
改进可采用鼠标单击查询!!
博客地址: http://www.cnblogs.com/dwf07223,本文以学习、研究和分享为主,欢迎转载,转载请务必保留此出处。若本博文中有不妥或者错误处请不吝赐教。 |