谷歌地圖的畫布越來越空白

Question

我想打印的谷歌地圖畫布是一個引導面板就像裏面如下：

<div class="panel panel-default"> 
    <div class="panel-body"> 
     <div id="map">...</div> 
    </div> 
</div> 

我想在打印一個簡單的方法，只需按CTRL + P。但在打印可視化框中，地圖是空白的。會發生什麼？

一些圖片：

在

頁

在打印對話框

Answer 1

通過從引導CSS的@media print部分我已經發現有選擇地去除各種線，我的地圖回來的時候我刪除img {max-width...}行：

@media print { //...there's other stuff above here img { max-width: 100% !important; } //...there's other stuff below here }

您還可以覆蓋這個效果（VS從BS代碼刪除）加入其中已經導入引導之下某處以下：

@media print { img { max-width: none !important; } }

請注意，我在上面的代碼示例中使用了Sass;我在一個Rails項目中，所以我通過bootstrap-sass gem來查看BS代碼。等效的Less或Vanilla CSS應該很容易實現。

非常多的仍然在這個工作，看看它是否真的是一個修復和/或如果這種變化有附帶損害......可能希望將此隔離到div包含您的地圖或其他東西。

編輯：看起來這條線實際上來自取自HTML5Boilerplate項目的代碼，該項目包含在Bootstrap中。我已經在H5BP項目上創建了一個最小化的演示頁面和關於此的頁面。

更新2016年7月21日：此修復程序爲slated for inclusion with BS 4。

Answer 2

畫布的寬度過大。我設定了一個限制，它工作。