html2canvas .svg形式の画像はレンダリングされません

Question

html2canvasを使用してスクリーンショットを作成すると、.svg拡張子を持つ画像は正しくレンダリングされません。 allowTaint：trueオプションを指定しようとしましたが、まだ動作していません。

コードスニペット：我々はSCR属性にURLをimgタグの代わりにDIVタグを使用した場合

<div class="myDiv" style="background-image:url('image.svg');"> 
</div> 

html2canvas($(".myDiv"), { 
allowTaint: true, 
onrendered: function (canvas){ 
    //use canvas 
    } 
}); 

Answer 1

html2canvasは背景SVG画像をキャプチャします。だから、私が見つけた解決策は、html2canvas関数を呼び出す前に、各divの新しいimgタグを動的に作成することです。

$(".myDiv").each(function() { 
     var url = $(this).css("background-image") 
     var src = url.substring(5, url.length - 2); 
     var image = new Image(); 
     image.src = src; 
     var canvas = document.createElement("canvas"); 
     var ctx = canvas.getContext("2d"); 
     ctx.canvas.width = $(this).height(); 
     ctx.canvas.height = $(this).width(); 
     ctx.drawImage(image, 0, 0); 
     $(this).append(canvas); 
    }); 

これは、divタグをimgタグに置き換えることができる場合にのみ機能します。