How to focus the image when it is added to the map in OpenLayers?

Question

I created a map with OpenLayers OSM. On this map I add an image provided by GeoServer. My question is how to focus the image when it is added to the map. As zooming into the area on the map where the image is added.

var result = new ol.layer.Image({
    source: new ol.source.ImageWMS({
        url: 'http://localhost:8080/geoserver/pgrouting/wms',
        params: params
    })
});
map.addLayer(result);

map.zoomToMaxExtent();

Answer 1

You can listen to imageloadend event and fit your map view, like:

imageSource.once('imageloadend', function(e) {
    console.info('image loaded');
    var view = map.getView();
    view.fitExtent(layerImage.getExtent(), map.getSize());   
});

Note that this will run just once, otherwise, every zoom/pan would trigger this fit view.

A plunker demo.