简单的例子'Openlayers GML'？答案

【问题标题】：Simple example 'Openlayers GML'?简单的例子'Openlayers GML'？
【发布时间】：2017-08-16 04:28:26
【问题描述】：

我迫切希望在 Internet 上找到一个简单示例，如何将“GML 数据”添加到 Openlayers v4 中的（一个向量中）。这似乎是一个简单的问题，但我找不到任何可行的示例（我找到了很多 Openlayers v2 和 v3 示例）。

到目前为止，我有以下代码：

[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>

【问题讨论】：

标签： openlayers gml

【解决方案1】：

看到您正在尝试加载文件（gml）而不将其托管在 WebServer 中。如果您打开调试器模式，您将收到以下错误。

XMLHttpRequest 无法加载 file:///C:/test.gml。跨源请求仅支持协议方案：http、data、chrome、 chrome-extension、https、chrome-extension-resource。

错误本身给了你提示。请参阅 StackOverflow 中发布的this 问题的答案。

【讨论】：