用canvas去掉图片周围的透明区域(去白边)

  • Post author:
  • Post category:其他


//bitmap 包含关于img的各种参数信息
export function getImageBoundRect(bitmap: annie.Bitmap | any, threshold: number=0) {
    let img = bitmap.bitmapData;
    let canvas: HTMLCanvasElement = document.createElement("canvas");
    canvas.width = bitmap.width;
    canvas.height = bitmap.height;
    var _ctx: CanvasRenderingContext2D | any = canvas.getContext("2d");
    _ctx.drawImage(img, 0, 0, img.width, img.height, 0, 0, canvas.width, canvas.height);
    //裁剪空白区域
    var imgData = _ctx.getImageData(0, 0, canvas.width, canvas.height).data;
    var lOffset = canvas.width, rOffset = 0, tOffset = canvas.height, bOffset = 0;
    for (var i = 0; i < canvas.width; i++) {
        for (var j = 0; j < canvas.height; j++) {
            var pos = (i + canvas.width * j) * 4;
            if (imgData[pos + 3] > threshold) {
                // 这个条件说第j行第i列的像素不是透明的
                bOffset = Math.max(j, bOffset); // 找到不透明区域最底部的纵坐标
                rOffset = Math.max(i, rOffset); // 找到不透明区域的最右端
                tOffset = Math.min(j, tOffset); // 找到不透明区域的最上端
                lOffset = Math.min(i, lOffset); // 找到不透明区域的最左端
            }
        }
    }
    // 由于循环是从0开始的,而我们认为的行列是从1开始的
    lOffset++;
    rOffset++;
    tOffset++;
    bOffset++;
    var rect = new annie.Rectangle(lOffset, tOffset, rOffset - lOffset, bOffset - tOffset);
    bitmap.boundBox = rect;
    return rect;
}



版权声明:本文为qq_38323658原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。