, 目前还没找到直接在 web 端做类似千图成像的,在 web 端实现这个功能确实是很消耗性能的,因为需要处理的数据量好大,计算量也大
需要注意的是: 800*800 的画布有 640000 个像素,通过...ctx.getImageData获取到的每个像素是 4 个值,就是 2560000 个值,我们后面需要处理这 2560000 个值,所以这里我就不做大了
用 fabric 绘制目标图片
需要注意的是,...我们通过本地图片绘制到画布,需要将拿到的 file 文件通过window.URL.createObjectURL(file)将文件转为 blob 类型的 url
像你喜欢用 elementUI 的 upload...);
inputFile.click();
}
});
}
通过以上方法拿到文件后,我在里面已经将图片文件转为了 blob 的 URL 供我们使用 (需要注意的是文件的选择是异步的...,后面我们会用对应的 10000 张图片填充对应的像素块
拿到画布上的所有像素值后,我们需要求出每个小方块的主色调
后面我们需要通过这些小方块的主色调通过求它与资源图片的色差,来决定该方块具体是填充哪一张图片