Fix transparency for black-and-white rendering

posts/2023/06/flam3/3a-binary.ts

@@ -46,7 +46,7 @@ class AccumulateBinary extends Accumulator {
         image.data[iIdx + 0] = value;
         image.data[iIdx + 1] = value;
         image.data[iIdx + 2] = value;
-        image.data[iIdx + 3] = 0xff;
+        image.data[iIdx + 3] = value ? 0xff : 0;
       }
     }
   }

posts/2023/06/flam3/3b-linear.ts

@@ -18,7 +18,7 @@ export class AccumulateLinear extends Accumulator {
         image.data[iIdx + 0] = value;
         image.data[iIdx + 1] = value;
         image.data[iIdx + 2] = value;
-        image.data[iIdx + 3] = 0xff;
+        image.data[iIdx + 3] = 0xff - value;
       }
     }
   }

posts/2023/06/flam3/3c-logarithmic.ts

@@ -24,7 +24,7 @@ export class AccumulateLogarithmic extends Accumulator {
         image.data[iIdx + 0] = value;
         image.data[iIdx + 1] = value;
         image.data[iIdx + 2] = value;
-        image.data[iIdx + 3] = 0xff;
+        image.data[iIdx + 3] = 0xff - value;
       }
     }
   }

posts/2023/06/flam3/index.tsx

@@ -22,7 +22,7 @@ export default function () {
   });
   return (
     <Layout>
-      {/* <div>
+      <div>
         <Canvas f={gasket} />
         <Canvas f={renderBaseline} />
       </div>
@@ -33,10 +33,10 @@ export default function () {
       <div>
         <Canvas f={renderLinear} />
         <Canvas f={renderLogarithmic} />
-      </div> */}
-      <Canvas f={renderTransform1} />
+      </div>
+      {/* <Canvas f={renderTransform1} />
       <Canvas f={renderTransform2} />
-      <Canvas f={renderTransform3} />
+      <Canvas f={renderTransform3} /> */}
     </Layout>
   );
 }