Modify OSM and WFS examples to use FeatureUrlFunction instead of FeatureLoader
This commit is contained in:
@@ -87,19 +87,13 @@ var styles = {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
var osmxmlFormat = new ol.format.OSMXML();
|
|
||||||
|
|
||||||
var vectorSource = new ol.source.Vector({
|
var vectorSource = new ol.source.Vector({
|
||||||
loader: function(extent, resolution, projection) {
|
format: new ol.format.OSMXML(),
|
||||||
|
url: function(extent, resolution, projection) {
|
||||||
var epsg4326Extent =
|
var epsg4326Extent =
|
||||||
ol.proj.transformExtent(extent, projection, 'EPSG:4326');
|
ol.proj.transformExtent(extent, projection, 'EPSG:4326');
|
||||||
var url = 'http://overpass-api.de/api/xapi?map?bbox=' +
|
return 'http://overpass-api.de/api/xapi?map?bbox=' +
|
||||||
epsg4326Extent.join(',');
|
epsg4326Extent.join(',');
|
||||||
$.ajax(url).then(function(response) {
|
|
||||||
var features = osmxmlFormat.readFeatures(response,
|
|
||||||
{featureProjection: projection});
|
|
||||||
vectorSource.addFeatures(features);
|
|
||||||
});
|
|
||||||
},
|
},
|
||||||
strategy: ol.loadingstrategy.tile(ol.tilegrid.createXYZ({
|
strategy: ol.loadingstrategy.tile(ol.tilegrid.createXYZ({
|
||||||
maxZoom: 19
|
maxZoom: 19
|
||||||
|
|||||||
+5
-17
@@ -10,18 +10,14 @@ goog.require('ol.style.Stroke');
|
|||||||
goog.require('ol.style.Style');
|
goog.require('ol.style.Style');
|
||||||
|
|
||||||
|
|
||||||
// format used to parse WFS GetFeature responses
|
|
||||||
var geojsonFormat = new ol.format.GeoJSON();
|
|
||||||
|
|
||||||
var vectorSource = new ol.source.Vector({
|
var vectorSource = new ol.source.Vector({
|
||||||
loader: function(extent, resolution, projection) {
|
format: new ol.format.GeoJSON(),
|
||||||
var url = 'http://demo.boundlessgeo.com/geoserver/wfs?service=WFS&' +
|
url: function(extent, resolution, projection) {
|
||||||
|
return 'http://demo.boundlessgeo.com/geoserver/wfs?service=WFS&' +
|
||||||
'version=1.1.0&request=GetFeature&typename=osm:water_areas&' +
|
'version=1.1.0&request=GetFeature&typename=osm:water_areas&' +
|
||||||
'outputFormat=text/javascript&format_options=callback:loadFeatures' +
|
'outputFormat=application/json&srsname=EPSG:3857&' +
|
||||||
'&srsname=EPSG:3857&bbox=' + extent.join(',') + ',EPSG:3857';
|
'bbox=' + extent.join(',') + ',EPSG:3857';
|
||||||
// use jsonp: false to prevent jQuery from adding the "callback"
|
|
||||||
// parameter to the URL
|
|
||||||
$.ajax({url: url, dataType: 'jsonp', jsonp: false});
|
|
||||||
},
|
},
|
||||||
strategy: ol.loadingstrategy.tile(ol.tilegrid.createXYZ({
|
strategy: ol.loadingstrategy.tile(ol.tilegrid.createXYZ({
|
||||||
maxZoom: 19
|
maxZoom: 19
|
||||||
@@ -29,14 +25,6 @@ var vectorSource = new ol.source.Vector({
|
|||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
/**
|
|
||||||
* JSONP WFS callback function.
|
|
||||||
* @param {Object} response The response object.
|
|
||||||
*/
|
|
||||||
window.loadFeatures = function(response) {
|
|
||||||
vectorSource.addFeatures(geojsonFormat.readFeatures(response));
|
|
||||||
};
|
|
||||||
|
|
||||||
var vector = new ol.layer.Vector({
|
var vector = new ol.layer.Vector({
|
||||||
source: vectorSource,
|
source: vectorSource,
|
||||||
style: new ol.style.Style({
|
style: new ol.style.Style({
|
||||||
|
|||||||
Reference in New Issue
Block a user