openlayers空间点查询之GetFeatureInfo
在map对象上注册点击方法监听, 这里我用的是wms,当然你也可以查询wfs
map.events.register('click', map, function (e) {
var params = {
REQUEST: "GetFeatureInfo",
EXCEPTIONS: "application/vnd.ogc.se_xml",
BBOX: map.getExtent().toBBOX(),
SERVICE: "WMS",
VERSION: "1.1.1",
X: e.xy.x,
Y: e.xy.y,
// INFO_FORMAT: 'text/html', 这里必须注意啦 查询结果会返回不同的格式滴,根据自己的需呀要做不同设置哦,text/html或者application/vnd.ogc.gml
INFO_FORMAT: 'application/vnd.ogc.gml',
QUERY_LAYERS: map.layers[1].params.LAYERS,
FEATURE_COUNT: 50,
Layers: 'mine:locatorinfo_'+MineCode,
WIDTH: map.size.w,
HEIGHT: map.size.h,
format: format,
styles: map.layers[1].params.STYLES,
srs: map.layers[1].params.SRS};
// alert(map.layers[1].params.LAYERS);
OpenLayers.loadURL("http://172.16.0.81:8080/geoserver/mine/wms", params, this, setHTML, failhttml);
tpoint = map.getLonLatFromPixel(e.xy),
OpenLayers.Event.stop(e);
});
查询完毕且成功回调方法是:setHTML 【加载查询失败的方法时failhtml】
var popup1;
function setHTML(response){
// alert(response.responseText);
//获取要素结果集
var g = new OpenLayers.Format.GML();
var features = g.read(response.responseText);
var tempstr = '';
var nfid = '';
var nm = '';
//遍历要素集
for(var feat=0;feat<features.length;feat++){
nm = features[feat].attributes.equipmentid; //获取属性的时候
nfid = features[feat].fid; //fid的获取比较特殊哦,不是按照属性获取方式的,可以参考geoserver发布的服务就能看出那些时属性设置
tempstr += nfid;
}
if(popup1!=null){
map.removePopup(popup1);
}
popup1 = new OpenLayers.Popup.FramedCloud("chicken",
tpoint,
new OpenLayers.Size(200,200),
tempstr,
null,
true);
popup1.autoSize=true;
map.addPopup(popup1);
};
执行逻辑是这样滴,点击图层,查询结果弹出tip提示窗口。
效果如图哦
openlayers空间点查询之GetFeatureInfo的更多相关文章
- 通过openlayers加载dwg格式的CAD图并与互联网地图叠加
Openlayers介绍 Openlayers是一个基于Javacript开发,免费.开源的前端地图开发库,使用它,可以很容易的开发出WebGIS系统.目前Openlayers支持地图瓦片.矢量数 ...
- mapserver+openlayers实现左键点击查询
效果图 第一步,配置自己的mapfile,在要查询的图层LAYER对象内加上HEADER,TEMPLATE,FOOTER三个参数,同时,TEMPLATE fooOnlyForWMSGetFeature ...
- OpenLayers 3+Geoserver+PostGIS实现点击查询
WebGIS开发中,点击查询是最经常使用的一种查询方式,在ArcGIS api 中.这样的查询叫IdentifyTask,主要作用是前台提交參数.交ArcServer查询分析返回. 本文从开源框架的角 ...
- Geoserver+Openlayers拉框查询
1.代码 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" co ...
- postgresql+postgis+pgrouting实现最短路径查询(2)---openlayers+geoserver实现最短路径
自己的最短路径实现基本上是按照参考博文的1.2和3进行的,实现的时候也是问题不断,只能是一个一个解决. 问题1:自己发布的geoserver服务无法和OSM底图叠加到一起. 解决:参考博文2提到发布服 ...
- OpenLayers学习笔记5——使用jQuery UI实现查询并标注(UI篇)
近期事情非常多,老板给的压力也非常大.经常出差,另外项目和个人研究还都要跟上,本月要交论文,还要写专利,仅仅能抽时间来学习其它的东西了. 关于OpenLayers的在博客中不会写太多详细的实现(网上有 ...
- geoserver扫盲 openlayers相关
转自:http://www.cnblogs.com/lzlynn/archive/2008/07/29/1255702.html WMS: Web Map Service(Web地图服务 ) l 利 ...
- openlayers中单击获取要素
openlayers中单击获取要素 分类专栏: GIS 总结 OpenLayers 版权声明:本文为博主原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明. 本文链接: ...
- geoserver与OpenLayers配置
geoserver与OpenLayers配置 目录 1 准备工作.... 4 1.1 需要用到的程序和资料... 4 2 地图格式转换方式(一 ...
随机推荐
- gulp和webpack的区别
一.概念 gulp 构建工具 我们可以通过给gulp配置不通的task(通过Gulp中的gulp.task()方法配置,比如启动server.sass/less预编译.文件的合并压缩等等)来让gulp ...
- linux学习---ps、kill
一.ps 查看进程 ps 为我们提供了进程的一次性的查看,它所提供的查看结果并不动态连续的:如果想对进程时间监控,应该用 top 工具 linux上进程有5种状态: 1. 运行(正在运行或 ...
- Action的编写方式
四.Action 的编写方式 : 三种 第一种 创建普通类 不继承任何类,不实现任何接口 Public class HelloAction{ } 第二种 创建类,实现接口action Public ...
- OpenStack平台上,linux云主机可以使用xshell连接,但是无法xftp连接
笔者在OpenStack云平台上创建了CentOS6.6的云主机,用了一段时间后,发现xshell可以连接,但是xftp却连接不上. 于是进行伟大的百度操作,检查网络设置.ssh服务设置等,均正常,否 ...
- js 显示刚刚上传的图片 (onchange事件)
<table> <tr width="100"> <td>上传商场图片:</td> <td> <input typ ...
- django 数据库html显示
template {% autoescape off %} {% for each in obj %} <h2>{{ each.food }}</h2> <br/> ...
- Prometheus监控学习笔记之教程推荐
最近学习K8S和基于容器的监控,发现了如下的教程质量不错,记录下来以备参考 1. K8S最佳实战(包括了K8S的Prometheus监控和EFK日志搜集) https://jimmysong.io/k ...
- Git命令cherry-pick,选择把一部分代码提交到另一个分支
由于对git的使用还不是很熟悉,只是会基本的添加.提交.分支相关简单操作,在开发新需求的时候,需要涉及两个项目,一部分在新项目的新分支上开发的,另一部分是在老项目的老分支上开发的(这里忘了创建新分支) ...
- 02:MongoDB操作
1.1 MongoDB 增加 1.插入数据 1. 插入文档: insert 如果插入数据的时候,collection还不存在,自动创建集合 2. insertOne: 插入一条数据 3. insert ...
- Fedora 安装Docker
我使用的是yum安装, 下面提供我的yum源. name=Docker Repository baseurl=https://yum.dockerproject.org/repo/main/fedor ...