html2canvas 与 bootstrap 冲突

Question

如果我使用 html2canvas 0.4.1。字间距没问题。但是文本区域没有新的换行符。如图：https://jsfiddle.net/mdj4epr2/5/

如果我使用html2canvas 0.5.0 任何版本。字间距没问题。 textarea 中的换行符是可以的。如图https://jsfiddle.net/mdj4epr2/8/

但是在html2canvas 0.5.0中加入bootstrap css后，字间距不对。 https://jsfiddle.net/mdj4epr2/9/

主要渲染代码很简单：

html2canvas(main_content, {
    onrendered: function(canvas) {
       canvas_div.appendChild(canvas);
    }
});

有什么建议吗？

Answer 1

我认为问题是 html2canvas 无法从 bootstrap 获取字体系列 "Helvetica Neue" 并将字体系列设置为 none。

我可以通过强制元素使用没有 "Helvetica Neue" 的字体系列来解决这个问题，但看起来仍然不错。

<div id="main_content" style="font-family: Helvetica,Arial,sans-serif">
</div>

或者您可以简单地设置字体系列并在 运行 html2canvas 之后将其更改回来，像这样 https://jsfiddle.net/mdj4epr2/11/