1

画像ソースからキャンバス画像を描画しようとしています。
この以下のコード sinppet は正常に動作していますが、IOS では iPad-chrome と mac-safari が初めて動作せず、次の試行から正常に動作しています。どこが間違っていたのかわからない。この問題を解決するために私を助けてください。

        var canvas = document.getElementById("canvasThumbResult");
        var context = canvas.getContext("2d");    
        var img = document.getElementById("ImagSrc");
        context.drawImage(img, x, y, wi, hi, 0, 0, wi, hi);
        var dataURL = canvas.toDataURL("image/jpeg");
        $("#CanvasImg").attr("src", dataURL);
        $("#CanvasImg").show(); 
4

1 に答える 1

1

画像が読み込まれるまで待つ必要があります。

    var canvas = document.getElementById("canvasThumbResult");
    var context = canvas.getContext("2d");    
    var img = document.getElementById("ImagSrc");
    if (img.complete) {
      draw();
    } else {
      img.onload = function() { draw(); };
    }

    function draw() {
      context.drawImage(img, x, y, wi, hi, 0, 0, wi, hi);
      var dataURL = canvas.toDataURL("image/jpeg");
      $("#CanvasImg").attr("src", dataURL);
      $("#CanvasImg").show(); 
    }
于 2013-09-12T13:29:49.630 に答える