设为首页 收藏本站
查看: 1219|回复: 0

[经验分享] 【转】基于GeoServer的电子地图系统说明(六):用OpenLayers实现WebGIS客户端

[复制链接]

尚未签到

发表于 2016-11-22 08:52:16 | 显示全部楼层 |阅读模式
八、用OpenLayers实现WebGIS客户端
8.1 OpenLayers简介

  登录http://www.openlayers.org,下载OpenLayers的压缩包。
  OpenLayers是一个用于开发WebGIS客户端的JavaScript包。OpenLayers实现访问地理空间数据的方法都符合行业标准。比如OpenGIS的WMS和WFS规范。OpenLayers采用面向对象方式开发,并使用来自Prototype.js和Rico中的一些组件。OpenLayers支持的地图来源包括了WMS,GoogleMap,KaMap,MSVirtualEarth等等,您也可以用简单的图片作为源,在这一方面OpenLayers提供了非常多的选择。
  从OpenLayers2.2版本以后,OpenLayers已经将所用到的Prototype.js组件整合到了自身当中,并不断在Prototype.js的基础上完善面向对象的开发,Rico用到地方不多,只是在OpenLayers.Popup.AnchoredBubble类中圆角化DIV。OpenLayers2.4版本以后提供了矢量画图功能,方便动态地展现“点、线和面”这样的地理数据。
  8.2 实例说明
  以创建一个index.html作为查看地图的页面为例。导入OpenLayers.js和你将要创建的js。内容需要一个div,我们给它的id起名叫做area。你有必要在写一些CSS限定#area的宽度和高度,如果乐意,加上一个border也是很不错的选择。

我们首先要创建一个OpenLayer.Map对象的实例:
var map = new OpenLayers.Map("area");
其中的参数可以传id,也可以传ElementObject,当然id更加方便一些。

接下来就是向地图中添加图层,通常情况下使用OpenLayers.Layer的子类来完成图层的初始化。
OpenLayers提供了一下Layers的扩展:

OpenLayers.Layer.Image
OpenLayers.Layer.HTTPRequest
OpenLayers.Layer.Grid
OpenLayers.Layer.WMS
OpenLayers.Layer.KaMap
OpenLayers.Layer.EventPane
OpenLayers.Layer.Google
OpenLayers.Layer.VirtualEarth
OpenLayers.Layer.Markers
OpenLayers.Layer.Text
OpenLayers.Layer.GeoRSS
OpenLayers.Layer.Boxes
OpenLayers.Layer.TMS

Image类封装一个实际图象作为图曾内容
HTTPRequest类可以接收一个动态生成的图片,你可以通过HTTPRequest类的参数向服务器发送参数
Grid类是HTTPRequest类的子类,提供更加详细的方法
WMS类用于连接WMS服务器以获得图象
KaMap类用于连接MapServer
EventPane类作为用于接收用户操作的图层
Google类用于从Google获得图象,它仍然需要你从Google获得API KEY,并且include
VirtualEarth类用于操作VirtualEarth的图层
Markers类用于生成接收和显示用户本地标记的图层
Text类用于接收CSV文件
GeoRSS类是Marker类的子类,用于封装接收GeoRSS并在图层中作出marker
Boxes同样也是Marker类的子类,可以用div来做marker,而非image
TMS用于接收TMS服务器的地图

创建完图层后,可以用Map的addLayer(layer)方法插入,并执行Map的zoomToMaxExtent()方法让地图合适地显示。

OpenLayers还提供了丰富的Control类为地图浏览添加一些工具,继承自OpenLayers.Control类

OpenLayers.Control.LayerSwitcher
OpenLayers.Control.MouseDefaults
OpenLayers.Control.MousePosition
OpenLayers.Control.MouseToolbar
OpenLayers.Control.OverviewMap
OpenLayers.Control.PanZoom
OpenLayers.Control.PanZoomBar
OpenLayers.Control.Permalink
OpenLayers.Control.Scale

这些类的实例会在地图浏览的“窗口”上增加一些工具栏或是“按钮”,增加互动性和功能性。

OpenLayers对常用的数据结构进行了封装
OpenLayers.LonLat
OpenLayers.Size
OpenLayers.Pixel
OpenLayers.Bounds
以便于操作。

此外OpenLayers.Util类可以对图片载入错误时图片框的颜色和图片框中默认的图片进行自定义,这一点是非常方便的。OpenLayers的Ajax类对创建XMLHttpRequest对象的过程进行了封装,可以使用它进行简单的Ajax操作。
九、附录
1. 相关概念
GIST
  http://man.iyunv.com/database/postgresql_8.0_CN/gist.html
  GiST 的意思是通用的搜索树(Generalized Search Tree)。 它是一种平衡的,树状结构的访问方法,在系统中起一个基础的模版,然后可以 使用它实现任意索引模式。B+-trees,R-trees 和许多其它的索引模式都可以用 GiST 实现。
  GiST 的一个优点是它允许一种客户化的数据类型和合适的 访问方法一起开发,并且是由该数据类型范畴里的专家,而不是数据库专家开发。
有些信息是从 加州大学伯克力分校的 GiST 项目网站 和 Marcel Kornacker 的论文,Access Methods for Next-Generation Database Systems 中派生的。
  PostgreSQL 里的 GiST 实现目前主要是 Teodor Sigae 和 Oleg Bartunov 维护的, 在他们的网站上有更多信息:http://www.sai.msu.su/~megera/postgres/gist/。
R-TREE
        R-tree 索引用于索引空间数据。一个哈希索引无法处理范围搜索。而 B-tree 索引只能处理一维的范围搜索。R-tree 索引可以处理多维数据。例如,如果可以在一个类型为 point 的字段上建立一个 R-tree 索引,那么系统在回答类似 select all points within a bounding rectangle (选择在一个长方形范围内的所有点)这样的查询时有更高的效率。
  建立 R-Trees 可以处理多边形和方形。理论上说,R-trees 可以扩展为处理更多维数。不过在实践上,扩展R-trees 需要一定的工作量。
WKB
Well Known Binary 一种GIS数据的二进制存储方式。
WKT
Well Known Text
reprojection
重投影
SPATIAL_REF_SYS Table
空间参考系统表格(SPATIAL_REF_SYS)用来储存空间参考系统资讯,表格结构如下:其中SRID为空间参考系统代码,AUTH_NAME为空间参考系统之坐标名称,AUTH_SRID为空间参考系统之坐标名称代码,SRTEXT为空间参考系统之WKT(Well-known Text)文字方式格式。空间参考系统之WKT资料结构包括空间。
coordinates
坐标系
features
几何元素
SRID
spatial referencing system identifier空间参考系统标示符。
populates        
填充
schema   
大纲
meta-data      
元数据


2. 相关网站和讨论组
  OGC官方网站:http://www.opengis.org
  PostgreSQL官方网站:http://www.postgresql.org
  uDig官方网站:http://udig.refractions.net
  GeoServer官方网站:http://www.geoserver.org
  OpenLayers官方网站:http://www.openlayers.org
  GeoTools官方网站:http://www.geotools.org

  GeoServer QQ群:4825849

运维网声明 1、欢迎大家加入本站运维交流群:群②:261659950 群⑤:202807635 群⑦870801961 群⑧679858003
2、本站所有主题由该帖子作者发表,该帖子作者与运维网享有帖子相关版权
3、所有作品的著作权均归原作者享有,请您和我们一样尊重他人的著作权等合法权益。如果您对作品感到满意,请购买正版
4、禁止制作、复制、发布和传播具有反动、淫秽、色情、暴力、凶杀等内容的信息,一经发现立即删除。若您因此触犯法律,一切后果自负,我们对此不承担任何责任
5、所有资源均系网友上传或者通过网络收集,我们仅提供一个展示、介绍、观摩学习的平台,我们不对其内容的准确性、可靠性、正当性、安全性、合法性等负责,亦不承担任何法律责任
6、所有作品仅供您个人学习、研究或欣赏,不得用于商业或者其他用途,否则,一切后果均由您自己承担,我们对此不承担任何法律责任
7、如涉及侵犯版权等问题,请您及时通知我们,我们将立即采取措施予以解决
8、联系人Email:admin@iyunv.com 网址:www.yunweiku.com

所有资源均系网友上传或者通过网络收集,我们仅提供一个展示、介绍、观摩学习的平台,我们不对其承担任何法律责任,如涉及侵犯版权等问题,请您及时通知我们,我们将立即处理,联系人Email:kefu@iyunv.com,QQ:1061981298 本贴地址:https://www.yunweiku.com/thread-303768-1-1.html 上篇帖子: 【翻译】编写第一个Django app,第二部分——创建模型和使用模型 下篇帖子: DBUnit入门
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

扫码加入运维网微信交流群X

扫码加入运维网微信交流群

扫描二维码加入运维网微信交流群,最新一手资源尽在官方微信交流群!快快加入我们吧...

扫描微信二维码查看详情

客服E-mail:kefu@iyunv.com 客服QQ:1061981298


QQ群⑦:运维网交流群⑦ QQ群⑧:运维网交流群⑧ k8s群:运维网kubernetes交流群


提醒:禁止发布任何违反国家法律、法规的言论与图片等内容;本站内容均来自个人观点与网络等信息,非本站认同之观点.


本站大部分资源是网友从网上搜集分享而来,其版权均归原作者及其网站所有,我们尊重他人的合法权益,如有内容侵犯您的合法权益,请及时与我们联系进行核实删除!



合作伙伴: 青云cloud

快速回复 返回顶部 返回列表