Add 'rendercomplete' event

examples/export-pdf.js

@@ -3,7 +3,6 @@ import View from '../src/ol/View.js';
 import {defaults as defaultControls} from '../src/ol/control.js';
 import WKT from '../src/ol/format/WKT.js';
 import {Tile as TileLayer, Vector as VectorLayer} from '../src/ol/layer.js';
-import {unByKey} from '../src/ol/Observable.js';
 import {OSM, Vector as VectorSource} from '../src/ol/source.js';
 
 const raster = new TileLayer({
@@ -48,9 +47,6 @@ const dims = {
   a5: [210, 148]
 };
 
-let loading = 0;
-let loaded = 0;
-
 const exportButton = document.getElementById('export-pdf');
 
 exportButton.addEventListener('click', function() {
@@ -66,57 +62,22 @@ exportButton.addEventListener('click', function() {
   const size = /** @type {module:ol/size~Size} */ (map.getSize());
   const extent = map.getView().calculateExtent(size);
 
-  const source = raster.getSource();
-
-  const tileLoadStart = function() {
-    ++loading;
-  };
-
-  let timer;
-  let keys = [];
-
-  function tileLoadEndFactory(canvas) {
-    return () => {
-      ++loaded;
-      if (timer) {
-        clearTimeout(timer);
-        timer = null;
-      }
-      if (loading === loaded) {
-        timer = window.setTimeout(() => {
-          loading = 0;
-          loaded = 0;
-          const data = canvas.toDataURL('image/jpeg');
-          const pdf = new jsPDF('landscape', undefined, format);
-          pdf.addImage(data, 'JPEG', 0, 0, dim[0], dim[1]);
-          pdf.save('map.pdf');
-          keys.forEach(unByKey);
-          keys = [];
-          map.setSize(size);
-          map.getView().fit(extent, {size});
-          map.renderSync();
-          exportButton.disabled = false;
-          document.body.style.cursor = 'auto';
-        }, 500);
-      }
-    };
-  }
-
-  map.once('postcompose', function(event) {
+  map.once('rendercomplete', function(event) {
     const canvas = event.context.canvas;
-    const tileLoadEnd = tileLoadEndFactory(canvas);
-    keys = [
-      source.on('tileloadstart', tileLoadStart),
-      source.on('tileloadend', tileLoadEnd),
-      source.on('tileloaderror', tileLoadEnd)
-    ];
-    tileLoadEnd();
+    const data = canvas.toDataURL('image/jpeg');
+    const pdf = new jsPDF('landscape', undefined, format);
+    pdf.addImage(data, 'JPEG', 0, 0, dim[0], dim[1]);
+    pdf.save('map.pdf');
+    // Reset original map size
+    map.setSize(size);
+    map.getView().fit(extent, {size});
+    exportButton.disabled = false;
+    document.body.style.cursor = 'auto';
   });
 
+  // Set print size
   const printSize = [width, height];
   map.setSize(printSize);
   map.getView().fit(extent, {size: printSize});
-  loaded = -1;
-  map.renderSync();
 
 }, false);