时间戳

首页 > 解决方案 > 如何使用 openLayers 将自定义 SRS 设置为图层？

javascript - 如何使用 openLayers 将自定义 SRS 设置为图层？

问题描述

问题是我有一个带有区域列表的数据库，它们存储在一个数据类型列“几何”的表中。所以我想加载一些区域，然后在地图中显示它们。我设法加载这些区域并在地图中显示它们，但它们不在我想要的位置，它们总是出现在非投影地图中心的几内亚湾中。在尝试加载某些区域之前，地图会同时使用 geoServer 图层加载所有区域。所以我的问题是，如何将自定义投影设置为 vectorLayer？如果我做不到，我怎么能用de DB的指定部分自动创建图层？

我正在使用带有 postgis 的 postgres DB。

这是我之前的代码：

ar wmsSource = new ImageWMS({
            url: 'URL TO GEOSERVER',
            params: {
                Layers: "LAYER IN GEOSERVER" ,
                SRS: 'EPSG:4258'
            },
            ratio: 2,
            serverType: 'geoserver'
        });

        var mainMap = new ImageLayer({
            opacity: 0.3,
            source: wmsSource,
            maxResolution: 500
        });
this.map = new Map({
            layers: [
                new TileLayer({
                    preload: Infinity,
                    source: new OSM()
                }),
                mainMap
            ]
            ,
            target: 'map',
});

这是我试图使工作的代码：

 var vectorSource = new VectorSource({
            params: {
                CRS: 'EPSG:4258'
            },
            ratio: 2,
            serverType: 'geoserver'
        });
        var z;
        for(z of nextProps.zoneState.zona){
            var f = new Feature({
                geometry: new MultiPolygon(z.geom.coordinates) 
        });
            vectorSource.addFeature(f);
        }

        var vectorLayer = new VectorLayer({
            source: vectorSource, style:new Style({
                stroke: new Stroke({
                    color: 'red',
                    width: 3
                })
            })
        });
var map = new Map({
            layers: [
            new TileLayer({
                source: new OSM()
            }),
            vectorLayer
            ],
            target: 'map'
});

标签： javascriptopenlayersgeoserver

解决方案

如果您使用VectorSourcewithurl和formatoptions 某些格式（例如 GeoJSON），可以在加载时转换为查看投影。但是，如果您在自己的代码中添加功能，您还需要转换几何

geometry: new MultiPolygon(z.geom.coordinates).transform('EPSG:4258', 'EPSG:3857')

推荐阅读