Question

是否有本地方式打印“地图”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();

这两个都打开了一个浏览器打印窗口，但都有一个空白预览，似乎代码是找到“map”div而不能获得完整的HTML或其他东西？

非常感谢任何帮助!!

Answer 1

Start by locating the canvas element in the map div. If I use the map here, I can access the canvas by doing:

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

Next, convert it to an image object:

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

Then, you can print the image on the page and print the page:

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

Openlayers 3打印地图div

1 个答案: