2017-04-02 62 views
1

我已经设置了MapServer WMS服务的图层。现在我正在尝试使用OpenLayers库编写一个简单的WMS客户端。一般来说,我有一些结果,但有一些问题。有些点比其他点小。我尝试使用QGIS和Leaflet库连接到我的WMS服务。结果是完美的! OpenLayers lib有一些麻烦。这个例子有什么问题?OpenLayers库呈现MapServer WMS图层出错

客户端:

  • 的OpenLayers V4.0.1
  • 视窗7 X64的SP1
  • 铬57.0.2987.133 [Mozilla的/ 5.0(Windows NT的6.1; WOW64)为AppleWebKit/537.36(KHTML,像壁虎)铬/ 57.0.2987.133 Safari浏览器/ 537.36]
  • IE 11.0.9600 [Mozilla的/ 5.0(Windows NT的6.1; WOW64;三叉戟/ 7.0; RV:11.0)等壁虎]
  • 火狐51.0.1 [Mozilla的/ 5.0(Windows NT 6.1; WOW64; rv:51.0)Geck O/20100101火狐/ 51.0]

服务器端:

  • ms4w 3.1.4

活生生的例子:http://vector-sol.ru/apps/ol.html
下载ZIP与形状文件,HTML页面和配置映射文件:http://map31.ru:8080/example.zip

html页面:

<!doctype html> 
<html lang="ru"> 
    <head> 
    <link rel="stylesheet" href="https://openlayers.org/en/v4.0.1/css/ol.css" type="text/css"> 
    <style> 
    html, body { 
     margin: 0; 
     padding: 0; 
     height:100%; 
    } 
    #info { 
     position:absolute; 
     z-index:10; 
     background-color:yellow; 
     right: 0; 
    } 
    #map { 
     height:100%; 
    } 
    </style> 
    <script src="https://openlayers.org/en/v4.0.1/build/ol.js" type="text/javascript"></script> 
    <title>OpenLayers example</title> 
    </head> 
    <body> 
    <div id="map" class="map"> 
     <div id="info">OpenLayers example</div> 
    </div> 
    <script type="text/javascript"> 
     var map = new ol.Map({ 
     target: 'map', 
     layers: [ 
      new ol.layer.Tile({ 
      source: new ol.source.OSM() 
      }), 
      new ol.layer.Tile({ 
       source: new ol.source.TileWMS(({ 
        projection: 'EPSG:4326', 
        url: 'http://map31.ru:8080/cgi-bin/mapserv.exe?map=../htdocs/mydemo/wms_ol.map', 
        params: { 'LAYERS': 'pop_places', 'TILED': true }, 
        serverType: 'mapserver' 
       })) 
      })   
     ], 
     view: new ol.View({ 
      center: ol.proj.fromLonLat([37.41, 8.82]), 
      zoom: 4 
     }) 
     }); 
    </script> 
    </body> 
</html> 

MAP文件:

MAP 

    NAME "WMS" 
    IMAGETYPE  PNG 
    EXTENT -180 -90 180 90 # Geographic 
    SIZE 800 400 
    IMAGECOLOR 220 221 239 

    SYMBOL 
    NAME 'circle' 
    TYPE ELLIPSE 
    POINTS 1 1 END 
    FILLED TRUE 
    END 

    WEB 
    METADATA 
     wms_title     "WMS Demo" 
     wms_abstract    "Demo WMS Server" 
     wms_onlineresource   "http://map31.ru:8080/cgi-bin/mapserv.exe?map=../htdocs/mydemo/wms_ol.map&" 
     wms_srs     "EPSG:4326" 
     wms_getfeatureinfo   "http://map31.ru:8080/cgi-bin/mapserv.exe?map=../htdocs/mydemo/wms_ol.map&" 
     wms_featureinfoformat  "text/plain" 
     wms_enable_request   "*" 
    END 
    END 

    PROJECTION 
    "init=epsg:4326" 
    END 

    LAYER 
     NAME "pop_places" 
     TYPE POINT 
     STATUS ON 
     DATA 'shape/ne_10m_populated_places.shp' 
     PROJECTION 
     "init=epsg:4326" 
     END 
     CLASS 
     NAME "Pop Places" 
     STYLE 
      COLOR 10 100 50 
      SYMBOL 'circle' 
      SIZE 6   
     END 
     END 

     METADATA 
     wms_title "Populated Places" 
     wms_abstract "Populated places of the world" 
     wms_srs "EPSG:4326" 
     wms_include_items "all" 
     wms_enable_request "*" 
     #wms_extent "-180 -90 180 90" 
     END  

    END # layer 

END 

回答

0

projection: 'EPSG:4326'设置触发客户端光栅重投影,因为默认视图投影是'EPSG:3857'。您可能想要在该投影中使您的地图工作,只需从ol.source.TileWMS配置中删除projection: 'EPSG:4326'行。

+0

非常感谢!但我必须将我的WMS服务器输出投影更改为'EPSG:3857'。在这一步移除投影之后:'EPSG:4326'线产生了影响。所以,这是服务器端解决方案。但是,OpenLayers再投影有什么问题? – bestjack

+0

它没有错。但在EPSG:4326和EPSG:3857之间重新投影时,目标分辨率随纬度而变化。否则,你会看到模糊的图像。 – ahocevar

+0

或者您可以将'wms_srs“EPSG:4326”'更改为'wms_srs“EPSG:4326 EPSG:3857”'以获得服务器端重新投影 – user27874