Question

我在android webview中使用Html5来绘制图像：

var img = new Image();
    img.src = arrayImg[count];
    img.onload = function() {
        console.log('Onload called::'+count);
        canvasAppend(img,count);
        initialiseImages(count + 1 );
    };

这里：

function canvasAppend(img,index){
    var canvas = createCanvasElement(img);
...
}

function createCanvasElement(img) {
    var radius = 20;
    var canvas = document.createElement('canvas');
    canvas.setAttribute('width',  imgWidth);
    canvas.setAttribute('height', imgHeight);
    var _height = img.naturalHeight;
    var _width  = img.naturalWidth;
    var w = false; // width is shorter?
    if (_height > _width) w = true;
    var sx, sy, sw, sh;

    //console.log('_width::'+ _width+'  _height::'+_height);


    if (w) {
        sx = 0;
        sy = _height / 2 - _side / 2;
    } else {
        var _side = _height;
        sx = _width / 2 - _side / 2;
        sy = 0;
    }
    sw = _width;
    sh = _height;

    var cx = canvas.getContext('2d');
    cx.beginPath();
    cx.moveTo(radius, 0);
    cx.lineTo(canvas.width - radius, 0);
    cx.quadraticCurveTo(canvas.width, 0, canvas.width, radius);
    cx.lineTo(canvas.width, canvas.height - radius);
    cx.quadraticCurveTo(canvas.width, canvas.height, canvas.width - radius, canvas.height);
    cx.lineTo(radius, canvas.height);
    cx.quadraticCurveTo(0, canvas.height, 0, canvas.height - radius);
    cx.lineTo(0, radius);
    cx.quadraticCurveTo(0, 0, radius, 0);
    cx.clip();
    console.log('sx::'+ sx+'  sy::'+sy);
    console.log('sw::'+ sw+'  sh::'+sh);
    console.log('img::'+img);
    console.log('imgWidth:::'+imgWidth);
    console.log('imgHeight:::'+imgHeight);
    cx.drawImage(img, sx, sy, sw, sh, 0, 0, imgWidth, imgHeight);
    //  $(canvas).click(coverflow.popup(img));
    return canvas;
}

控制台日志返回的值：

sx::1  sy::0 
sw::250  sh::248
img::[object HTMLImageElement] 
imgWidth:::224.8 
imgHeight:::225.83333333333334

我仍然收到错误未捕获错误：INDEX_SIZE_ERR：在绘制图像行时出现DOM异常1。

有人有任何想法吗？感谢

Answer 1

好吧，我找到了解决方案，如果

sw = _width;
sh = _height;

替换为：

 sw = _width -40;
 sh = _height -40;

虽然我找不到原因，但是......

HTML5画布在Android Webview中绘制图像“Uncaught Error：INDEX_SIZE_ERR：DOM Exception 1”

1 个答案: