使用 source.Vector 加载程序函数未在地图上显示的点

points not showing on map using a source.Vector loader function

我在显示从服务器加载 geojson 文件的地图上的几个点时遇到问题。 geojson 文件发生变化,所以我想要一种刷新地图层的好方法。为此,我创建了 source.Vector(OpenLayers 3.17.1 版)

var locationSource = new ol.source.Vector({
  format: new ol.format.GeoJSON({
    defaultDataProjection :'EPSG:4326' 
  }),
  loader: vectorLoader,
  strategy: ol.loadingstrategy.all
});

函数 vectorLoader 执行 XHR 调用以检索最新版本的 geojson 文件。这已在下面的 jsfiddle 中模拟

jsfiddle

geojson 文件有效 json 因为如果我使用 source.Vector 对象,地图上的点会显示 url 属性而不是像这样的装载机:

  var locationSource = new ol.source.Vector({
     url: '/openlayers/location.geojson',
     format: new ol.format.GeoJSON({
        defaultDataProjection :'EPSG:4326' 
      })
  });

我会使用它,但在新文件可用时使用 geojson 文件的缓存版本是很糟糕的。我想要更可靠的东西,这就是为什么我试图让它与 loader.

一起工作

上面的 jsfiddle link 包含所有代码,它似乎 运行 没问题,但是点在 addFeatures 之后从未出现在地图上,位于此处:

onSuccess: function(response) {
  var format = new ol.format.GeoJSON();
  var features = format.readFeatures(response, {
    featureProjection: 'EPSG:4326'
  });
  source.addFeatures(features);
  console.info(source.getFeatures());
  map.updateSize();
  source.changed();

对于 jsfiddle 中提供的数据,您会看到地图上没有显示任何点。我觉得我在这里遗漏了一些基本的东西,但在找到许多解决方案之后,none 工作..我似乎需要在“addFeatures”加载完成后再次执行样式函数。这可以在上面的 jsfiddle 的控制台日志中看到。

确实,这只是您遗漏的一个小问题。

首先,radius 未定义,这可能是从您尚未复制到 fiddle 的变量中提取的。

主要问题是当您阅读地图项时使用了错误的投影 featureProjection: 'EPSG:4326',应该更改为 featureProjection: 'EPSG:3857',因为 OpenLayers 视图中的默认投影是 Web Mercator。也可能是这种情况,您想在读取 GeoJSON 时明确定义数据投影,为此您应该设置 dataProjection: 'EPSG:4326'.

可以在这个 fiddle 中找到一个工作示例:https://jsfiddle.net/9oukr51t/