使用 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 中模拟
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/
我在显示从服务器加载 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 中模拟
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/