时间戳

首页 > 解决方案 > 显示 GML3 文件中的特征（带有特定投影）

openlayers-6 - 显示 GML3 文件中的特征（带有特定投影）

问题描述

如何使用特定格式显示 GML 文件中的几何图形？问题是没有显示任何内容。没有错误信息。

在我的 Angular 项目中，我首先设置了具体的投影。

proj4.defs("EPSG:28992", "+proj=sterea +lat_0=52.15616055555555 +lon_0=5.38763888888889 +k=0.9999079 +x_0=155000 +y_0=463000  +ellps=bessel  +towgs84=565.040,49.910,465.840,-0.40939,0.35971,-1.86849,4.0772 +units=m +no_defs");
register(proj4)
this.dutchProjection = GetProjection('EPSG:28992');

这就是我读取 GML 文件的方式（没有错误）：

this.gmlFeatures = new GML3().readFeatures(this.fileText, {
        featureProjection: 'EPSG:28992', dataProjection: 'EPSG:28992' });

标签： openlayers-6gml-geographic-markup-lan

解决方案

最后我找到了解决方案。

解决方案的特别之处在于：它包含特定的投影并使用 GML3！

第 1 步 - 从文件中加载特征。

Step 1.A：首先定义具体的投影

定义具体的投影：

defineProjection() {
    proj4.defs("EPSG:28992", "+proj=sterea +lat_0=52.15616055555555 +lon_0=5.38763888888889 +k=0.9999079 +x_0=155000 +y_0=463000  +ellps=bessel  +towgs84=565.040,49.910,465.840,-0.40939,0.35971,-1.86849,4.0772 +units=m +no_defs");
    register(proj4)
    this.dutchProjection = GetProjection('EPSG:28992');
  }

步骤 1.B：加载特征。

在这种情况下，我从文件中读取，但它可能是从 URL 读取的。首先定义投影很重要，否则您会收到 Axis 错误消息等。

this.defineProjection();
this.httpClient.get('assets/wfs113-epsg-28992.xml', {responseType: 'text'})
  .subscribe(
    data => {
      console.log(data);
      this.fileText = data;
      var wfsFormat = new WFS({
        gmlFormat: new GML3()
      });
      this.gmlFeatures = wfsFormat.readFeatures(this.fileText, {
        featureProjection: 'EPSG:28992',
        dataProjection: 'EPSG:28992'
      });
      this.addGmlFeatures();
    },
    error => {
      console.log(error);
    }
  );

第 2 步 - 显示读取特征集合

我使用了荷兰的特定地图/投影。您可以轻松地将其与 OSM 变体进行交换。

ngAfterViewInit() {
    let polygonStyle = new Style({
      fill: new Fill({
        color: "rgba(255, 0, 0, 0.8)"
      }),
      stroke: new Stroke({
        color: "#ffcc33",
        width: 10
      })
    });
    this.vectorSource = new VectorSource({
      format: new WFS(),
      features: []
    });
    this.vectorLayer = new Vector({
      source: this.vectorSource,
      style: [polygonStyle]
    });

    this.map = new Map({
      layers: [
        new Tile({
          source: new XYZ({
            url: 'https://geodata.nationaalgeoregister.nl/tiles/service/wmts/brtachtergrondkaart/EPSG:3857/{z}/{x}/{y}.png',
          })
        }),
        this.vectorLayer
      ],
      view: new View({
        projection: this.dutchProjection,
        center: [173063,441818],
        zoom: 9
      }),
      target: "map"
    });
    this.addGmlFeatures();
  }

并添加以下功能：

addGmlFeatures() {
    if (this.gmlFeatures.length > 0) {
      this.vectorLayer.getSource().addFeatures(this.gmlFeatures);
      //this.map.getView().fit( this.vectorSource.getExtent());
      console.log( this.map.getView().getProjection());
    }
  }

示例文件：

<?xml version='1.0' encoding="ISO-8859-1" ?>
<wfs:FeatureCollection
  xmlns:ms="http://mapserver.gis.umn.edu/mapserver"
  xmlns:gml="http://www.opengis.net/gml"
  xmlns:wfs="http://www.opengis.net/wfs"
  xmlns:ogc="http://www.opengis.net/ogc"
  xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
  xsi:schemaLocation="http://mapserver.gis.umn.edu/mapserver http://atl-p0-app001.culture.fr:5522/cgi-bin/mapserv?SERVICE=WFS&amp;VERSION=1.1.0&amp;REQUEST=DescribeFeatureType&amp;TYPENAME=MD_2775&amp;OUTPUTFORMAT=text/xml;%20subtype=gml/3.1.1  http://www.opengis.net/wfs http://schemas.opengis.net/wfs/1.1.0/wfs.xsd">
  <gml:boundedBy>
    <gml:Envelope srsName="EPSG:28992">
      <gml:lowerCorner>173063 441818</gml:lowerCorner>
      <gml:upperCorner>173563 444318</gml:upperCorner>
    </gml:Envelope>
  </gml:boundedBy>
  <gml:featureMember>
    <ms:MD_2775>
      <gml:boundedBy>
        <gml:Envelope srsName="EPSG:28992">
          <gml:lowerCorner>173063 441818</gml:lowerCorner>
          <gml:upperCorner>173563 444318</gml:upperCorner>
        </gml:Envelope>
      </gml:boundedBy>
      <ms:msGeometry>
        <gml:Polygon srsName="EPSG:28992">
          <gml:exterior>
            <gml:LinearRing>
              <gml:posList srsDimension="2">173063 441818 173463 441818 173463 444818 173063 444818 173063 441818 </gml:posList>
            </gml:LinearRing>
          </gml:exterior>
        </gml:Polygon>
      </ms:msGeometry>
    </ms:MD_2775>
  </gml:featureMember>
</wfs:FeatureCollection>

推荐阅读