关于OpenLayers的资料，网上已经有很多例子了。我这里想说的是如何高效的使用OpenLayers。我们在访问WMS的时候，一般不会只请求一个图层，有可能会是很多图层。
我刚开始使用OpenLayers的时候，是这样使用的：
view plaincopy to clipboardprint?
<script type="text/javascript">
var map, layer;
function init(){
map = new OpenLayers.Map( 'map' );
map.addControl(new OpenLayers.Control.LayerSwitcher());
var bounds = new OpenLayers.Bounds(103.94971885,30.5749127,104.18353815,30.7504793);
layerblock = new OpenLayers.Layer.WMS( "topp:Block_region",
"http://localhost:8989/geoserver/wms" ,
{
layers: 'topp:Block_region',
srs: 'EPSG:4326',
style: '',
format: 'image/png',
tiled: 'true'
//transparent: false
},
{
maxExtent: bounds,
//maxResolution: 0.0041261434555042165,
projection: 'EPSG:4326',
buffer: 0 ,
reproject: true,
//opacity: 0.8,
isBaseLayer: true
}
);
layerpublic = new OpenLayers.Layer.WMS( "topp:PUBLIC_region",
"http://localhost:8989/geoserver/wms" ,
{
layers: 'topp:PUBLIC_region',
srs: 'EPSG:4326',
style: '',
//format: 'image/png',
tiled: 'true',
transparent: true
},
{
maxExtent: bounds,
//maxResolution: 0.0041261434555042165,
projection: 'EPSG:4326',
buffer: 0 ,
reproject: true,
//opacity: 0.8,
isBaseLayer: true
}
);
layerroad = new OpenLayers.Layer.WMS( "topp:Road_Regular_polyline",
"http://localhost:8989/geoserver/wms" ,
{
layers: 'topp:Road_Regular_polyline',
srs: 'EPSG:4326',
style: '',
//format: 'image/png',
tiled: 'true',
transparent: true
},
{
maxExtent: bounds,
//maxResolution: 0.0041261434555042165,
projection: 'EPSG:4326',
buffer: 0 ,
reproject: true,
//opacity: 0.8,
isBaseLayer: true
}
);
map.addLayers([layerblock,layerpublic,layerroad]);
map.zoomToExtent(bounds);
}
</script>
<script type="text/javascript">
var map, layer;
function init(){
map = new OpenLayers.Map( 'map' );
map.addControl(new OpenLayers.Control.LayerSwitcher());
var bounds = new OpenLayers.Bounds(103.94971885,30.5749127,104.18353815,30.7504793);
layerblock = new OpenLayers.Layer.WMS( "topp:Block_region",
"http://localhost:8989/geoserver/wms" ,
{
layers: 'topp:Block_region',
srs: 'EPSG:4326',
style: '',
format: 'image/png',
tiled: 'true'
//transparent: false
},
{
maxExtent: bounds,
//maxResolution: 0.0041261434555042165,
projection: 'EPSG:4326',
buffer: 0 ,
reproject: true,
//opacity: 0.8,
isBaseLayer: true
}
);
layerpublic = new OpenLayers.Layer.WMS( "topp:PUBLIC_region",
"http://localhost:8989/geoserver/wms" ,
{
layers: 'topp:PUBLIC_region',
srs: 'EPSG:4326',
style: '',
//format: 'image/png',
tiled: 'true',
transparent: true
},
{
maxExtent: bounds,
//maxResolution: 0.0041261434555042165,
projection: 'EPSG:4326',
buffer: 0 ,
reproject: true,
//opacity: 0.8,
isBaseLayer: true
}
);
layerroad = new OpenLayers.Layer.WMS( "topp:Road_Regular_polyline",
"http://localhost:8989/geoserver/wms" ,
{
layers: 'topp:Road_Regular_polyline',
srs: 'EPSG:4326',
style: '',
//format: 'image/png',
tiled: 'true',
transparent: true
},
{
maxExtent: bounds,
//maxResolution: 0.0041261434555042165,
projection: 'EPSG:4326',
buffer: 0 ,
reproject: true,
//opacity: 0.8,
isBaseLayer: true
}
);
map.addLayers([layerblock,layerpublic,layerroad]);
map.zoomToExtent(bounds);
}
</script>view plaincopy to clipboardprint?
<FONT face=Arial>但是，我发现这样访问的速度极其的慢。然后，又把这个例子改造成以下的样子，发现，速度提高很多。</FONT>
但是，我发现这样访问的速度极其的慢。然后，又把这个例子改造成以下的样子，发现，速度提高很多。view plaincopy to clipboardprint?
<FONT face=Arial><PRE class=jscript name="code"><script type="text/javascript">
var map, layer;
function init(){
map = new OpenLayers.Map( 'map' );
map.addControl(new OpenLayers.Control.LayerSwitcher());
var bounds = new OpenLayers.Bounds(103.94971885,30.5749127,104.18353815,30.7504793);
layerpublic = new OpenLayers.Layer.WMS( "region",
"http://localhost:8989/geoserver/wms" ,
{
layers: 'topp:Block_region,topp:PUBLIC_region,topp:Road_Regular_polyline',
srs: 'EPSG:4326',
style: '',
format: 'image/png',
tiled: 'false',
transparent: false
},
{
maxExtent: bounds,
//maxResolution: 0.0041261434555042165,
projection: 'EPSG:4326',
buffer: 0,
reproject: true,
//opacity: 0.5,
isBaseLayer: true
}
);
map.addLayer(layerpublic);
map.zoomToExtent(bounds);
}
</script></PRE>
</FONT>
view plaincopy to clipboardprint?<script type="text/javascript"> var map, layer; function init(){ map = new OpenLayers.Map( 'map' ); map.addControl(new OpenLayers.Control.LayerSwitcher()); var bounds = new OpenLayers.Bounds(103.94971885,30.5749127,104.18353815,30.7504793); layerpublic = new OpenLayers.Layer.WMS( "region", "http://localhost:8989/geoserver/wms" , { layers: 'topp:Block_region,topp:PUBLIC_region,topp:Road_Regular_polyline', srs: 'EPSG:4326', style: '', format: 'image/png', tiled: 'false', transparent: false }, { maxExtent: bounds, //maxResolution: 0.0041261434555042165, projection: 'EPSG:4326', buffer: 0, reproject: true, //opacity: 0.5, isBaseLayer: true } ); map.addLayer(layerpublic); map.zoomToExtent(bounds); } </script> <script type="text/javascript">
var map, layer;
function init(){
map = new OpenLayers.Map( 'map' );
map.addControl(new OpenLayers.Control.LayerSwitcher());
var bounds = new OpenLayers.Bounds(103.94971885,30.5749127,104.18353815,30.7504793);
layerpublic = new OpenLayers.Layer.WMS( "region",
"http://localhost:8989/geoserver/wms" ,
{
layers: 'topp:Block_region,topp:PUBLIC_region,topp:Road_Regular_polyline',
srs: 'EPSG:4326',
style: '',
format: 'image/png',
tiled: 'false',
transparent: false
},
{
maxExtent: bounds,
//maxResolution: 0.0041261434555042165,
projection: 'EPSG:4326',
buffer: 0,
reproject: true,
//opacity: 0.5,
isBaseLayer: true
}
);
map.addLayer(layerpublic);
map.zoomToExtent(bounds);
}
</script>
view plaincopy to clipboardprint?
<FONT face=Arial>这样看，就明白了，最上面的是请求了三个WMS服务，下面的只请求了一个WMS服务。
</FONT>
这样看，就明白了，最上面的是请求了三个WMS服务，下面的只请求了一个WMS服务。
view plaincopy to clipboardprint?
<PRE class=jscript name="code"> </PRE>
本文来自CSDN博客，转载请标明出处：http://blog.csdn.net/mach365/archive/2008/07/09/2627750.aspx
分享到：
相关推荐
提供openlayers加载WMS服务的完整示例
openlayers加载arcgis发布的OGC WMS服务。。。。。。。。。
OpenLayer 3加载wms示例，包括几个常用事件和动画的使用。
花费了很久整理的ol2的代码直接可用附带3级切片
openlayers 调用 arcgis server wms服务简单图解 java net
openlayers的类与方法.doc OpenLayers技术研究参考文档...Openlayers加载wms.doc openlayers介绍.ppt openlayers开发.doc OpenLayers心得文档.doc openlayers资料1.doc OpenLayer源代码总体结构分析.doc OpenLayers.pdf
openLayers链接WMS的代码探讨 37 openlayers 2.5 矢量层在ie下闪烁的问题 38 openLayers 在地图上添加一个点并保存 39 openLayers 各个参数的意义 42 geoserver能搞出这种风格的图来吗？ 43 关于SLD的线切割后的设置...
ol(openlayers)加载天地图/加载中xyz格式瓦片/加载Geoserver发布的WMS图层， 可以一次性加载多个图层： /** * 添加离线图层(数组) * @param {Array} optsArray 选项 * @example * var opts = [{ * url: "ol....
主要为大家详细介绍了OpenLayers3加载常用控件的使用方法，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
OpenLayers 支持Open GIS 协会制定的WMS（Web Mapping Service）和WFS（Web Feature Service）等网络服务规范，可以通过远程服务的方式，将以OGC 服务形式发布的地图数据加载到基于浏览器的OpenLayers 客户端中进行...
除此之外，OpenLayers 支持Open GIS 协会制定的WMS（Web Mapping Service）和WFS（Web Feature Service）等网络服务规范，可以通过远程服务的方式，将以OGC 服务形式发布的地图数据加载到基于浏览器的OpenLayers ...
本PPT是中科院老师讲解如何使用OpenLayers开发WEBGIS客户端，本文从OpenLayers的概念出发，一步一步讲述怎样搭建OpenLayers开发环境，并通过详细的代码讲述编写OL3程序，加载地图图层等
WebGIS WebGIS homework 采用开发技术： Geoserver OpenLayers ExtJS 功能： 1)加载OSM底图、WMS图层，WFS图层 2)地图浏览 3)WFS-T实线增删查改 4)ExtJS实现查询结果显示
OpenLayers 支持Open GIS 协会制定的WMS（Web Mapping Service）和WFS（Web Feature Service）等网络服务规范，可以通过远程服务的方式，将以OGC 服务形式发布的地图数据加载到基于浏览器的OpenLayers 客户端中进行...
OpenLayers 支持Open GIS 协会制定的WMS（Web Mapping Service）和WFS（Web Feature Service）等网络服务规范，可以通过远程服务的方式，将以OGC 服务形式发布的地图数据加载到基于浏览器的OpenLayers 客户端中进行...
许多组件都可以配置为指向您自己的WMS / WFS，XYZ服务。 某些组件使用自定义的rest api，例如搜索和属性报告。 它是使用框架构建的，可以使用提供的模板轻松创建自己的工具和主题（下面的说明）。 使用src文件夹根...
OpenLayers：OpenLayers给不同的地图图层文件提供一些公共接口，比如Google,WMS.它运用了地图渲染工具等其他的一些地图处理工具。协议：BSD。 Sarissa： 它是一个基于ECMAScript库的xml API，它主要提供不同的XML...
OpenLayers：OpenLayers给不同的地图图层文件提供一些公共接口，比如Google,WMS.它运用了地图渲染工具等其他的一些地图处理工具。协议：BSD。 Sarissa： 它是一个基于ECMAScript库的xml API，它主要提供不同的XML...
它支持连接到许多常见的服务器和格式，例如ArcGIS，Geoserver（和其他OGC WMS / WFS服务），XYZ，TMS，KML，GeoJSON，Shapefiles，CSV等！ 其他功能包括栅格和矢量数据的动画，各种格式的导入和导出，会话之间保存...