openlayers加载WMS
关于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
转载自：https://blog.csdn.net/xujunPro/article/details/83649084
