Search code examples
openlayersarcgis

Loading ImageServer data with Openlayers


So I'm trying to load an ArcGOS ImageServer with openlayers 5.2, but i'm really struggling to get anything to work. The code I've written is based off of this example http://openlayers.org/en/latest/examples/vector-esri.html. Here is my modified version for ImageServer instead of FeatureServer. The url that i generate is valid, but im not sure how to add the image to the source like you need to.

If anyone has any ideas let me know.

  var imageUrl = 'https://sampleserver3.arcgisonline.com/ArcGIS/rest/services/Portland/Aerial/ImageServer';
  var xyzGrid = new ol.tilegrid.createXYZ({
    tileSize: 512
  });

  var featureSource = new ol.source.Vector({
    loader: function(extent, resolution, projection) {
      var url = imageUrl + '/exportImage?bbox=' + extent.join(",") +
        '&imageSR=102100' +
        '&bboxSR=102100' +
        '&pixelType=U8' +
        '&f=pjson' +
        '&size=512%2C512';

      $.ajax({
        url: url,
        dataType: 'jsonp',
        success: function(response) {
          console.log(response)
          if (response.error) {
            console.log(response.error.message + '\n' + response.error.details.join('\n'));
          } else {
            var source = new ol.source.Image({
              url: response.href,
              projection: projection,
              imageExtent: extent
            });
            featureSource.addFeatures(source);
          }
        }});
    },
    strategy: new ol.loadingstrategy.tile(xyzGrid)
  });
  var featureService = new ol.layer.Vector({
    title: 'ImageServer',
    source: featureSource,
  });
  layers.push(featureService);

Solution

  • Nevermind, TileArcGISRest works fine, but I just needed

    params: {
      'FORMAT': 'png'
    }
    

    since my test server didn't support the default "PNG32" format.