在我们的网页中，我们整合了谷歌地图js api v3，以显示某些地方的动态视图。这可以罚款，包括行车路线列表。
但是， 打印只为我们提供了地图上没有蓝色路线的地图 。
我现在发现那些元素是使用canvas元素渲染的，而且有几个SO线程表示需要从canvas到img（html） 的 转换（同样适用于其他动态的东西，如折线等。）。
但是： c.toDataURL（）给我们一个安全错误（在chrome中）：＆＃34;抓住了SecurityError：无法执行＆＃39; toDataURL＆＃39; on＆＃39; HTMLCanvasElement＆＃39;：可能无法导出受污染的画布。＆＃34; （此外，根本没有其他浏览器打印，因为脚本执行已停止，可能是因为该错误。
我们的代码如下所示，它采用相关的html，复制它，并进行各种页面上显示的转换，然后继续打印，如果注释转换，它可以正常工作... < / p>
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
提前感谢您的帮助！
修改 我不知道为什么谷歌没有提供打印这些东西的教程（我猜他们不是正式想要支持这个），而且 我们的客户要求此功能，说它在网站上很常见，而我从来没有看到过一个网站正在做我们尝试做的事情：
我很高兴从你那里得到一个指向任何网站的链接，因为那时我可以很容易地查看他们的JS文件并看看他们是如何做到的....
再次，提前致谢！
答案 0 :(得分：4)
基本上你的问题是：打印地图为何如此困难
我会回答：为什么人们会这么困难。
打印地图（包括通过画布创建的形状）并不困难，您只需按下打印按钮即可。
困难的是复制/克隆地图，但我没有看到你必须这样做的原因
不要使用javascript方式，而是使用CSS。使用通过CSS的页面布局可以隐藏除地图之外的任何内容，您只需要一个媒体打印样式表。
当然这大部分时间也很复杂，这是一个非常简单的解决方案：
为地图使用iframe（可以动态创建）。要仅打印地图，请调用iframe的print方法，所有要打印的内容都是地图。