Openlayers2切换supermap WMS服务底图，已解决

最新推荐文章于 2024-08-13 08:54:47 发布

八年程序员下岗落魄一年

最新推荐文章于 2024-08-13 08:54:47 发布

阅读量1.8k

点赞数 1

文章标签： openlayer2

本文链接：https://blog.csdn.net/u012374381/article/details/77829019

版权

话不多说上代码，，，

 <html>  
     <head>  
    <title>  
    电子海图的图层切换控件  
    </title>  
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">  
    <!-- 加载OpenLayers 类库 -->  
    <script type="text/javascript" src="http://www.openlayers.cn/olapi/OpenLayers.js">  
    </script>  
    <style>  
    html, body { width: 100%; height: 100%; margin: 0; padding: 0; }  
    </style>  
      
    <script type="text/javascript">  
    function init() {  
    // 使用指定的文档元素创建地图  
    var map = new OpenLayers.Map("test_map");  
    // 创建一个 OpenStreeMap raster layer  
    var osm = new OpenLayers.Layer.OSM();  
    //创建一个WMS图层  
    var wms_layer = new OpenLayers.Layer.WMS(  
      'WMS Layer Title',  
      'http://116.117.157.170:8085/iserver/services/map-ordosMap/wms111/ordosMap',  
      {layers: 'ordosMap'},  
      {}  
    );  
     var wms_layer1 = new OpenLayers.Layer.WMS(  
      'WMS Layer Title1',  
      'http://116.117.157.170:8085/iserver/services/map-eeds10m/wms111/eeds',  
      {layers: 'eeds'},  
      {}  
    );
    //添加图层切换控件  
    var switch_ctrl=new OpenLayers.Control.LayerSwitcher({});  
    map.addControl(switch_ctrl);  
      
    map.addLayers([wms_layer1,wms_layer]);  
    map.setCenter([109.797986,39.628674],17);  
    map.setZoom(10);
    // 设定视图缩放地图程度为最大  
    map.zoomToMaxExtent();  
    }  
    </script>  
    </head>  
       
    <body οnlοad="init()">  
    <div id="test_map" style="width: 100%;  
    height: 100%;">  
    </div>  
    </body>  
       
    </html>

效果