Drawing a simple polygon using WKT works fine in Angular 18, Openlayers 10. Whatever I try, I cannot draw anything using GML.

After narrowing down the issue, the final problem is this: I cannot read a geometry from GML. The geometry will always be null.

How to solve this? Of course, I could wrap this in a feature collection, but that is only the final backup solution. That works.

import GML3 from 'ol/format/GML3';

const gmlString = `
<gml:Polygon
  xmlns:gml=";
  srsName="EPSG:4326">
  <gml:exterior>
    <gml:LinearRing>
      <gml:posList>
        10 50
        11 50
        11 51
        10 51
        10 50
      </gml:posList>
    </gml:LinearRing>
  </gml:exterior>
</gml:Polygon>
`;

// Use GML3
const gmlFormat = new GML3();
const geometry = gmlFormat.readGeometry(gmlString, {
  dataProjection: 'EPSG:4326',
  featureProjection: 'EPSG:3857',
});
console.log('Parsed geometry with GML3:', geometry);

Drawing a simple polygon using WKT works fine in Angular 18, Openlayers 10. Whatever I try, I cannot draw anything using GML.

After narrowing down the issue, the final problem is this: I cannot read a geometry from GML. The geometry will always be null.

How to solve this? Of course, I could wrap this in a feature collection, but that is only the final backup solution. That works.

import GML3 from 'ol/format/GML3';

const gmlString = `
<gml:Polygon
  xmlns:gml="http://www.opengis.net/gml"
  srsName="EPSG:4326">
  <gml:exterior>
    <gml:LinearRing>
      <gml:posList>
        10 50
        11 50
        11 51
        10 51
        10 50
      </gml:posList>
    </gml:LinearRing>
  </gml:exterior>
</gml:Polygon>
`;

// Use GML3
const gmlFormat = new GML3();
const geometry = gmlFormat.readGeometry(gmlString, {
  dataProjection: 'EPSG:4326',
  featureProjection: 'EPSG:3857',
});
console.log('Parsed geometry with GML3:', geometry);

• angular
• openlayers

2 Answers 2

readGeometry() is not documented in the API for GML formats. However it does exist as an internal method which works on node objects, not text. Also your Polygon definition appears to be in GML2 format:

const gmlData = `
  <gml:Polygon xmlns:gml="http://www.opengis.net/gml" srsName="EPSG:28992">
    <gml:outerBoundaryIs>
      <gml:LinearRing>
        <gml:coordinates>
          155636,466910 165636,466910 165636,476910 155636,476910 155636,466910
        </gml:coordinates>
      </gml:LinearRing>
    </gml:outerBoundaryIs>
  </gml:Polygon>
`;

const gmlDoc = new DOMParser().parseFromString(gmlData, 'application/xml');
const gmlNode = document.createElement('div');
gmlNode.appendChild(gmlDoc.documentElement);

const gmlParser = new GML2();
const polygonGeometry = gmlParser.readGeometry(gmlNode, {
    dataProjection: 'EPSG:28992',
    featureProjection: 'EPSG:3857'
});

Thank you, Mike, for showing a good direction! You wrote:

readGeometry() is not documented in the API for GML formats. However it does exist as an internal method which works on node objects, not text.

A good way to solve reading 1 geometry is wrapping it in a featuresCollection.

parseGml31RdGeometry(gmlString: string): Geometry | null {
    let wrappedGML = stripXmlDeclaration( gmlString);
    wrappedGML = `
      <gml:featureMember xmlns:gml="http://www.opengis.net/gml">
        <Feature>
          <geometry>
            ${wrappedGML}
          </geometry>
        </Feature>
      </gml:featureMember>
    `;

    try {
      const feature = this.gmlFormat.readFeature(wrappedGML, {
        dataProjection: 'EPSG:28992',
        featureProjection: 'EPSG:3857'
      });

      return feature.getGeometry() || null;
    } catch (error) {
      console.error('Error parsing GML:', error);
      return null;
    }
  }

When there is any xml-declaration, you can remove it upfront:

export function stripXmlDeclaration(inputString: string) {
  const xmlDeclarationRegex = /^\s*<\?xml\s+version=["']1\.0["']\s+encoding=["'][^"']+["']\s*\?>\s*/i;
  return inputString.replace(xmlDeclarationRegex, '');
}