Simple example 'Openlayers GML'?

Question

I am desperate to find a simple example on the Internet how to add 'GML data' into (a Vector in) Openlayers v4. It seems a simple question, but I cannot find any working example (I found a lot of Openlayers v2 and v3 examples).

I have the following code so far:

[example.html]

 <!doctype html>
<html lang="en">
  <head>
    <link rel="stylesheet" href="https://openlayers.org/en/v4.0.1/css/ol.css" type="text/css">
    <script src="https://openlayers.org/en/v4.0.1/build/ol.js"></script>
  </head>
  <body>
    <h1>My Map</h1>
    <div id="map"></div>
    <script type="text/javascript">
      var map = new ol.Map({
        target: 'map',
        layers: [
          new ol.layer.Tile({
            title: 'Global Imagery',
            source: new ol.source.TileWMS({
              url: 'https://ahocevar.com/geoserver/wms',
              params: {LAYERS: 'nasa:bluemarble', TILED: true}
            })
          }),
          new ol.layer.Vector({
            source: new ol.source.Vector({
                url: 'test.gml',
                format: new ol.format.GML()
            }),
          }),
        ],
        view: new ol.View({
          projection: 'EPSG:4326',
          center: [0, 0],
          zoom: 0,
          maxResolution: 0.703125
        })
      });
    </script>
  </body>
</html>

[test.gml]

<?xml version="1.0" encoding="utf-16"?>
<gml:featureMember
    xsi:schemaLocation="http://www.opengis.net/gml http://schemas.opengis.net/gml/3.1.1/profiles/gmlsfProfile/1.0.0/gmlsf.xsd"
    xmlns:gml="http://www.opengis.net/gml"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">
    <feature:feature fid="OpenLayers.Feature.Vector_107" xmlns:feature="http://example.com/feature">
        <feature:geometry>
            <gml:Point>
                <gml:pos>51.509865, -0.118092</gml:pos>
            </gml:Point>
        </feature:geometry>
    </feature:feature>
</gml:featureMember>

score 0 · Answer 1 · edited May 23 '17 at 12:25

See you are trying to load a file(gml) without hosting it in WebServer. If you open the debugger mode you are going to get this following error.

XMLHttpRequest cannot load file:///C:/test.gml. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.

The error itself is giving you the hint. Refer the answer to this question posted in StackOverflow.

Simple example 'Openlayers GML'?

1 Answers1