收藏
回答

使用webgl的canvas,如何保存图片到相册?

最近做的一个项目必须用到webgl,但发现官方API中都不支持webgl导出到相册的功能,请问该如何实现?

回答关注问题邀请回答
收藏

1 个回答

  • Cailven
    Cailven
    05-14
     var width;
          var height;
          var gl = self.canvas.getContext("webgl", {
            preserveDrawingBuffer: true
          });
          self.renderer.render(self.scene, self.camera);
          width = gl.drawingBufferWidth;
          height = gl.drawingBufferHeight;
          const pixels = new Uint8Array(width * height * 4);
          gl.readPixels(0, 0, width, height, gl.RGBA, gl.UNSIGNED_BYTE, pixels);
          var dataArray = new Uint8ClampedArray(typedArrayToBuffer(pixels));
          putImgData();
    
    
          function putImgData() {
            wx.canvasPutImageData({
              canvasId: "draw",
              data: dataArray,
              x: 0,
              y: 0,
              width: width,
              height: height,
              success: (res) => {
               wx.canvasToTempFilePath({
              x: 0,
              y: 0,
              width: width,
              height: height,
              destWidth: width,
              destHeight: width,
              canvasId: 'draw',
              success: (res) => {
                callback(res);
              },
              fail: (res) => {
                console.log(res);
              }
            }, self)
              },
              fail(res) {
                console.log(res);
              }
            }, self);
          }
    
    function typedArrayToBuffer(array) {
            return array.buffer.slice(array.byteOffset, array.byteLength + array.byteOffset)
          }
    


    05-14
    有用
    回复 1
    • Evil
      Evil
      11-05
      使用这个代码,发现合成的图片是一个黑色的图,输入取到的数据发现 是 [0,0,0,3...]  这样的数据,麻烦问下,您是怎么解决的
      11-05
      回复
登录 后发表内容
问题标签