Google Map JS API v3無法打印路線

在我們的網頁中，我們整合了google maps js api v3以顯示某些地方的動態視圖。這工程罰款，包括行車路線列表。Google Map JS API v3無法打印路線

但是，打印給我們只有地圖上沒有藍色路線的地圖。

我現在發現，這些元素用帆布元素渲染，和幾個SO線程告訴從畫布轉換到IMG（HTML）將需要（這同樣適用於其他動態的東西一樣多段線，等等。）。

但是： c.toDataURL（）爲我們提供了一個安全的錯誤（鉻）：「抓的SecurityError：被污染的畫布不得出口：無法執行對‘HTMLCanvasElement’toDataURL'。」 （此外，沒有其他的瀏覽器打印，因爲在所有的腳本停止執行，可能是因爲這個錯誤的。

我們的代碼就像下面，它需要有關HTML，把它複製，並執行轉換一樣顯示在各種頁面，然後再如此下去印刷，這工作，如果註釋掉轉換就好了......

var originalContents = document.body.innerHTML; 

    var dataUrl = []; 
    var i = 0; 

    /* Conversion Code */ 
    $("#map_canvas canvas").filter(function(){ 
     dataUrl.push(this.toDataURL("image/png")); // <-- THIS GIVES THE ERROR  
    }); 
    /* Conversion Code */ 

    var DocumentContainer = document.getElementById('map_canvas'); 
    var DocumentContainer_temp = $(DocumentContainer).clone(); 

    DocumentContainer_temp.find(".gm-style-iw").parent().remove(); 
    DocumentContainer_temp.find(".gmnoprint").remove(); 

    /* Conversion Code */ 
    $(DocumentContainer_temp).find('canvas').each(function() {    
    $(this).replaceWith('<img src="' + dataUrl[i] 
          + '" style="position: absolute; left: 0px; top: 0px; width: 256px; height: 256px;" />'); 
    i++; 
    }); 
    /* Conversion Code */ 

    //.... printing etc. following later

預先感謝任何幫助

編輯： 我不知道Google爲什麼這麼做不給一個教程打印這樣的東西（我猜他們不正式要支持這個），而且我們的客戶要求這個功能，說明這是常見的網站，而我從來沒有見過一個單一的網站究竟做什麼，我們試圖在這裏做的：

顯示動態谷歌地圖內容的一個div
允許駕車路線
打印兩種元素，地圖和路線。

我會很高興從你得到一個鏈接到任何網站正是這樣做的，因爲這樣我可以很容易地看看他們的JS文件，看看他們是如何做到這一點....

同樣，提前致謝！

來源

2014-03-05 calav3ra

基本上你的問題是：爲什麼這麼難打印的地圖

我會反問：爲什麼人們做起來很困難。

打印地圖（包括通過畫布創建的形狀）並不困難，您只需按下打印按鈕即可。

的困難的事情是複製/克隆地圖，但我不明白了一個道理，爲什麼你要做到這一點

而不是去了JavaScript的方式，你更好地利用CSS的。通過CSS可以使用頁面的佈局來隱藏除地圖以外的任何內容，並且您只需要一張媒體打印樣式表。

當然，這是大部分時間也很複雜，一個非常簡單的解決方案：

使用的地圖的iframe（可動態創建）。要僅打印地圖，請調用iframe的打印方法，所有將打印的地圖都是地圖。

來源

2014-03-05 23:49:26

你是對的，印刷是直接可能的。耶穌，我怎麼監督呢？這不是真的，考慮到我試了多少。非常感謝！ – calav3ra

Google Map JS API v3無法打印路線

回答

相關問題