OpenLayers 未加载 GeoJSON 图层数据

Question

我想用 openlayers 5.3.0 显示 GeoJSON 文件中的图层，但结果（vectorLayer 变量）显示空白页面，只有 Tile 图层可见。我错过了什么？

使用此示例时 json，我可以使用相同的代码在地图中看到创建的点。

    {
      "type": "FeatureCollection",
      "features": [
        {
          "type": "Feature",
          "properties": {
              "name": "Null Island"
          },
           "geometry": {
             "type": "Point",
             "coordinates": [0, 0]
           }
         }
       ]
    }

我使用的代码：

    <script src="https://cdn.rawgit.com/openlayers/openlayers.github.io/master/en/v5.3.0/build/ol.js"></script>
    new ol.Map({
      target: 'map',
      layers: [
              new ol.layer.Tile({
              source: new ol.source.OSM()
      }),
      new ol.layer.Vector({
                          source: new ol.source.Vector({
                          format: new ol.format.GeoJSON(),
                          url: 'Geologia.json'
                          })
      })

      ],
      view: new ol.View({
                       center: [0, 0],
                       zoom: 3
      })
    });

我没有收到错误消息。该文件上传到 public github 存储库 (https://github.com/tiagoferneda/files/blob/master/Geologia.json)

Answer 1

那将是 22 区以南。您需要在页面中包含 proj4 并定义投影，并将其设为源格式的数据投影：

<script src="https://cdnjs.cloudflare.com/ajax/libs/proj4js/2.5.0/proj4.js"></script>

    proj4.defs('EPSG:32722', '+proj=utm +zone=22 +south +ellps=WGS84 +datum=WGS84 +units=m +no_defs ');
    ol.proj.proj4.register(proj4);

    new ol.Map({
      target: 'map',
      layers: [
              new ol.layer.Tile({
              source: new ol.source.OSM()
      }),
      new ol.layer.Vector({
                          source: new ol.source.Vector({
                          format: new ol.format.GeoJSON({dataProjection: 'EPSG:32722'}),
                          url: 'https://raw.githubusercontent.com/tiagoferneda/files/master/Geologia.json'
                          })
      })

      ],
      view: new ol.View({
                       center: ol.proj.fromLonLat([-49, -27]),
                       zoom: 10
      })
    });

OpenLayers 未加载 GeoJSON 图层数据

OpenLayers not loading GeoJSON layer data

javascript

geojson

openlayers-5