3
var pixelProjection = new ol.proj.Projection({
    code: 'pixel',
    units: 'pixels',
    extent: [0, 0, width, height]
});

var layerNC = new ol.layer.Image({
        source: new ol.source.ImageStatic({
            url: '../cartes/img/' + newMapFileName,
            imageSize: [width, height],
            projection: pixelProjection,
            imageExtent: pixelProjection.getExtent()
        })
    }),
    layerVG = new ol.layer.Image({
        source: new ol.source.ImageStatic({
            url: '../cartes/img/' + oldMapFileName,
            imageSize: [width, height],
            projection: pixelProjection,
            imageExtent: pixelProjection.getExtent()
        })
    });

var map = new ol.Map({
    layers: [
        layerNC,
        layerVG
    ],
    target: 'interactiveMap',
    controls: [],
    view: new ol.View({
        projection: pixelProjection,
        center: ol.extent.getCenter(pixelProjection.getExtent()),
        zoom: 1.75,
        maxZoom: 3,
        minZoom: 0
    })
});

layerVG.on("change", function(){
    console.log("loaded");
});

I am trying to make the layer event work and I can't seem to make it fire. Even when I try with moveend, nothing seems to be working. I want to have an event fire when the image (layer) is loaded for the first time.

2

Currently, OpenLayers 3 doesn't provide a mechanism to know when sources/layers are loaded. This is planned, but not yet implemented.

In the mean time, you can use your own imageLoadFunction. In your case:

 var source = new ol.source.ImageStatic({
   url: '../cartes/img/' + newMapFileName,
   imageSize: [width, height],
   projection: pixelProjection,
   imageExtent: pixelProjection.getExtent(),
   imageLoadFunction: function(image, src) {
     var imageElement = image.getImage();
     imageElement.onload = function() {
       console.log('loaded');
     };
     imageElement.src = src;
   }
  });

I've never used this myself, and I'm hoping it works.

Note that a similar technique can also be used for tile sources. See this post on the OpenLayers 3 mailing list.

|improve this answer|||||
  • Solution does not seem to work. The 'imageLoadFunction' never seems to fire. Also i could not find anything in the API documentation related to that. – Julien Jan 12 '15 at 18:26
  • Uncheck "stable only" to see the option in the documentation. – erilem Jan 12 '15 at 18:47
  • Do you use 3.1.1? – erilem Jan 12 '15 at 18:48
  • I am using 3.0.0, though that could be changed. – Julien Jan 12 '15 at 18:52
  • The imageLoadFunction didn't exist in 3.0.0. Try to use 3.1.1. – erilem Jan 12 '15 at 18:54

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.