0

My goal is to load several shapefiles and display them using OpenLayers 3 as the basemap. I now have these shapefiles as a Web Feature Service (WFS) on ArcGIS Online. Below is what I have done (starting with one WFS).

// arcgis start
  var geojsonFormat = new ol.format.GeoJSON();

  var vectorSource = new ol.source.Vector({
    loader: function(extent, resolution, projection) {
      var url = '// https://dservices1.arcgis.com/DbPykcCwUUYq5zKg/arcgis/services/urban/WFSServer?service=wfs&request=getcapabilities';
      $.ajax({url: url, dataType: 'jsonp', jsonp: true});
    },
    strategy: ol.loadingstrategy.tile(ol.tilegrid.createXYZ({
      maxZoom: 19
    }))
  });
  window.loadFeatures = function(response) {
    vectorSource.addFeatures(geojsonFormat.readFeatures(response));
  };

  var centerlocations = new ol.layer.Vector({
    source: vectorSource,
    style: new ol.style.Style()
  });

  // arcgis end

My browser console shows ol.tilegrid.createXYZ is not a function. How do I go about successfully loading my shapefiles?

1

createXYZ wasn't added until the later versions of OpenLayers 3. Before that you had to construct an XYZ grid by the long method, if you cannot upgrade this is what is needed:

var proj3857 = ol.proj.get('EPSG:3857');
var origin = ol.extent.getTopLeft(proj3857.getExtent());
var maxResolution = ol.extent.getWidth(proj3857.getExtent()) / 256;

var resolutions = [];
for (var i = 0; i <= 19; i++) {
    resolutions[i] = maxResolution / Math.pow(2, i);
}

...
...

    strategy: ol.loadingstrategy.tile(new ol.tilegrid.TileGrid({
      resolutions: resolutions,
      origin: origin
    }))
  • Thank you! I went with v4.6.5 as opposed to v3.1.1 and that did clear up the error. – Bayo Jan 3 at 15:26

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.