arcgis android 气泡,arcgis api for js入门开发系列二十一气泡窗口信息动态配置模板...

最新推荐文章于 2023-11-02 16:58:28 发布

吸奇侠

最新推荐文章于 2023-11-02 16:58:28 发布

阅读量153

点赞数

文章标签： arcgis android 气泡

前面舆图盘问篇实现图层盘问query成果，但是盘问功效的气泡窗口展示信息是在代码写死绑定图层的字段来的，好比name属性字段对应的值。但是这种实现方法很不灵活，对付图层字段不乱的情况下或者多个图层字段名称都是一致情况下，还好，代码也不用改观；要是图层字段新增或者删除以及多个图层的字段不一致情况下，每次窜改，盘问功效的js代码也要对应的改削，对付维护来说，挺未便利的。所以，本篇优化一下气泡窗口的信息模板，采纳动态可配置化图层字段方法，在配置文件里面配置好图层需要展示的字段模板，，好比在mapconfig文件配置如下：

/*配置气泡窗口模板匹配字段信息*/MapConfig.fields={"metro": {

simple: [

{ field:"Name_CHN", alias: "中文名称"},

{ field:"NAME_ENG", alias: "英文名称"},

{ field:"Code", alias: "编码"},

{ field:"ExitCount", alias: "出口数"}

]

}

效果图如下：

具体的实现思路如下：

1.图层盘问函数：

queryPoints:function(){var typeUrl = "";var queryTask = "";var query = newesri.tasks.Query();

query.returnGeometry= true;

query.outFields= ["*"];

query.where= "1=1";

typeUrl= "http://localhost:6080/arcgis/rest/services/gzTest/MapServer/1";

queryTask= newesri.tasks.QueryTask(typeUrl);

queryTask.execute(query,function(results) {var symbol = new esri.symbol.PictureMarkerSymbol(getRootPath() + "Content/images/poi/poiLocation.png", 24, 24);if (results.features.length > 0) {var rExtent = null;for (var i = 0; i < results.features.length; i++) {var htmlstr = DCI.poiBusiness.getQueryWinContent(results.features[i].attributes, "metro");var attr = { "title": "", "content": htmlstr };var baseGraphic = newesri.Graphic(results.features[i].geometry, symbol, attr);

DCI.poiBusiness.graphicslayer.add(baseGraphic);//设置舆图显示范畴

if (rExtent == null)

rExtent=baseGraphic._extent;else{

rExtent=rExtent.union(baseGraphic._extent);

}

DCI.poiBusiness.map.esriMap.setExtent(rExtent.expand(2));

}else{

alert("搜索不到相关数据");

}

});

2.动态配置模板的气泡窗口信息内容模板：

/**

* 气泡窗口信息详情模板*/getQueryWinContent:function(json, pointType) {var html = "";if(MapConfig.fields[pointType])var fields = MapConfig.fields[pointType].simple;//默认是配置文件的第一个配置字段列表

else{returnhtml;

}

html= "

" +

html+= "

" +

" + fields[i].alias + ":" +

" +

}

html+= "

" +

html+= "