fix image export issues

- handle pre-multiplied alpha
- don't clear draw target unless written to

src/mol-canvas3d/passes/draw.ts

@@ -290,7 +290,7 @@ export class DrawPass {
         renderer.setViewport(x, y, width, height);
         renderer.update(camera);
 
-        if (transparentBackground) {
+        if (transparentBackground && !antialiasingEnabled && toDrawingBuffer) {
             this.drawTarget.bind();
             renderer.clear(false);
         }

src/mol-canvas3d/passes/image.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright (c) 2019-2020 mol* contributors, licensed under MIT, See LICENSE file for more info.
+ * Copyright (c) 2019-2021 mol* contributors, licensed under MIT, See LICENSE file for more info.
  *
  * @author Alexander Rose <alexander.rose@weirdbyte.de>
  */
@@ -103,7 +103,9 @@ export class ImagePass {
         } else {
             this.webgl.readPixels(viewport.x, height - viewport.y - viewport.height, w, h, array);
         }
-        PixelData.flipY({ array, width: w, height: h });
+        const pixelData = PixelData.create(array, w, h);
+        PixelData.flipY(pixelData);
+        PixelData.divideByAlpha(pixelData);
         return new ImageData(new Uint8ClampedArray(array), w, h);
     }
 }

src/mol-util/image.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright (c) 2019 mol* contributors, licensed under MIT, See LICENSE file for more info.
+ * Copyright (c) 2019-2021 mol* contributors, licensed under MIT, See LICENSE file for more info.
  *
  * @author Alexander Rose <alexander.rose@weirdbyte.de>
  */
@@ -32,4 +32,16 @@ namespace PixelData {
         }
         return pixelData;
     }
+
+    /** to undo pre-multiplied alpha */
+    export function divideByAlpha(pixelData: PixelData): PixelData {
+        const { array } = pixelData;
+        for (let i = 0, il = array.length; i < il; i += 4) {
+            const a = array[i + 3] / 255;
+            array[i] /= a;
+            array[i + 1] /= a;
+            array[i + 2] /= a;
+        }
+        return pixelData;
+    }
 }