html2canvas插件没有捕获图像

Question

之前已经问过这个问题，但我似乎无法让它发挥作用。希望你能看到我的方式的错误。下面的代码将捕获文本和灰色div但不捕获图像。

<div id="snapshot" style="left: -60px; height: 1000px; width: 1000px;">
    <p>THIS IS A TEXT TEST</p>
    <div style="width: 100px; height: 100px; float: left; background: #f0f0f0">

    </div>

    <img src="http://photos.capturemyarizona.com/photos/LnnOEyWSV4fh846ohaIAQg/display.jpg" />
</div>




$("#myBtn").click ->
    html2canvas $("#snapshot"),
      background: "red"
      onrendered: (canvas) ->
        imgSrc = canvas.toDataURL()
        popup = window.open(imgSrc)
        return

    return


<button id="myBtn">Click Me</button>

这里是小提琴 jsfiddle

Answer 1

好的，我弄清楚问题是什么。如果图像不是来自同一个原点，则html2canvas无法捕获图像。我的图片来自CDN。

html2canvas docs