使用OpenLayers发布地图
OpenLayers是用于制作交互式Web地图的开源客户端JavaScript类库，制作的地图几乎可以在所有的浏览器中查看。因为是客户端类库，它不需要特殊的服务器端软件或配置，甚至不用下载任何东西就可以使用它。OpenLayers最初由Metacarta开发，现在它已经成为一个拥有众多开发者和帮助社区的成熟、流行的框架。
下载OpenLayers
OpenLayers的官方网址为：http://openlayers.org/
1.打开官网，可以看到目前OpenLayers的最新版本是2.12，直接点击.zip下载。
2.将下载的.zip文件解压到OpenLayers-2.12中。
3.打开OpenLayers-2.12文件夹，会看到很多的文件夹和文件，但是我们只关心一个文件：OpenLayers.js和两个文件夹：/img和/theme。
4.新建一个文件夹（我命名为code），将我们关心的文件和文件夹拷贝到新建的文件夹中，拷贝完后，新建的文件夹结构如下图：
创建第一个地图
1.在code文件夹中，新建一个index.html文件。
2.在index.html中，添加如下代码：
1: <!DOCTYPE html>
2: <html lang='zh-cn'>
3: <head>
4: <meta charset='utf-8' />
5: <title>My OpenLayers Map</title>
6: <script type='text/javascript' src='OpenLayers.js'></script>
7: <script type='text/javascript'>
8: var map;
9: function init() {
10: map = new OpenLayers.Map('map', {});
11: var wms = new OpenLayers.Layer.WMS(
12: 'OpenLayers WMS',
13: 'http://vmap0.tiles.osgeo.org/wms/vmap0',
14: {
15: layers: 'basic'
16: },
17: {}
18: );
19: map.addLayer(wms);
20: if (!map.getCenter()) {
21: map.zoomToMaxExtent();
22: }
23: }
24: </script>
25: </head>
26: <body onload='init();'>
27: <div id='map' style='width: 500px; height: 500px;'>
28: </div>
29: </body>
30: </html>
3.在浏览器中打开，会看到如下图所示的地图：
代码讲解
1.第5行，包含进来OpenLayers的库OpenLayers.js。
2.第27~28行，创建一个宽和高都为500px的div用来显示地图。
3.第8行，定义一个全局变量map。
4.第10行，从OpenLayers.Map类创建一个地图(map)对象， new OpenLayers.Map('map', {});中的‘map’是用于显示地图的div的id。
5.第11行，从Layer类的子类WMS创建一个层(layer)对象。注意：在OpenLayers中，每个地图至少有一个层。
6.第12行，传入的第一个参数，'OpenLayers WMS'是层的名称。
7.第13行，第二个参数，Url是WMS服务地址。
8.第14~16行，第三个参数，传入的是一个匿名对象。
9.第19行是将层加到地图上。
10.第20行是判断是否已经有中心点。
11.第21行是最大程度的显示地图。
----------------------------------------------------------------------------------------------------------------------------------------------------
以上是发布OpenStreetmap在线地图
如果已有离线的地图瓦片，离线瓦片可以从OpenStreetMap等地图网站下载，通过第三方开源库BruTIle可以下载
也可以通过第三方收费软件进行下载
然后配置Openlayers
参考：http://www.cnblogs.com/nianming/archive/2012/07/19/2600272.html
http://www.bigemap.com/home/help/one/id/106.html
使用OpenLayers发布地图的更多相关文章
- 使用GeoServer+OpenLayers发布和调用WMTS、Vector Tile矢量切片服务 | Publishing and Calling WMTS, Vector Tile Service Using GeoServer + OpenLayers
Web GIS系列: 1.搭建简易Web GIS网站:使用GeoServer+PostgreSQL+PostGIS+OpenLayers3 2.使用GeoServer+QGIS发布WMTS服务 3.使 ...
- 用OpenLayers开发地图应用
项目背景 最近有一个使用全球地图展示数据的项目,用地图展示数据本身没什么难度,但出于安全和保密的考虑,甲方单位要求项目不能连接外网,只能在内网使用,也就是说,我们不得不在内网中部署一个地图服务器,在这 ...
- geoserver发布地图服务
1. Geoserver启动 blog.csdn.net 2014-09-18 20:30 Geoserver是著名的开源GIS软件之一.也是项目中常用的地图服务软件.基于geoserver ...
- JavaWeb和WebGIS学习笔记（七）——MapGuide Open Source安装、配置以及MapGuide Maestro发布地图——超详细！目前最保姆级的MapGuide上手指南！
JavaWeb和WebGIS学习笔记(七)--MapGuide Open Source安装.配置以及MapGuide Maestro发布地图 超详细!目前最保姆级的MapGuide上手指南! 系列链接 ...
- JavaWeb和WebGIS学习笔记（六）——使用ArcGIS for Server发布地图服务
系列链接: Java web与web gis学习笔记(一)--Tomcat环境搭建 Java web与web gis学习笔记(二)--百度地图API调用 JavaWeb和WebGIS学习笔记(三)-- ...
- JavaWeb和WebGIS学习笔记（五）——使用OpenLayers显示地图
系列链接: Java web与web gis学习笔记(一)--Tomcat环境搭建 Java web与web gis学习笔记(二)--百度地图API调用 JavaWeb和WebGIS学习笔记(三)-- ...
- 利用 PortableBasemapServer 发布地图服务
前段时间需要给自己的C/S系统加一个地图,但是没有数据,于是就想到了使用网上的切片地图,但是C/S系统又不能联网,于是就想本地发布切片服务来使用. 本来想用ArcGIS Server来发布从网上下载的 ...
- 动态创建地图文档MXD并发布地图服务
原文:动态创建地图文档MXD并发布地图服务 1.动态创建MXD private bool CreateMxd(string MxdPath, string MxdName) { IMapDocumen ...
- ArcGIS发布地图服务
一般做完矢量图绘制工作后,生成的.mxd文件只能在ArcMap中查看,为了方便用户进行浏览,我们需要发布地图服务. 目前为止最常用的就是在ArcGIS中发布地图服务. 今天也算是在做“发布地图服务”的 ...
随机推荐
- ZT JAVA WeakReference
JAVA WeakReference 分类: JAVA 2012-08-28 16:08 305人阅读 评论(0) 收藏 举报 javareferencehashmapcacheclassnull 在 ...
- EventBus事件总线
EventBus事件总线的使用-自己实现事件总线 在C#中,我们可以在一个类中定义自己的事件,而其他的类可以订阅该事件,当某些事情发生时,可以通知到该类.这对于桌面应用或者独立的windows服务 ...
- java:transient是什么，有什么作用
参考博客:Java transient关键字 “Java的serialization提供了一种持久化对象实例的机制.当持久化对象时,可能有一个特殊的对象数据成员,我们不想用serialization机 ...
- 使用ViewPager实现Tab
一.效果演示及分析 我们直接看两幅图.如下: 上两幅图实现的效果就是: (1)手指左右滑动时,中间的布局呈现不同的效果.而且下面的按钮也会做相应的改变. (2)我们 ...
- BZOJ2440:[中山市选2011]完全平方数(莫比乌斯函数)
Description 小 X 自幼就很喜欢数.但奇怪的是,他十分讨厌完全平方数.他觉得这些数看起来很令人难受.由此,他也讨厌所有是完全平方数的正整数倍的数.然而这丝毫不影响他对其他数的热爱. 这天是 ...
- Dropdownlist控件属性 OnSelectedIndexChanged方法不触发
<asp:DropDownList ID="ddlWJLX" runat="server" OnSelectedIndexChanged="dd ...
- OC和C语言比较
说明:比较记忆相对来说更容易熟练记得牢固,理解了C语言相对来说OC也不太难,OC是C语言的扩展,向下兼容C语言. 源文件后缀名比较 1.C语言源文件 .h:头文件 .c:源文件 .o:目标文件 .ou ...
- python 爬虫简介以及使用方法
阶段大纲: 一. 爬虫 1. 基本操作 - 登录任意网站(伪造浏览器的任何行为) 2. 性能相关 - 并发方案: - 异步IO: gevent/Twisted/asyncio/aiohttp - 自定 ...
- SQL 二
1.执行DML语句的步骤:在数据库缓冲区缓存中搜索相关的块:将块从数据文件复制到缓冲区:将变更向量写入日志缓冲区:将变更向量应用于数据库缓冲区缓存.2.重做可以保护的段类型:索引段.表段.撤销段.3. ...
- es6 Set 和Map 数据结构
ES6提供了新的数据结构Set,它类似于数组,但是成员的值都是唯一的,没有重复的值. Set 本身是一个数据结构,用来生成Set 数据结构. const s = new Set(); [2,3,5,4 ...