使用 Openlayers/Geoserver 从我的 WFS 源更改 srsName答案

【问题标题】：change srsName from my WFS Source with Openlayers/Geoserver使用 Openlayers/Geoserver 从我的 WFS 源更改 srsName
【发布时间】：2020-02-13 17:25:10
【问题描述】：

我目前正在将 WFS 与 Openlayers 一起使用，但图层的位置错误，如果我是对的，问题来自 srsName 但如何更改它？

这是我的 WFS 代码：

var WFSSource = new VectorSource({
  format: new GeoJSON(),
  url: function(extent) {
    return 'http://localhost:8081/geoserver/occi/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=occi%3Aocci&maxFeatures=5&outputFormat=application%2Fjson';
  },
  strategy: bboxStrategy,
});

var WFSLayer = new VectorLayer({
  source: WFSSource
});

我在使用 WMS 时遇到了同样的问题，但我只是更改了 Geoserver (EPSG:2154) 上的 SRC natif，一切正常。现在我遇到了同样的问题，结果如下：

几何体应该在国家的底部。我认为 VectorSource 有一个默认的 srsname，但我不知道如何更改它。顺便说一句，在这个链接上：https://openlayers.org/en/latest/examples/vector-wfs.html 他们展示了如何使用 WFS，他有这行代码：

url: function(extent) {
return 'https://ahocevar.com/geoserver/wfs?service=WFS&' +
    'version=1.1.0&request=GetFeature&typename=osm:water_areas&' +
    'outputFormat=application/json&srsname=EPSG:3857&' +
    'bbox=' + extent.join(',') + ',EPSG:3857';

他定义了 srsName 但对我不起作用。

----- 更新-----

检查投影后发现：

我的地图有默认投影 -> 代码：“EPSG:3857”，单位：米
我的 TileWMS 没有设置，但文档说参数已设置动态的。东西在 Geoserver 上，我使用“EPSG:2154”，但地图和这个 TileWMS 完全匹配，我不明白如何。
我的 VectorSource 有格式 -> dataProjection -> 代码：“EPSG:4326”，单位：度

现在我想弄清楚如何用相同的投影来放置所有东西，但我很挣扎。

如果我使用“EPSG:2154”（我在 Geoserver 中的图层的本机 SRC）更改地图投影，则会出现以下错误：

无法读取 null 的属性“getExtent”。

如果我尝试更改我的 VectorSource 投影没有任何反应，我的 VectorSource 将停留在“EPSG:4326”中

var WFSSource = new VectorSource({
  format: new GeoJSON(),
  url: function(extent) {
    return 'http://localhost:8081/geoserver/occi/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=occi%3Aocci&maxFeatures=5&outputFormat=application%2Fjson';
  },
  projection : "EPSG:2154",
  strategy: bboxStrategy
});

【问题讨论】：

你能给我们一个关于发生了什么的线索吗？可能是地图的图片？最可能的问题是您的数据以度为单位，而您的地图以米为单位，如果是这样，请重新投影数据

标签： openlayers layer geoserver

【解决方案1】：

ol/Source 和 ol/View 有投影。默认投影为 EPSG:3857。如果您的数据或底图不同，那么您应该定义 EPSG:3857。

import Map from 'ol/Map';
import View from 'ol/View';
import VectorLayer from 'ol/layer/Vector';
import VectorSource from 'ol/source/Vector';

const map = new Map({
  layers: [
    new VectorLayer({
        source: new VectorSource({
            projection: 'EPSG:3857',
        })
    })
  ],
  target: 'map',
  view: new View({
    projection: 'EPSG:3857',
  })
});

【讨论】：