Openlayers 3打印地圖div

是否有本地方式來打印「地圖」div？Openlayers 3打印地圖div

我已經嘗試了幾個不同的方法......

var printContents = document.getElementById("map").outerHTML; 
        var popupWin = window.open('', '_blank', 'width=600,height=300'); 
        popupWin.document.open(); 
        popupWin.document.write('<html><head><link rel="stylesheet" type="text/css" href="style.css" /></head><body onload="window.print()">' + printContents + '</body></html>'); 
        popupWin.document.close();

而且還...

var divContents = $("#map").html(); 
        var printWindow = window.open('', '', 'height=400,width=800'); 
        printWindow.document.write('<html><head><title>DIV Contents</title>'); 
        printWindow.document.write('</head><body >'); 
        printWindow.document.write(divContents); 
        printWindow.document.write('</body></html>'); 
        printWindow.document.close(); 
        printWindow.print();

這兩個打開一個瀏覽器打印窗口，但是都有一個空白的預覽，它似乎代碼是找到「地圖」div但無法獲得完整的HTML或什麼？

任何幫助非常感謝！

來源

2016-07-11 Funn_Bobby

首先在地圖div中定位canvas元素。如果我使用地圖here，我可以通過做訪問畫布：

var canvas = document.getElementById("map").getElementsByClassName("ol-unselectable")[0];

接下來，將其轉換爲圖像對象：

var img = canvas.toDataURL("image/png");

然後，你可以在頁面和打印的打印圖像該頁面：

document.write('<img src="'+img+'"/>');

來源

2016-07-11 19:00:43

謝謝!!!這工作完美！ –

這是導出到PNG。這不是打印功能。 –

另外我們有CORS問題 –

Openlayers 3打印地圖div

回答

相關問題