js image转canvas不显示

提示：扫一扫查出行
【扫一扫了解最新限行尾号】
复制提示

今天在项目开发中遇到了image转canvas不显示的问题，最后翻了不少资料才发现问题出现在图片加载上

如果你的代码是这样的，那么不显示的原因就是img没有加载完成

function convertImageToCanvas(image) {

    var canvas = document.createElement("canvas");

    canvas.width = image.width;

    canvas.height = image.height;

    canvas.getContext("2d").drawImage(image, 0, 0);

    return canvas;

}

这样做试试

function convertImageToCanvas(image) {

    var canvas = document.createElement("canvas");

    canvas.width = image.width;

    canvas.height = image.height;

    image.onload = function () {

        canvas.getContext("2d").drawImage(this, 0, 0);

    };

    return canvas;

}