diff --git a/leaflet-image.js b/leaflet-image.js index 030a2c4..e38fd3a 100644 --- a/leaflet-image.js +++ b/leaflet-image.js @@ -36,7 +36,21 @@ module.exports = function leafletImage(map, callback) { layerQueue.defer(handlePathRoot, map._pathRoot); } else if (map._panes) { var firstCanvas = map._panes.overlayPane.getElementsByTagName('canvas').item(0); - if (firstCanvas) { layerQueue.defer(handlePathRoot, firstCanvas); } + var canvases = map._panes.overlayPane.getElementsByTagName('canvas'); + if (firstCanvas) { + if (!firstCanvas.classList.contains("heatmap-canvas")) { + layerQueue.defer(handlePathRoot, firstCanvas); + } + } + for (var i = 0; i < canvases.length; i++) { + if (canvases.item(i).classList.contains("heatmap-canvas")) { + map.eachLayer(function(layer) { + if (layer._heatmap) { + layerQueue.defer(handleHeatMap, layer); + } + }); + } + } } map.eachLayer(drawMarkerLayer); layerQueue.awaitAll(layersDone); @@ -194,7 +208,26 @@ module.exports = function leafletImage(map, callback) { console.error('Element could not be drawn on canvas', root); // eslint-disable-line no-console } } - + + function handleHeatMap(heatmap, callback) { + var canvas = document.createElement('canvas'); + canvas.width = dimensions.x; + canvas.height = dimensions.y; + + var ctx = canvas.getContext('2d'); + + var im = new Image(); + im.crossOrigin = ''; + im.src = heatmap._heatmap.getDataURL(); + + im.onload = function() { + ctx.drawImage(im, 0, 0); + callback(null, { + canvas: canvas + }); + }; + } + function handleMarkerLayer(marker, callback) { var canvas = document.createElement('canvas'), ctx = canvas.getContext('2d'), @@ -385,4 +418,4 @@ module.exports = function leafletImage(map, callback) { })); },{}]},{},[1])(1) -}); \ No newline at end of file +});