mapserver+openlayers实现左键点击查询

效果图
第一步,配置自己的mapfile,在要查询的图层LAYER对象内加上HEADER,TEMPLATE,FOOTER三个参数,同时,TEMPLATE fooOnlyForWMSGetFeatureInfo前加#屏蔽(切记)。
我的一个例子
LAYER
NAME 'Basin'
TYPE POLYGON
DUMP true
HEADER "header.html"
TEMPLATE "content_ChinaData.html"
FOOTER "footer.html"
#TEMPLATE fooOnlyForWMSGetFeatureInfo
EXTENT 72.159645 12.440230 136.365480 59.396737
DATA 'C:\ms4w\Apache\htdocs\DATA\ChinaData.shp'
METADATA
'ows_title' 'ChinaData'
'ows_srs' 'EPSG:4326'
"gml_include_items" "all"
"gml_featureid" "id" #必须指定id
'queryable' 'true'
END
STATUS OFF
TRANSPARENCY 100
PROJECTION
'proj=longlat'
'datum=WGS84'
'no_defs'
END
CLASS
NAME 'ChinaData'
STYLE
WIDTH 1
OUTLINECOLOR 0 0 0
COLOR 255 255 255
END
END
END
2、配置"header.html"、"content_Basin.html"、"footer.html"三个文件,这三个文件各自不是一个完整的网页,组合在一起才是,如果要查询的图层不止一个
可以多做几个"content_Basin.html"的网页,但是"header.html"、"footer.html"各自只要一个就行了,每个网页第一句是<!-- MapServer Template -->(必须的)
我的实例
header.html
<!-- MapServer Template -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "
http://www.w3.org/TR/html4/transitional.dtd"> <html> <head> <!-- enforce the client to display result html as UTF-8 encoding -->
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"></meta>
<title>GetFeatureInfo Response</title>
<style type="text/css">
table.featureInfo, table.featureInfo td, table.featureInfo th {
border:1px solid #ddd;
border-collapse:collapse;
margin:0;
padding:0;
font-size: 90%;
padding:.4em .4em;
}
table.featureInfo th {
padding:.2em .2em;
font-weight:bold;
background:#eee;
}
table.featureInfo td{
background:#fff;
}
table.featureInfo tr.odd td{
background:#eee;
}
table.featureInfo caption{
text-align:left;
font-size:100%;
font-weight:bold;
padding:.2em .2em;
}
</style>
</head> <body>
<table class="featureInfo">
content_Basin.html
<!-- MapServer Template -->
<caption class="featureInfo">图层:盆地</caption> <tbody>
<th>名称</th>
<th>面积</th>
<tr >
<td >[item name="Name" format=$value escape=none]</td>
<td>[item name="Area" precision="1" format=$value escape=none]</td> </tr>
footer.html
<!-- MapServer Template --> </tbody> </table> <br/> </body> </html>
3、点击功能的实现
在代码中加入
info = new OpenLayers.Control.WMSGetFeatureInfo({
url: 'http://127.0.0.1/cgi-bin/mapserv.exe?',
title: 'Identify features by clicking',
queryVisible: true,
infoFormat:'text/html',///nimeide
queryVisible:true,
layers:[Basint,AreaOfReserch,Oilfield],
eventListeners: {
getfeatureinfo: function(event) {
map.addPopup(new OpenLayers.Popup.FramedCloud(
"chicken",
map.getLonLatFromPixel(event.xy),
null,
event.text,
null,
true
));
}
}
});
map.addControl(info);
info.activate();
mapserver+openlayers实现左键点击查询的更多相关文章
- html js 捕捉鼠标右键事件,按下滚轮事件,左键点击事件
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...
- 解决Eclipse左键无法查看maven第三方包的源代码,多图亲测可用【转】
Debug进不了的原因及解决办法: 一.ctrl+左键点击没有找到你的源码 1.先设置maven 2.通过maven下Jar包源码 选中总包目录下的pom.xml-->右键-->Run A ...
- Python3 tkinter基础 Frame event.x 输出鼠标左右键点击的位置
Python : 3.7.0 OS : Ubuntu 18.04.1 LTS IDE : PyCharm 2018.2.4 Conda ...
- Swing中如何比较好的判断鼠标左键双击
import java.awt.Toolkit; import java.awt.event.ActionEvent; import java.awt.event.ActionListener; im ...
- 左键双击关闭pagecontrol中的一个分页即一个tabsheet,功能像遨游浏览器一样
左键双击关闭pagecontrol中的一个分页即一个tabsheet,功能像遨游浏览器一样 procedure TfrmServerSetup.PageControl1MouseDown(Sender ...
- WPF移动Window窗体(鼠标点击左键移动窗体自定义行为)
XAML代码部分:1.引用System.Windows.Interactivity 2.为指定的控件添加一个拖动的行为 3.很简单的了解行为的作用和用法 <Window xmlns=" ...
- 建立CMenu菜单项,实现选中菜单项点击左键响应事件
这里我只是根据自己的项目做了一些总结,实现点击右键弹出菜单项,点左键选择菜单项: CMenu menu; VERIFY(menu.CreatePopupMenu());//新建一个cmenu菜单项 m ...
- Winform 基础二 最小化 最大化 关闭 点击任务栏隐藏显示 点击鼠标左键移动窗体
一 最大化 二 最小化 三 关闭 四 点击任务栏隐藏显示 五 点击鼠标左键移动窗体 六 阴影效果鼠标左键移动窗口 #region UI设置 最大化.最小化.关闭.鼠标移动窗口.点击任务栏切换窗口 th ...
- OpenLayers 3+Geoserver+PostGIS实现点击查询
WebGIS开发中,点击查询是最经常使用的一种查询方式,在ArcGIS api 中.这样的查询叫IdentifyTask,主要作用是前台提交參数.交ArcServer查询分析返回. 本文从开源框架的角 ...
随机推荐
- 【BZOJ4458】GTY的OJ(树上超级钢琴)
点此看题面 大致题意: 给你一棵树,让你求出每一个节点向上的长度在\([l,r]\)范围内的路径权值和最大的\(m\)条路径的权值总和. 关于此题的数列版本 此题的数列版本,就是比较著名的[BZOJ2 ...
- git 修改commit 的注释
git 修改commit 的注释 一:最新的一次提交 当你不小心,写错了提交的注视/信息,该如何处理呢.理论上,SCM是不应该修改历史的信息的,提交的注释也是. 不过在git中,其commit提 ...
- 《javascript 学习笔记》
注释 1. // This is an in-line comment. 2. /* This is a multi-line comment */ 七种data types(数据类型) undef ...
- es6中的promise解读
目录 什么是promise? promise的优点 回调地狱问题 Promise的三种状态 一个简单的promise promise中的then 利用promise解决回调地狱 promise的链式 ...
- 【NTT】bzoj3992: [SDOI2015]序列统计
板子题都差点不会了 Description 小C有一个集合S,里面的元素都是小于M的非负整数.他用程序编写了一个数列生成器,可以生成一个长度为N的数 列,数列中的每个数都属于集合S.小C用这个生成器生 ...
- 爬虫学习(三)——get请求参数解析
get请求: 用户输入搜索的内容,发送请求,将请求的内容保存起来. get请求的本质是在地址栏中输入参数进行的一种请求方式. 解析参数使用urllib.parse impo ...
- 02 python网络爬虫《Http和Https协议》
一.HTTP协议 1.概念: Http协议就是服务器(Server)和客户端(Client)之间进行数据交互(相互传输数据)的一种形式. 之间形成的特殊行话(黑话:(土匪)天王盖地虎,(我)宝塔镇河妖 ...
- Python周末21天笔记
模块一: 基础相互据类型之间的相互转换 1. 字符串str 与 列表 list 与字典 dict 以及 元祖tuple的转换 例一: 把字典的key和value的值取出来,按照顺序存入到list中 d ...
- 模块numpy的用法
https://blog.csdn.net/qq351469076/article/details/78817378 机器学习三剑客之Numpy: https://www.jianshu.com/p/ ...
- mysql不能登陆
前些天还正常运行的mysql,不知怎么就不能登陆了.错误提示为 :ERROR 2003 (HY000): Can't connect to MySQL server on 'localhost' (1 ...