使用jQuery / JavaScript划分圖像

Question

我正在嘗試使用html2canvas庫將div轉換為圖像。 我嘗試但沒有成功無法將完整的div轉換為圖像，圖像中缺少滴管。

網址 ： https ： //www.makethatvape.com/ejuicecalc/

試過代碼：

html2canvas($("#widget")).then(function(canvas) {
   bimg = canvas.toDataURL();  // by default png
});

所以，任何想法如何克服這個問題。 我玩html2canvas，它適用於文本和CSS div到畫布轉換。

Answer 1

試試這個

<div id="copyDiv"></div>

---

    var element = $("#widget"); // global variable
    var getCanvas; // global variable

    html2canvas(element, {
             onrendered: function (canvas) {
                    $("#copyDiv").append(canvas);
                    getCanvas = canvas;
                 }
      });

詳細文章： 在jQuery中將Div轉換為圖像

Answer 2

更簡單的方法：

var convertMeToImg = $('#myDiv')[0];

html2canvas(convertMeToImg).then(function(canvas) {
    $('#resultsDiv').append(canvas);
});

https://html2canvas.hertzen.com/getting-started