• Openlayers Projection导致经纬度颠倒问题


    问题:

    openlayers3调用TileWMS接口,实现Openlayers加载Geoserver转发的ArcGIS切片时,web墨卡托(wkid3857)没有问题,但是WGS84(wkid4326)就不行。

    问题排查:

    1、查看控制台,发现报错400,这个是由于格式错误引起的

    2、于是我把链接复制出来粘贴到浏览器观察,发现是BBOX的经纬度反了。

    &BBOX=39.387925644409165%2C115.94328881619128%2C39.99706766190172%2C116.55243083368384

    变成了BBOX=纬度&经度&纬度&经度了

    3、我把BBOX修正,再放到浏览器打开,发现可以正常加载。看来问题找到了,就是构造的时候bbox的问题,可这是怎么造成的呢?

    4、网上都没找到原因,实在不行了决定咬咬牙跟源码吧。

    5、源码跟到这里发现了问题:获取坐标系的坐标轴顺序,如果是"ne"就把bbox构造经纬度反一反。为啥呢?

    6、原来openlayers在操作地图时,如果用到坐标系的,则会根据坐标系先判断一下坐标顺序,WGS84默认顺序是(纬度,经度,高度),web墨卡托默认是(x,y,z)

    7、我们用的EPSG:4326的坐标系,顺序是neu,源码中被if条件捕获,bbox被转了

    解决方案:

    1、最终找到问题,就要把他消灭,我们用openlayers自定义坐标系的方法,重写一下"EPSG:4326",将它的axisOrientation改为enu

    var projection = new ol.proj.Projection({
            code: 'EPSG:4326',
            axisOrientation: 'enu'
        });

    2、至此将修改完的projection传给ol.map.view,再加载,就可以了

    map = new ol.Map({
                target: "map",
                layers: [new ol.layer.Tile({
                    source: new ol.source.TileWMS({
                        url: "http://10.19.151.238:8080/geowebcache/service/wms",
                        params: { 'LAYERS': 'beijing', format: 'image/png', SRS: 'EPSG:4326' },
                        tileGrid: tileGrid
                    })
                })],
                view: new ol.View({
                    center: [116.47202, 40.291],
                    resolutions: resolutions,
                    resolution: 0.00475892201166056,
                    projection: projection,
                    extent: fullExtent
                    //zoom: 3
                })
            });

     3、最后附上坐标系可能的轴顺序:常用的有(enu,neu,wnu)

  • 相关阅读:
    基于Python的人脸动漫转换
    let 与 var的区别
    【LeetCode】汇总
    【HDU】4632 Palindrome subsequence(回文子串的个数)
    【算法】均匀的生成圆内的随机点
    【LeetCode】725. Split Linked List in Parts
    【LeetCode】445. Add Two Numbers II
    【LeetCode】437. Path Sum III
    【LeetCode】222. Count Complete Tree Nodes
    【LeetCode】124. Binary Tree Maximum Path Sum
  • 原文地址:https://www.cnblogs.com/giser-s/p/11803583.html
Copyright © 2020-2023  润新知