Openlayers2切換supermap WMS服務底圖，已解決

JackChenKing發表於2017-09-04

   話不多說上程式碼，，，


   
 <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 onload="init()">  
    <div id="test_map" style="width: 100%;  
    height: 100%;">  
    </div>  
    </body>  
       
    </html>

效果

   



今天就不發了，睡覺覺。。。凌晨了也挺晚的，熬夜傷身。


相關文章