WebGL-renderer: implement preRender and postRender

Description

Currently, Heatmaps don’t fire prerender or postrender events. This is because a.t.m. only CanvasLayerRenderer implements the preRender and postRender methods.

Here’s a minimum working example: note how only the OSM’s render-events are being logged:

const layers = [
    new TileLayer({
        source: new OSM(),
    }),
    new Heatmap({
        source: new VectorSource({
            features: new GeoJSON().readFeatures({
                "type": "FeatureCollection",
                "features": [{
                    "type": "Feature",
                    "properties": {},
                    "geometry": {
                      "type": "Point",
                      "coordinates": [13.38134765625, 52.50953477032727]
                    }
                }]
              })
        })
    })
];

const view = new View({
    center: [15, 52],
    zoom: 7,
    projection: 'EPSG:4326'
});


const map = new Map({
    layers, view, target
});


for (const layer of layers) {
    layer.on('postrender', (event) => {
        console.log(event);
    });
}

Solution

I believe we can literally just copy-paste the source code of CanvasLayerRenderer’s preRender and postRender methods into WebGLLayerRenderer. We’d then only have to call preRender and postRender from WebGLPointsLayerRenderer inside of renderFrame.

Would this be appropriate? It is my understanding that WebGl-support is still somewhat experimental (is that still true?). But if this is something we’d like to see, I’d like to try myself on a pull-request over the weekend.

Keep up the great work and thanks a lot! 😃

[MichaelLangbein]

Hi! Alright, thanks a lot @ahocevar and @jahow for all the help! And thanks also for the PR. Given that the build issue described above doesn’t occur anymore, either, I have run out of things to complain about and guess we could close this issue 😃

[jahow]

I think we might as well not provide any context at all in the event. Having a webgl context isn’t as useful as a canvas2d one, since the application code won’t be able to do much with it anyway (without an immediate rendering API like in canvas2d).

Then using something like this should work for building the inverse transform: https://github.com/openlayers/openlayers/blob/f3a67e818289282ac71b6d13df96434dd44ace61/src/ol/renderer/canvas/TileLayer.js#L272-L289

Although I’m not sure that would be even useful considering there will be no drawing context provided anyway. @ahocevar what’s your opinion on this?