Javascript 打印谷歌地图-屏幕大小影响打印大小

背景

我正在编写一个GoogleMapsWeb应用程序（APIv3），我希望用户能够打印他们在屏幕上看到的内容

map div为100%宽和100%高，覆盖了各种位和BOB，包括标记和应用程序控件等

我正在使用一套@print css规则来删除我不想打印的内容，所有这些都可以完美地工作

问题

我遇到的问题是地图对于页面来说太宽了（实际上也有点太高）。（在打印设置中，尺寸设置为“收缩以适合”）

我主要使用Firefox进行开发，但在Chrome和IE中进行测试，我看到了同样的情况

如果我的1920x1080显示器上有一个全屏浏览器窗口，则品脱预览和打印输出仅为屏幕显示的50%左右

如果我将“打印预览”对话框中的打印大小减小到50%，看起来一切正常

如果我把我的浏览器窗口缩小到水平尺寸的一半左右（并且在垂直方向上缩小一点），那么事情看起来就差不多了

因此，问题似乎取决于浏览器窗口的大小——即浏览器窗口显示的地图超过了可以打印的数量

基本上，我试图实现的是让所有显示的地图打印尽可能高，尽可能宽，这取决于用户的打印机设置-一个真正的“缩小到适合”如果你喜欢。但我似乎拿这个一事无成

我尝试过的“解决方案”

在其他线程中建议的一个解决方案是生成一个适合打印的固定大小的弹出窗口——这是我以前在API v2应用程序中所做的（我正在为v3从头开始编写）——但这也不起作用。在弹出窗口中，我只显示较小的“视口”——即与打印的地图大致相同的部分（我想这证实了我的窗口大小是正确的！）

我正在生成带有以下内容的弹出窗口：

var content = window.document.getElementById("map-canvas"); // get you map details
var logoBox = "<div class='logoBox' id='logoBox' style='width:300px;    height:65px; border-radius:4px; background-color:rgba(255,255,255,0.75);    box-shadow:5px 5px 2px rgba(50,50,50,0.5);  float:left; z-index:10; position:absolute;  top:10px;   left:10px; padding:5px;'><img src='myLogo_300x65.png' id='myLogo'></div>";
var printWindow = window.open("","printWindow", "Width=640, Height=620,location=no,menu bar=no,resizable=no,scrollbars=no,status=no,titlebar=no,toolbar=no"); // open a new window
printWindow.document.write(content.innerHTML); // write the map into the new window
printWindow.document.write(logoBox); 
printWindow.print(); // print the new window

这将插入上述代码中的DOWCOMENT.write语句之后

我相信这些半显而易见的原因对大多数人来说都是显而易见的，但是有没有一种方法可以像这样从主窗口引用贴图对象并对其进行操作

---

感谢收到所有指针，因为这是重新启动站点的显示停止符。

有趣的是，在打印输出或打印预览的右下角放置“仅打印”元素，无论打印缩放设置如何，都会显示在右下角。我不知道这意味着什么，但不知何故，地图分幅似乎被视为不那么重要。但仍然无法解决问题。

var displayedMapBounds = new google.maps.LatLngBounds;
displayedMapBounds = map.getBounds(); // map is the Google Maps instance on the main page
// printWindow.map.fitBounds(displayedMapBounds); // This doesn't work for semi-obvious reasons
printWindow.document.map.fitBounds(displayedMapBounds); // This doesn't work for semi-obvious reasons