js 提取图片拼合图片

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/liyangyang08/article/details/80630594
  • 拿到一个需求就是把两个图合成一个图
  • 首先分别把两个图的象素提取出来然后各取一半最后再合成一个图
  • 用的jimp模块来实现的
  • npm install --save jimp
    然后为了防止异步不能同时拿到两张图后再处理所以把第二张图放在第一个完成方法里面了
    如下
 Jimp.read('test.png').then(function (image) {
        oldpixs = image.bitmap.data;
        console.log(image.bitmap.data);
        Jimp.read('testone.png').then(function (image) {
            newpixs = image.bitmap.data;
            console.log(image.bitmap.data);
            console.log(oldpixs);
            console.log(newpixs);
            const pixelSize = 768;
            var saveimage = new Jimp(pixelSize, pixelSize, function (err, saveimage) {
                let buffer =[];
                //saveimage.bitmap.data=newpixs;
                // for (let inum=0;inum<newpixs.length;inum++)
                // {
                //     buffer[inum]=newpixs[inum]*0.5+oldpixs[inum]*0.5;
                // }
                 for (var x = 0; x < pixelSize; x++) {
                    for (var y = 0; y < pixelSize; y++) {
                        let offset = ( pixelSize * x) +y* 4 // RGBA = 4 bytes
                        buffer[offset] = newpixs[offset]   // R
                        buffer[offset + 1] = newpixs[offset+1]    // G
                        buffer[offset + 2] = newpixs[offset+2]    // B
                        buffer[offset + 3] = newpixs[offset+3]  // Alpha
                    }
                }
                saveimage.bitmap.data=buffer;

            })

            saveimage.write('image.png')
        })
    })

源码和结果可以参考
https://github.com/Ants-double/BlogCode

猜你喜欢

转载自blog.csdn.net/liyangyang08/article/details/80630594