实现效果
ArcGISDynamicMapServiceLayer加载的图层(可为其它Layer加载的图层),实现此图层加载的元素周围点击进行空间查询,小窗口显示此元素的属性信息
代码
var smdf_url; //layer图层的server服务地址
var map;//地图对象
$(function() {
dojo.require("esri.map");
dojo.require("esri.layers.ArcGISDynamicMapServiceLayer");
dojo.require("esri.SpatialReference");
dojo.require("esri.tasks.IdentifyTask");
dojo.require("esri.tasks.IdentifyParameters");
dojo.require("esri.geometry.ScreenPoint");
dojo.require("esri.dijit.editing.AttachmentEditor");
dojo.require("dojo.dom");
/**
* 加载init()初始化
*/
dojo.addOnLoad(init);
});
/**
* 初始化地图加载图层
*/
function init() {
var spatialReference = new esri.SpatialReference({"wkid":4490});
map = new esri.Map("mapDiv");
map.spatialReference = spatialReference;
m_graphicsLayer = new esri.layers.ArcGISDynamicMapServiceLayer(smdf_url,
{"spatialReference" : {"wkid" : 4490}});
map.addLayer(m_graphicsLayer);
initFunctionality();
}
/**
* 空间查询属性设置
*/
function initFunctionality() {
map.on("click", doIdentify);//创建地图点击事件
identifyTask = new esri.tasks.IdentifyTask(smdf_url);//查询
identifyParams = new esri.tasks.IdentifyParameters();//查询参数
identifyParams.tolerance = 10;//容差范围
identifyParams.returnGeometry = true;//是否返回图形
identifyParams.layerIds = [ 0 ];//查询图层
identifyParams.layerOption = esri.tasks.IdentifyParameters.LAYER_OPTION_VISIBLE;//设置查询的图层
//查询范围
identifyParams.width = map.width;
identifyParams.height = map.height;
}
/**
* 执行空间查询
*/
function doIdentify(event) {
identifyParams.geometry = event.mapPoint;
identifyParams.mapExtent = map.extent;
//attachmentEditor支持启用附件,我参考的是官方 ,其中dojo.dom.byId("content")的参数id可不存在
var attachmentEditor = new esri.dijit.editing.AttachmentEditor({}, dojo.dom.byId("content"));
identifyTask.execute(identifyParams,function(results) { //执行查询
var feature;
if (results.length > 0) {
for (var i = 0; i < results.length; i++) {
feature = results[i].feature;
map.infoWindow.setTitle("我是弹出框");
map.infoWindow //自定义显示内容
.setContent("<span>河道里程(m):</span>"
+ feature.attributes.chainage
+ "<br>"
+ "<span>堤顶高程(m):</span>"
+ feature.attributes.dike_terr
+ "<br>"
+ "<span>水面高程(m):</span>"
+ (feature.attributes.dike_terr - feature.attributes.water).toFixed(3)
+ "<br>"
+ "<span>水面距堤顶(m):</span>"
+ feature.attributes.water);
attachmentEditor.showAttachments(feature, dynamicMapServiceLayer);
//我的项目加载的layer元素为线类型,返回的经纬度位置为多个,所以需要取其中一个或者取中间位置,我取的中间位置
var ceilnum = Math.ceil(feature.geometry.paths[0].length/2)
var x = feature.geometry.paths[0][ceilnum][0];
var y = feature.geometry.paths[0][ceilnum][1];
//创建窗口弹出位置,注意需要与底图相同的坐标系
var screenPoint = new esri.geometry.ScreenPoint(x,y);
screenPoint.spatialReference = map.spatialReference;
//显示窗口
map.infoWindow.show(screenPoint,map.getInfoWindowAnchor(screenPoint));
}
}
});
}