{
 "cells": [
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "# Draw a NumPy array directly on the Canvas with `put_image_data`"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "import numpy as np\n",
    "\n",
    "from ipywidgets import Play, IntProgress, HBox, VBox, link\n",
    "\n",
    "from ipycanvas import Canvas, hold_canvas"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "n = 1\n",
    "\n",
    "dx, dy = 0.01, 0.01\n",
    "\n",
    "y, x = np.mgrid[slice(1, 5 + dy, dy), slice(1, 5 + dx, dx)]\n",
    "\n",
    "z = np.sin(x) ** n + np.cos(n + y * x) * np.cos(x)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "min = np.min(z)\n",
    "max = np.max(z)\n",
    "\n",
    "\n",
    "def scale(value):\n",
    "    scaled_value = (value - min) / (max - min)\n",
    "    return 255 if value > max else scaled_value * 255\n",
    "\n",
    "\n",
    "vecscale = np.vectorize(scale)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "data = np.stack((np.zeros_like(z), vecscale(z), vecscale(z)), axis=2)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "data.shape"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "scale = 1.5\n",
    "\n",
    "canvas = Canvas(width=scale * data.shape[0], height=scale * data.shape[1])\n",
    "canvas"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "canvas.scale(scale)\n",
    "canvas.put_image_data(data, 0, 0)"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "## Make an animation with it!"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "play = Play(interval=500, min=1, max=20, step=1)\n",
    "progress = IntProgress(min=1, max=20, step=1)\n",
    "\n",
    "link((play, \"value\"), (progress, \"value\"))\n",
    "\n",
    "\n",
    "def on_update(*args):\n",
    "    global z\n",
    "\n",
    "    z = np.sin(x) ** play.value + np.cos(play.value + y * x) * np.cos(x)\n",
    "    data = np.stack((np.zeros_like(z), vecscale(z), vecscale(z)), axis=2)\n",
    "\n",
    "    with hold_canvas():\n",
    "        canvas.put_image_data(data, 0, 0)\n",
    "\n",
    "\n",
    "play.observe(on_update, \"value\")\n",
    "\n",
    "# This is to prevent the Canvas to take the entire available space in the VBox\n",
    "canvas.layout.width = str(canvas.width) + \"px\"\n",
    "canvas.layout.height = str(canvas.height) + \"px\"\n",
    "\n",
    "VBox((canvas, HBox((play, progress))))"
   ]
  }
 ],
 "metadata": {
  "kernelspec": {
   "display_name": "Python 3 (ipykernel)",
   "language": "python",
   "name": "python3"
  },
  "language_info": {
   "codemirror_mode": {
    "name": "ipython",
    "version": 3
   },
   "file_extension": ".py",
   "mimetype": "text/x-python",
   "name": "python",
   "nbconvert_exporter": "python",
   "pygments_lexer": "ipython3",
   "version": "3.10.4"
  },
  "widgets": {
   "application/vnd.jupyter.widget-state+json": {
    "state": {},
    "version_major": 2,
    "version_minor": 0
   }
  }
 },
 "nbformat": 4,
 "nbformat_minor": 4
}