var vectorSource = new ol.source.ServerVector({ format: new ol.format.WFS({ featureNS: 'http://openstreemap.org', featureType: 'water_areas' }), loader: function(extent, resolution, projection) { var url = 'http://demo.opengeo.org/geoserver/wfs?'+ 'service=WFS&request=GetFeature&'+ 'version=1.1.0&typename=osm:water_areas&'+ 'srsname=EPSG:3857&'+ 'bbox=' + extent.join(','); console.log(url); $.ajax({ url: url }) .done(function(response) { vectorSource.addFeatures(vectorSource.readFeatures(response)); }); }, strategy: ol.loadingstrategy.createTile(new ol.tilegrid.XYZ({ maxZoom: 19 })), projection: 'EPSG:3857' }); // Vector layer var vectorLayer = new ol.layer.Vector({ source: vectorSource, style: new ol.style.Style({ stroke: new ol.style.Stroke({ color: 'green', width: 2 }) }) }); // Map var map = new ol.Map({ target: 'map', renderer: 'canvas', layers: [ vectorLayer], view: new ol.View({ center: ol.proj.transform([-75.923853, 45.428736], 'EPSG:4326', 'EPSG:3857'), maxZoom: 19, zoom: 11 }) }); // Source retrieving WFS data in GeoJSON format using JSONP technique var vectorSourceJsonp = new ol.source.ServerVector({ format: new ol.format.GeoJSON(), loader: function(extent, resolution, projection) { var url = 'http://demo.opengeo.org/geoserver/wfs?'+ 'service=WFS&request=GetFeature&'+ 'version=1.1.0&typename=osm:water_areas&'+ 'outputFormat=text/javascript&'+ 'format_options=callback:loadFeatures&' + 'srsname=EPSG:3857&'+ 'bbox=' + extent.join(','); $.ajax({ url: url, dataType: 'jsonp' }); }, strategy: ol.loadingstrategy.createTile(new ol.tilegrid.XYZ({ maxZoom: 19 })), projection: 'EPSG:3857' }); // Executed when data is loaded by the $.ajax method. var loadFeatures = function(response) { vectorSourceJsonp.addFeatures(vectorSourceJsonp.readFeatures(response)); }; // Vector layer var vectorLayerJsonp = new ol.layer.Vector({ source: vectorSourceJsonp, style: new ol.style.Style({ stroke: new ol.style.Stroke({ color: 'green', width: 2 }) }) }); // Map var mapJsonp = new ol.Map({ target: 'mapJsonp', renderer: 'canvas', layers: [ vectorLayerJsonp], view: new ol.View({ center: ol.proj.transform([-75.923853, 45.428736], 'EPSG:4326', 'EPSG:3857'), maxZoom: 19, zoom: 11 }) });I am getting "Uncaught TypeError: ol.tilegrid.XYZ is not a function(anonymous function) @ vector-layer_Ex1.html:37" while executing above code on geoserver.
أكثر...
أكثر...