Fix drawing rgba image

Author: martinRenou

ipycanvas/utils.py

@@ -26,9 +26,11 @@ def image_bytes_to_array(im_bytes):
 
 def binary_image(ar, quality=75):
     f = BytesIO()
-    PILImage.fromarray(ar.astype(np.uint8), "RGB" if ar.shape[2] == 3 else "RGBA").save(
-        f, "JPEG", quality=quality
-    )
+    if ar.shape[2] == 3:
+        filetype = "JPEG"
+    else:
+        filetype = "PNG"
+    PILImage.fromarray(ar.astype(np.uint8)).save(f, filetype, quality=quality)
     return f.getvalue()
 
 

ui-tests/tests/ipycanvas.test.ts-snapshots/ipycanvas-ipynb-cell-35-linux.png

@@ -946,6 +946,35 @@
     "\n",
     "canvas"
    ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "id": "2d77c902",
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "import numpy as np\n",
+    "\n",
+    "from ipycanvas import Canvas\n",
+    "\n",
+    "x = np.linspace(-1, 1, 600)\n",
+    "y = np.linspace(-1, 1, 600)\n",
+    "\n",
+    "x_grid, y_grid = np.meshgrid(x, y)\n",
+    "\n",
+    "blue_channel = np.array(np.sin(x_grid**2 + y_grid) * 255, dtype=np.int32)\n",
+    "red_channel = np.zeros_like(blue_channel) + 200\n",
+    "green_channel = np.zeros_like(blue_channel) + 50\n",
+    "alpha_channel = blue_channel\n",
+    "\n",
+    "image_data = np.stack((red_channel, blue_channel, green_channel, alpha_channel), axis=2)\n",
+    "\n",
+    "canvas = Canvas(width=image_data.shape[0], height=image_data.shape[1])\n",
+    "canvas.put_image_data(image_data, 0, 0)\n",
+    "\n",
+    "canvas"
+   ]
   }
  ],
  "metadata": {
@@ -964,7 +993,7 @@
    "name": "python",
    "nbconvert_exporter": "python",
    "pygments_lexer": "ipython3",
-   "version": "3.10.4"
+   "version": "3.10.5"
   },
   "widgets": {
    "application/vnd.jupyter.widget-state+json": {