threejs压缩图片小工具

xiefandaren

https://www.xiefansq.cn/threejsP/2023/10/21/

// 生成多个Blob对象，这里假设你已经有了这些Blob对象  
let blobs = [blob1, blob2, blob3]; // 将实际的Blob对象替换为示例变量  
  
// 创建一个新的Blob对象，用于存储ZIP文件  
let zipBlob = new Blob([''], { type: 'application/zip' });  
  
// 创建一个Blob URL，用于在浏览器中显示ZIP文件  
let zipUrl = URL.createObjectURL(zipBlob);  
  
// 创建一个新的File API对象，用于表示ZIP文件  
let zipFile = new File([zipBlob], 'archive.zip', { type: 'application/zip' });  
  
// 创建一个新的下载链接元素  
let downloadLink = document.createElement('a');  
downloadLink.href = zipUrl;  
downloadLink.download = zipFile.name;  
  
// 创建一个新的文件夹名称  
let folderName = 'MyFolder';  
  
// 遍历Blob数组，将每个Blob对象转换为图片文件，并添加到ZIP文件中  
for (let i = 0; i < blobs.length; i++) {  
  // 创建一个新的图片元素  
  let img = document.createElement('img');  
  img.src = URL.createObjectURL(blobs[i]); // 将Blob对象转换为URL  
  
  // 创建一个新的canvas元素，用于绘制图片  
  let canvas = document.createElement('canvas');  
  canvas.width = img.width;  
  canvas.height = img.height;  
  let ctx = canvas.getContext('2d');  
  ctx.drawImage(img, 0, 0, img.width, img.height);  
  
  // 将图片数据转换为新的Blob对象  
  let imageBlob = canvas.toDataURL('image/png').split(',')[1];  
  let imageBlobParser = new BlobParser();  
  let imageBlobParsed = imageBlobParser.dataURItoBlob(imageBlob);  
  
  // 将新的Blob对象添加到ZIP文件中  
  zipBlob = zipBlob.slice(0, zipBlob.size, zipBlob.size + imageBlobParsed.size);  
  zipBlob.append(imageBlobParsed);  
}  
  
// 设置下载链接的href属性为ZIP文件的Blob URL  
downloadLink.href = URL.createObjectURL(zipBlob);  
  
// 将下载链接添加到页面中，并触发点击事件以开始下载ZIP文件  
document.body.appendChild(downloadLink);  
downloadLink.click();