Openlayers中layer介绍
1.base layers & overlay layers
base layer:最底层的layer，其它的图层是在他之上，最先增加的图层默认作为base layer.
overlay layer:不是base layer的layer就是overlay layer
2.使用layer的步骤：
- 创建layer
- 把layer加入到Map中，能够用map.addlayer(layer)或map.addLayers([layer1,layer2,.....]
3.例子：创建一个多图层的地图
<!DOCTYPE html>
<html lang='zh-cn'>
<head>
<meta charset='utf-8' />
<title>Base Layer Test</title>
<script type='text/javascript' src='OpenLayers.js'></script>
<script type='text/javascript'>
var map;
function init() {
map = new OpenLayers.Map('map_element',{});
var wmsLayerMap = new OpenLayers.Layer.WMS(
'Base layer',
'http://vmap0.tiles.osgeo.org/wms/vmap0',
{layers:'basic'},
{isBaseLayer:true}
);
var wmsLayersLabels = new OpenLayers.Layer.WMS(
'Location Labels',
'http://vmap0.tiles.osgeo.org/wms/vmap0',
{layers:'clabel,ctylabel,statelabel',
transparent:true},
{opacity:.5}
); map.addLayers([wmsLayerMap,wmsLayersLabels]); map.addControl(new OpenLayers.Control.LayerSwitcher({})); if(!map.getCenter())
{
map.zoomToMaxExtent();
}
} </script>
</head>
<body onload='init();'>
<div id='map_element' style='width:800; height: 600px;'>
</div>
</body>
</html>
执行代码。得到例如以下结果：
4.Layer.WMS类解析
首先看一下Layer.WMS类的參数：
| 參数 | 描写叙述 |
| name | {string},表示图层名称 |
| url | {string}，表示WMS的基地址 |
| params | {object},代表获取地图的查询字符串及參数取值 |
| options | {object},加入在图层上的其它选项的哈希表 |
Name參数：
Layer.WMS类的第一个參数，表示图层名称。string类型。图层名称要放在引用里面用以代表它是string类型。名称是自己随意取的。
假设在地图中加入了图层切换控件，图层名讳出如今该控件中。记住在引用之后有一个逗号。
URL參数：
代表网络地图服务的URL地址
Params參数：
是一个包括键：值对的匿名对象（object？）该參数指定服务端的设置，这些设置影响WMSserver返回的地图图像。当Openlayers向地图server发出请求时，这些键：值对将会附加到openlayers生成的URL地址之后。
可能的键：值对有：
layers:指定WMSserver须要返回的图层
transparent:为标注图层等图层请求透明的图片
srs:指定投影类型
Options:
包括clientOpenlaysers图层对象的属性，全部的图层都具有这些參数。主要有：isBaseLayer,opacity,visibility,因为图层属性是client的设置，因此WMSserver（或其它server）不知道这些參数。
5.配置图层參数演示样例i：
<!DOCTYPE html>
<html lang='zh-cn'>
<head>
<meta charset='utf-8' />
<title>Layer Test</title>
<script type='text/javascript' src='OpenLayers.js'></script>
<script type='text/javascript'>
var map;
function init() {
map = new OpenLayers.Map('map_element',{});
var wmsLayerMap = new OpenLayers.Layer.WMS(
'Base layer',
'http://vmap0.tiles.osgeo.org/wms/vmap0',
{layers:'basic'},
{isBaseLayer:true}
);
var wmsLayersLabels = new OpenLayers.Layer.WMS(
'Location Labels',
'http://vmap0.tiles.osgeo.org/wms/vmap0',
{layers:'clabel,ctylabel,statelabel',
transparent:true},
{visibility:false,opacity:.5}
);
var wmsStateLines = new OpenLayers.Layer.WMS(
'State Line Layer',
'http://labs.metacarta.com/wms/vmap0',
{layers:'stateboundary',
transparent:true},
{
minScale:13841995.078125}
);
wmsWaterDepth = new OpenLayers.Layer.WMS(
'Water Depth',
'http://labs.metacarta.com/wms/vmap0',
{layers:'depthcontour',
transparent:true},
{opacity:0.8}
);
wmsRoads = new OpenLayers.Layer.WMS(
'Roads',
'http://labs.metacarta.com/wms/vmap0',
{layers:'priroad,secroad,rail',
transparent:true},
{transistionEffect:'resize'}
);
map.addLayers([wmsLayerMap,wmsLayersLabels,wmsStateLines,wmsWaterDepth,wmsRoads]); map.addControl(new OpenLayers.Control.LayerSwitcher({})); if(!map.getCenter())
{
map.zoomToMaxExtent();
}
} </script>
</head>
<body onload='init();'>
<div id='map_element' style='width:800; height: 600px;'>
</div>
</body>
</html>
程序运行后的结果为：
Openlayers中layer介绍的更多相关文章
- OpenLayers中的Layer概念和实践--Openlayers调用WMS服务
整理转自:http://hi.baidu.com/lixuweiok/item/c406a4e6a6d390e7fa42ba4b 本章我认为是这本书的真正开端,终于开始讲一些有意思的东西了.. 在这一 ...
- OpenLayers中的图层
OpenLayers有多个不同的图层类,每一个都可以连接到不同的地图服务器.例如通过Layer.WMS类可以连接到WMS地图服务器,通过Layer.Google类可以连接到谷歌地图服务器.OpenLa ...
- OpenLayers中的图层（转载）
作者:田念明出处:http://www.cnblogs.com/nianming/本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法 ...
- openlayers中单击获取要素
openlayers中单击获取要素 分类专栏: GIS 总结 OpenLayers 版权声明:本文为博主原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明. 本文链接: ...
- POP动画引擎中Layer与CALayer的一点区别
POP动画引擎是facebook提供的一个开源框架, 可以实现很多的动画效果, 这里就不一一介绍啦, 有兴趣的童鞋请移步: https://github.com/facebook/pop 下面简单的讲 ...
- OpenLayers中的球面墨卡托投影
最近看OpenLayers,研究到地图投影时找到官方的文档,就翻译了一下,由于英文能力差,翻译不好的地方,请看原文 原文地址:http://docs.openlayers.org/library/sp ...
- OpenLayers中地图缩放级别的设置方法
来源于:http://www.cnblogs.com/sailheart/archive/2011/03/15/1984519.html 一.概述 在OpenLayers中,地图必须具有一个缩放级别的 ...
- [BIM]BIM中IDM介绍
参考:http://blog.fang.com/25866228/10613454/articledetail.htm IDM的全称是Information Delivery Manual,信息交付手 ...
- 关于js-binding中Layer触摸事件的优化
关于js-binding中Layer触摸事件的优化 cocos2d-x 3.7 1. 目前js中监听触摸事件带来的不便(特别是cocosbuilder) 在目前的js-binding中,如果要监听la ...
随机推荐
- animation总结
1. animation结束后停在最后一帧 animation-fill-mode : forwards | both; /* 或者 */ animation: anim1 1s linear for ...
- 【CCF】高速公路 tarjan强连通缩点
[题意] 给定一个有向图,问图中互相可达(强连通)的点有多少对 [AC] 强连通缩点,缩点后是一个DAG,所以互相可达的点只在强连通块里. #include<iostream> #incl ...
- 洛谷 [P1948] 电话线
二分答案 首先,最大值最小,就是二分答案 #include <iostream> #include <cstdio> #include <algorithm> #i ...
- 【HDOJ5974】A Simple Math Problem（构造，解方程）
题意:给定A与B,要求构造出一组X,Y,使得X+Y=A,lcm(X,Y)=B A<=2e4,B<=1e9 思路:A的范围较小,考虑以A为突破口 枚举A的约数k,复杂度O(sqrt(A)) ...
- 【Visual Studio】The project appears to be under source control, but the associated source control plug-in is not installed on this computer
[问题描述]用 Visual Studio 2013打开一个项目时,出现下面错误: [问题原因]参考 http://codeverge.com/asp.net.web-forms/the-projec ...
- 线程间通过PostMessage通信
1.查看TMS项目中的相关实例 ::PostMessage(hWnd, WM_USER_MSG_REFRESH_UI, (WPARAM)UMP_REFRESH_MEMBER_INFO, 0); 参考文 ...
- android 笔记（Service）
Service 一.Serivce的启动方式分两种 1.startService.用这种方式启动的话,负责启动这个service的Activity或者其他组件即使被销毁了,Service也会继续在后台 ...
- cookies-判断用户是否是第一次进入页面
在郑州美莱的活动项目中客户当时有提到该需求.尽管最后去掉了该需求,但是还是花了我不少时间研究,因为之前的项目我前端没有用到过cookies,吓死宝宝了 $(document).ready(functi ...
- css-通过css让块显示或隐藏
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Windows Phone 8 适应多屏分辨率
Windows Phone 8 比较 windows phone 7 来说有很多功能及性能上的提升例如支持多核 CUP.支持SD卡.多种分辨率. 显然WP7 WVGA - 480x800 的已经不能完 ...