TransWikia.com

Html2canvas cannot render map in OpenLayers 3

Geographic Information Systems Asked by Koba on August 8, 2020

I’m using OL3 and the last version of Html2Canvas (1.0.0-rc.5). When I try to make a PNG screenshot of the div that embed the map it seems that the map itself is blank. Also the feature, that are located on my map, are not drawn on the PNG produced by Html2Canvas.

html2canvas($('#mapDiv')[0]).then(function (canvas) {
        var img = canvas.toDataURL('image/png');
        var html = '<html><head><title>' + textHead + '</title></head>';
        html += '<body style="width: 100%; padding: 0; margin: 0;"';
        html += ' onload="window.focus(); window.print(); window.close()">';
        html += '<img src="' + img + '" width="800" /></body></html>';
        var w = window.open();
        w.document.open();
        w.document.write(html);
        w.document.close();
    });

Blank map and disappeared features

One Answer

User Mike answered the question:

That happens if your map canvas is tainted. You may need to specify crossOrigin: 'anonymous' in tile and image layer sources.

Now, also the features are shown on the PNG image.

Correct answer by Koba on August 8, 2020

Add your own answers!

Ask a Question

Get help from others!

© 2024 TransWikia.com. All rights reserved. Sites we Love: PCI Database, UKBizDB, Menu Kuliner, Sharing RPP