拆分图集为散图的一个方法

t0
001
002
在修饰器里放入自己的图集,打开浏览器就可以下载散图压缩包了!!!

3赞

mark!

在你那儿能下载成功吗,这些代码就用了个jszip,应该不会出bug

代码可以粘贴出来吗?我还没有试

放假了,代码没带回去 :rofl:

image 大佬JSZip是什么

论坛里直接搜jszip就行,在这里用来下载压缩包(浏览器散图一次不能下载太多)

好的,谢谢大佬

我还是新手 :rofl:

1754391442031 拆的结果

https://tidys.github.io/atlas-clipper/main.html

好奇怪,在我这儿还没出现过这种一大堆黑图的情况,将getContext(‘2d’)变成getContext(‘2d’, { willReadFrequently: true, alpha: true })试试那

  /**
   * @method readPixels
   * @param {Object} options
   * @param {Number} options.x
   * @param {Number} options.y
   * @param {Number} options.width
   * @param {Number} options.height
   * @param {Number} [options.format=gl.RGBA]
   * @param {Number} [options.type=gl.UNSIGNED_BYTE]
   * @returns {Uint8Array|Float32Array}
   */
 function readPixels(texture,options) {
    let gl = texture._device._gl;
    let x = options.x || 0;
    let y = options.y || 0;
    let width = options.width || texture._width;
    let height = options.height || texture._height;
    let format = options.format || gl.RGBA;
    let type = options.type || gl.UNSIGNED_BYTE;

    // 创建帧缓冲区
    let framebuffer = gl.createFramebuffer();
    gl.bindFramebuffer(gl.FRAMEBUFFER, framebuffer);

    // 将纹理附加到帧缓冲区
    gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, texture._glID, 0);

    // 检查帧缓冲区是否完整
    if (gl.checkFramebufferStatus(gl.FRAMEBUFFER) !== gl.FRAMEBUFFER_COMPLETE) {
      console.error('Framebuffer is not complete');
      gl.bindFramebuffer(gl.FRAMEBUFFER, null);
      gl.deleteFramebuffer(framebuffer);
      return null;
    }

    // 创建像素数据数组
    let pixelCount = width * height;
    let bytesPerPixel = format === gl.RGBA ? 4 : 3;
    let data;
    if (type === gl.FLOAT) {
      data = new Float32Array(pixelCount * bytesPerPixel);
    } else {
      data = new Uint8Array(pixelCount * bytesPerPixel);
    }

    // 读取像素数据
    gl.readPixels(x, y, width, height, format, type, data);

    // 清理资源
    gl.bindFramebuffer(gl.FRAMEBUFFER, null);
    gl.deleteFramebuffer(framebuffer);

    return data;
  }
  function unit8ToImageData(data,width,height) {
    let imageData = new ImageData(width, height);
    imageData.data.set(data);
    return imageData;
  }
/*
  let data = readPixels(temp1,{});
  let idata = unit8ToImageData(data,temp1._width,temp1._height);
  let canvas = document.createElement("canvas");
  canvas.width = temp1._width;
  canvas.height = temp1._height;
  let ctx = canvas.getContext("2d");
  ctx.putImageData(idata,0,0);
  let src = canvas.toDataURL("image/png");
  let img = document.createElement("img");
  img.src = src;
  document.body.appendChild(img);
*/