收藏
回答

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

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

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

1 个回答

  • Cailven
    Cailven
    2020-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)
          }
    


    2020-05-14
    有用
    回复 6
    • Evil
      Evil
      2020-11-05
      使用这个代码,发现合成的图片是一个黑色的图,输入取到的数据发现 是 [0,0,0,3...]  这样的数据,麻烦问下,您是怎么解决的
      2020-11-05
      回复
    •         
              
      2021-12-14
      请问有完整代码吗?刚刚接触的菜鸟不太会
      2021-12-14
      回复
    • Cailven
      Cailven
      2022-01-08回复Evil
      抗锯齿关了吗?
      2022-01-08
      回复
    • 品茗乐
      品茗乐
      2022-08-06
      关闭了,导出的res.tempFilePath 也是空内容
      2022-08-06
      1
      回复
    • Cailven
      Cailven
      2022-09-02回复品茗乐
      你先试试二进制流是否正确?可以把二进制先post给后端保存下试试
      2022-09-02
      回复
    查看更多(1)
登录 后发表内容
问题标签