用标记打印谷歌地图

时间:2013-10-07 08:06:37

标签: javascript google-maps google-maps-api-3

我想要打印我的网页的特定部分,其中包含谷歌地图,其中一些标记指向某个位置。

问题是我的javascript功能只打印谷歌地图而不是标记。但是当我使用Ctrl + P进行打印时,它会使用谷歌地图和标记打印整页。

我正在使用chrome和firefox浏览器。

谁能告诉我这是什么问题。为什么我的功能不是打印标记。 任何帮助,将不胜感激。

function printDiv(firstDivId, secondDivId, thirdDivId) 
{
    /* Creating iframe for printing */
    ifrm = document.createElement("IFRAME");
    ifrm.setAttribute("name", "print_frame");
    ifrm.setAttribute("id", "print_frame_id");
    ifrm.setAttribute("src", "#");
    ifrm.setAttribute("frameborder", 0);
    ifrm.style.width = 0 + "px";
    ifrm.style.height = 0 + "px";
    document.body.appendChild(ifrm);

    /* Creating printableDiv for gethering content divs */
    printableDiv = document.createElement("div");
    printableDiv.setAttribute("id", "printableDivId");
    document.body.appendChild(printableDiv);

    /* Creating printableDiv for chart title css */
    var titleDiv = document.createElement("div");
    titleDiv.setAttribute("id", "titleDiv");
    titleDiv.setAttribute("style",
                    "width:96%;text-align:center;background-color:rgb(255, 238, 182);border-top: 1px solid orange;border-bottom: 1px solid orange;font-size: 16px;font-family: Calibri;border-right: 0px;border-left: 0px;margin-left: 18px;font-weight: bold;");

    document.getElementById("printableDivId").appendChild(titleDiv);
    document.getElementById("titleDiv").innerHTML = $("#" + firstDivId).html();

    $("#" + secondDivId).clone().appendTo("#printableDivId"); **This second div contains the google maps.**

    if (thirdDivId != '') {
        $("#" + thirdDivId).clone().appendTo("#printableDivId");
    }

    // For Landscape style
    var styleStr = '<style type="text/css"  media="print"> @media print{@page {size: landscape}} </style>';

    // With Landscape, It is working in chrome not in firefox.
    var printingContent = styleStr+ document.getElementById("printableDivId").innerHTML;

    // Without Landscape
    // var printingContent=document.getElementById("printableDivId").innerHTML;

    window.frames["print_frame"].document.body.innerHTML = printingContent;
    window.frames["print_frame"].window.focus();
    window.frames["print_frame"].window.print();

    /* Removing printableDiv and iframe for next time printing */
    $("#printableDivId").remove();
    $("#print_frame_id").remove();
}

0 个答案:

没有答案