html2canvas - IndexSizeError

Question

私は自分のページのdivに読み込まれた画像を取得し、その画像の生データを渡すか、画像を場所にコピーしようとしています。私はhtml2canvas

プレビューにウィンドウに自分の画像を開こうとしたときに、私は次のエラーを取得していますを使用していた見つけることができる

最良の方法：

JavaScriptのランタイムエラー：IndexSizeError

私が持っています次のメソッドを使用してdivをレンダリングできることをアドバイスするいくつかの記事を読んでください：

html2canvas($("#mapDiv"), { 
      onrendered: function (canvas) { 
       // canvas is the final rendered <canvas> element 
       var imgData = canvas.GetContext("2d").getImageData(bounds.left, bounds.top, bounds.width, bounds.height); 
       var myImage = imgData.toDataURL("image/png"); 
       window.open(myImage); 
      } 
     }); 

問題が発生しています次の行にhtml2canvasのJSに

をファイルI異なる解像度

を持つユーザーによる画素のパラメータを渡すカントとして動的に、このようにdiv要素にロードされた画像をレンダリングすることが可能です

可能であれば、何が間違っていますか？

Answer 1

function capture(id) { 

     html2canvas([document.getElementById(id)], { 
      logging: true, 
      onrendered: function(canvas) { 
       document.body.appendChild(canvas); 
       var dataUrl = canvas.toDataURL("image/png") 
       //console.log(dataUrl) 
       $('#img-out').attr("src", canvas.toDataURL("image/png")); 

       $.post("/upload-img", {img: dataUrl, name: id}, function (res) { 
        console.log(res) 


        location.href = $("#" + id).attr("shareUrl") + "&picture=" + (window.location.protocol + "//" +window.location.host + "/" + res.filePath) 

       }) 
      } 
     }); 
    } 

スナップショットを作成する要素のIDを渡します。