无法用图标打印谷歌地图答案

【问题标题】：Unable to print google map with icons无法用图标打印谷歌地图
【发布时间】：2010-09-07 12:41:20
【问题描述】：

当我打印谷歌地图时；它不打印图标；如何打印完整的谷歌地图我正在使用 google maps api v3 for javascript

【问题讨论】：

标签： google-maps

【解决方案1】：

还有几个其他问题可以解决这个问题： How to print Google Map markers

简而言之，Google Maps Javascript API 无法正确或根本无法打印叠加层（标记、线条）。您可以使用 Google Maps Static API，但您将受限于在地图上绘制的叠加层数量。然而，这是获得可靠打印的最佳方式。

较长的标记具有“gmnoprint”类，这使它们无法显示在打印的渲染中。您可以遍历标记并删除此类，这应该允许它们打印在页面上。据我所知，这不适用于方向线。

【讨论】：

【解决方案2】：

很多天尝试打印图标和路线，所以我终于做到了！！！！！！！！！我找到了一个 js script that convert html to canvas，我认为这将是解决方案，但不幸的是它根本不是。

如果发现，当我使用它并告诉浏览器打印页面时，最终显示它！！！！但画布再次不显示图标¿...？

所以我只是在加载时执行脚本并将结果画布附加到地图后面的 div 中（如果你放 display:none 不起作用！）。对不起我的英语:) 这里有一点代码：

<div id="imprimir">
    <h1><?php echo $direccion;?></h1>
    <div id="distancia"></div>
    <div id="map-canvas" style="margin: 0;padding: 0; height: 550px;z-index:10"></div>                          
    <div id="captura" style="position:absolute;top:100px;left:50px;"></div>
</div>
//------------ ... 
Google Map code here
//------------ ...
<script>
    html2canvas($("#imprimir"), {
        onrendered: function(canvas) {
            $("#captura").html(canvas);                                        
        }
    });            
</script>

嗯，希望对你有帮助！！！

【讨论】：

【解决方案3】：

 $("#btnPrint").click(function () {
        var contents = $("#map_canvas").html();
        var frame1 = $('<iframe />');
        frame1[0].name = "frame1";
        frame1.css({ "position": "absolute", "top": "-1000000px" });
        $("body").append(frame1);
        var frameDoc = frame1[0].contentWindow ? frame1[0].contentWindow : frame1[0].contentDocument.document ? frame1[0].contentDocument.document : frame1[0].contentDocument;
        frameDoc.document.open();
        //Create a new HTML document.
        frameDoc.document.write('<html><head><title>DIV Contents</title>');
        frameDoc.document.write('</head><body>');
        //Append the external CSS file.
        frameDoc.document.write('<link href="style.css" rel="stylesheet" type="text/css" />');
        //Append the DIV contents.
        frameDoc.document.write(contents);
        frameDoc.document.write('</body></html>');
        frameDoc.document.close();
        setTimeout(function () {
            window.frames["frame1"].focus();
            window.frames["frame1"].print();
            frame1.remove();
        }, 500);
    });

【讨论】：