ChatGPTExperiments.ipynb

{
 "cells": [
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "8f9b8d6c-1430-4bcb-859a-8df880fbb081",
   "metadata": {},
   "outputs": [],
   "source": [
    "from IPython.display import HTML\n",
    "import numpy as np\n",
    "import base64\n",
    "import cv2\n",
    "import random\n",
    "import rp"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "265c2be5-dc59-4919-952a-8024fd6d45e7",
   "metadata": {},
   "outputs": [],
   "source": [
    "def before_after_split_image(before, after):\n",
    "    \"\"\"\n",
    "    Displays an interactive before/after split image in Jupyter notebook.\n",
    "    :param before: numpy array representing the before image in HWC format\n",
    "    :param after: numpy array representing the after image in HWC format\n",
    "    :param id_base: base id to be used as prefix for all the element's ids\n",
    "    \"\"\"\n",
    "    \n",
    "    id_base = rp.random_namespace_hash()\n",
    "    \n",
    "    before_b64 = 'data:image/jpg;base64,'+base64.b64encode(cv2.imencode('.jpg', before)[1]).decode()\n",
    "    after_b64 = 'data:image/jpg;base64,'+base64.b64encode(cv2.imencode('.jpg', after)[1]).decode()\n",
    "\n",
    "    html_template = f\"\"\"\n",
    "    <!DOCTYPE html>\n",
    "    <html>\n",
    "      <head>\n",
    "        <style>\n",
    "          /* Container for the split image */\n",
    "          #{id_base}_split-image {{\n",
    "            position: relative;\n",
    "            width: {before.shape[1]}px; /* adjust to the size of the images */\n",
    "            height: {before.shape[0]}px; /* adjust to the size of the images */\n",
    "            overflow: hidden;\n",
    "          }}\n",
    "          /* The before image */\n",
    "          #{id_base}_before {{\n",
    "            position: absolute;\n",
    "            width: 100%;\n",
    "            height: 100%;\n",
    "            z-index: 0;\n",
    "          }}\n",
    "          /* The after image */\n",
    "          #{id_base}_after {{\n",
    "            position: absolute;\n",
    "            width: 100%;\n",
    "            height: 100%;\n",
    "            z-index: 1;\n",
    "            clip-path: polygon(0 0, 100% 0, 0 100%, 0 100%);\n",
    "          }}\n",
    "          /* The divider that splits the images */\n",
    "          #{id_base}_divider {{\n",
    "            position: absolute;\n",
    "            width: 2px; /* adjust the width of the divider */\n",
    "            height: 100%;\n",
    "            background: white; /* adjust the color of the divider */\n",
    "            cursor: ew-resize; /* change to 'col-resize' for horizontal split */\n",
    "          }}\n",
    "        </style>\n",
    "      </head>\n",
    "      <body>\n",
    "        <div id=\"{id_base}_split-image\" class=\"split-image\">\n",
    "          <img id=\"{id_base}_before\" class=\"before\" src={before_b64} alt=\"before image\">\n",
    "          <img id=\"{id_base}_after\" class=\"after\" src={after_b64} alt=\"after image\">\n",
    "          <div id=\"{id_base}_divider\" class=\"divider\"></div>\n",
    "        </div>\n",
    "        <script>\n",
    "          // Get the divider and split image elements\n",
    "          var splitImg = document.querySelector(\"#{id_base}_split-image\");\n",
    "\n",
    "          // Add event listener for mousemove\n",
    "          splitImg.addEventListener(\"mousemove\", function(event) {{\n",
    "            var divider = document.querySelector(\"#{id_base}_divider\");\n",
    "            // Update the position of the divider\n",
    "            var rect = splitImg.getBoundingClientRect();\n",
    "            var x = event.clientX - rect.left;\n",
    "            divider.style.left = x + 'px';\n",
    "            // Update the clip-path property of the after image\n",
    "            var clipPath = \"polygon(0 0, \" + x + \"px 0, \" + x + \"px 100%, 0 100%)\";\n",
    "            document.querySelector(\"#{id_base}_after\").style.clipPath = clipPath;\n",
    "          }});\n",
    "        </script>\n",
    "      </body>\n",
    "    </html>\n",
    "    \"\"\"\n",
    "    return HTML(html_template)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "0a488414-7bf6-43ea-8f5c-d504d8f7a957",
   "metadata": {},
   "outputs": [],
   "source": [
    "import numpy as np\n",
    "\n",
    "before = np.random.randint(0, 255, (256, 256, 3), dtype=np.uint8)\n",
    "after = np.random.randint(0, 255, (256, 256, 3), dtype=np.uint8)\n",
    "\n",
    "before_after_split_image(before, after)\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "b4e502b0-89e8-4f32-b138-e6bba7fbf941",
   "metadata": {},
   "outputs": [],
   "source": [
    "import numpy as np\n",
    "\n",
    "before = np.random.randint(0, 255, (256, 256, 3), dtype=np.uint8)\n",
    "after = np.random.randint(0, 255, (256, 256, 3), dtype=np.uint8)\n",
    "\n",
    "before_after_split_image(before, after)\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "528f787f-be71-4211-bd19-f4e9a07a034b",
   "metadata": {},
   "outputs": [],
   "source": [
    "import numpy as np\n",
    "\n",
    "before = np.random.randint(0, 255, (256, 256, 3), dtype=np.uint8)\n",
    "after = np.random.randint(0, 255, (256, 256, 3), dtype=np.uint8)\n",
    "\n",
    "before_after_split_image(before, after, 'TAOE')\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "2a2d13bd-9359-4b74-8c7b-64276d8099dd",
   "metadata": {},
   "outputs": [],
   "source": [
    "before_after_split_image(\n",
    "    rp.load_image(\"https://upload.wikimedia.org/wikipedia/commons/thumb/6/60/YellowLabradorLooking.jpg/640px-YellowLabradorLooking.jpg\"),\n",
    "    rp.load_image(\"https://media-cldnry.s-nbcnews.com/image/upload/rockcms/2022-08/220805-border-collie-play-mn-1100-82d2f1.jpg\")\n",
    ")"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "9195b432-0095-41b0-89a8-4d981caeefc2",
   "metadata": {},
   "outputs": [],
   "source": [
    "import matplotlib.pyplot as plt\n",
    "import numpy as np\n",
    "\n",
    "def matplotlib_bar_graph_image(values):\n",
    "    fig, ax = plt.subplots()\n",
    "    ax.bar(range(len(values)), values)\n",
    "    fig.canvas.draw()\n",
    "    data = np.frombuffer(fig.canvas.tostring_rgb(), dtype=np.uint8)\n",
    "    data = data.reshape(fig.canvas.get_width_height()[::-1] + (3,))\n",
    "    plt.close(fig)\n",
    "    return data\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "0e0a3b2a-81bc-4025-9eab-3c07c8e97e5d",
   "metadata": {},
   "outputs": [],
   "source": [
    "rp.display_image(matplotlib_bar_graph_image([1,2,3,5,]))"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "c6c539ab-3f59-492e-8fdf-241bd27bd64c",
   "metadata": {},
   "outputs": [],
   "source": [
    "import matplotlib.pyplot as plt\n",
    "import numpy as np\n",
    "\n",
    "def matplotlib_bar_graph_image(values, height=1024, width=1024):\n",
    "    fig, ax = plt.subplots(figsize=(width/100, height/100), dpi=100)\n",
    "    ax.bar(range(len(values)), values)\n",
    "    fig.canvas.draw()\n",
    "    data = np.frombuffer(fig.canvas.tostring_rgb(), dtype=np.uint8)\n",
    "    data = data.reshape(fig.canvas.get_width_height()[::-1] + (3,))\n",
    "    plt.close(fig)\n",
    "    return data\n",
    "rp.display_image(matplotlib_bar_graph_image([1,2,3,5,]))\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "b6ce3881-975f-4e2c-979a-a46e05cc07dd",
   "metadata": {},
   "outputs": [],
   "source": [
    "def before_after_split_image_multi(images:list, id_base):\n",
    "    \"\"\"\n",
    "    Displays an interactive before/after split image in Jupyter notebook.\n",
    "    :param images: list of numpy arrays representing the images in HWC format\n",
    "    :param id_base: base id to be used as prefix for all the element's ids\n",
    "    \"\"\"\n",
    "    \n",
    "    html_template = f\"\"\"\n",
    "    <!DOCTYPE html>\n",
    "    <html>\n",
    "      <head>\n",
    "        <style>\n",
    "          /* Container for the split image */\n",
    "          #{id_base}_split-image {{\n",
    "            position: relative;\n",
    "            width: {images[0].shape[1]}px; /* adjust to the size of the images */\n",
    "            height: {images[0].shape[0]}px; /* adjust to the size of the images */\n",
    "            overflow: hidden;\n",
    "          }}\n",
    "          /* The before image */\n",
    "          #{id_base}_before {{\n",
    "            position: absolute;\n",
    "            width: 100%;\n",
    "            height: 100%;\n",
    "            z-index: 0;\n",
    "          }}\n",
    "          /* The after image */\n",
    "          #{id_base}_after {{\n",
    "            position: absolute;\n",
    "            width: 100%;\n",
    "            height: 100%;\n",
    "            z-index: 1;\n",
    "            clip-path: polygon(0 0, 100% 0, 0 100%, 0 100%);\n",
    "          }}\n",
    "          /* The divider that splits the images */\n",
    "          #{id_base}_divider {{\n",
    "            position: absolute;\n",
    "            width: 2px; /* adjust the width of the divider */\n",
    "            height: 100%;\n",
    "            background: white; /* adjust the color of the divider */\n",
    "            cursor: ew-resize; /* change to 'col-resize' for horizontal split */\n",
    "          }}\n",
    "        </style>\n",
    "      </head>\n",
    "      <body>\n",
    "        <div id=\"{id_base}_split-image\" class=\"split-image\">\n",
    "          <img id=\"{id_base}_before\" class=\"before\" src='' alt=\"before image\">\n",
    "          <img id=\"{id_base}_after\" class=\"after\" src='' alt=\"after image\">\n",
    "          <div id=\"{id_base}_divider\" class=\"divider\"></div>\n",
    "        </div>\n",
    "        <select id='{id_base}_before_select'>\n",
    "    \"\"\"\n",
    "    for i, image in enumerate(images):\n",
    "        b64 = 'data:image/jpg;base64,'+base64.b64encode(cv2.imencode('.jpg', image)[1]).decode()\n",
    "        html_template += f'<option value=\"image_{i}\">Image {i+1}</option>'\n",
    "    html_template += '</select>'\n",
    "    html_template += '<select id=\"{id_base}_after_select\">'\n",
    "    for i, image in enumerate(images):\n",
    "        html_template += f'<option value=\"image_{i}\">Image {i+1}</option>'\n",
    "    html_template += '</select>'\n",
    "    html_template += f\"\"\"\n",
    "        <script>\n",
    "          // Get the divider and split image elements\n",
    "          var divider = document.querySelector(\"#{id_base}_divider\");\n",
    "          var splitImg = document.querySelector(\"#{id_base}_split-image\");\n",
    "          \n",
    "          // Get the before and after select elements\n",
    "          var beforeSelect = document.querySelector(\"#{id_base}_before_select\");\n",
    "          var afterSelect = document.querySelector(\"#{id_base}_after_select\");\n",
    "\n",
    "          // Add event listeners for mousemove and select change\n",
    "          splitImg.addEventListener(\"mousemove\", function(event) {{\n",
    "            // Update the position of the divider\n",
    "            var rect = splitImg.getBoundingClientRect();\n",
    "            var x = event.clientX - rect.left;\n",
    "            divider.style.left = x + 'px';\n",
    "            // Update the clip-path property of the after image\n",
    "            var clipPath = \"polygon(0 0, \" + x + \"px 0, \" + x + \"px 100%, 0 100%)\";\n",
    "            document.querySelector(\"#{id_base}_after\").style.clipPath = clipPath;\n",
    "          }});\n",
    "          \n",
    "          beforeSelect.addEventListener(\"change\", function() {{\n",
    "            document.querySelector(\"#{id_base}_before\").src = '{b64}';\n",
    "          }});\n",
    "          \n",
    "          afterSelect.addEventListener(\"change\", function() {{\n",
    "            document.querySelector(\"#{id_base}_after\").src = '{b64}';\n",
    "          }});\n",
    "        </script>\n",
    "      </body>\n",
    "    </html>\n",
    "    \"\"\"\n",
    "    return HTML(html_template)\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "38a57241-815a-46d9-b495-023084826fdc",
   "metadata": {},
   "outputs": [],
   "source": [
    "before_after_split_image_multi([\n",
    "    rp.load_image(\"https://upload.wikimedia.org/wikipedia/commons/thumb/6/60/YellowLabradorLooking.jpg/640px-YellowLabradorLooking.jpg\"),\n",
    "    rp.load_image(\"https://media-cldnry.s-nbcnews.com/image/upload/rockcms/2022-08/220805-border-collie-play-mn-1100-82d2f1.jpg\")\n",
    "],'ssss'\n",
    ")\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "f65c5d83-c5e2-48cf-8369-1218c166d112",
   "metadata": {},
   "outputs": [],
   "source": [
    "from IPython.display import display\n",
    "from PIL import Image\n",
    "import numpy as np\n",
    "\n",
    "img = np.random.rand(100, 100, 3)\n",
    "img = (img * 255).astype(np.uint8) # convert float values to int \n",
    "img = Image.fromarray(img) # convert numpy array to image\n",
    "img_display = display(img, display_id=True) # assign output to a variable\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "454abb47-a480-4bf1-a0b1-232f33cfe135",
   "metadata": {},
   "outputs": [],
   "source": [
    "img = np.random.rand(100, 100, 3)\n",
    "img = (img * 255).astype(np.uint8) # convert float values to int \n",
    "img = Image.fromarray(img) # convert numpy array to image\n",
    "img_display.update(img) # update the image\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "b2e7fdc3-f3f3-4ff8-81ac-2c52294d1788",
   "metadata": {},
   "outputs": [],
   "source": [
    "i=0\n",
    "while True:\n",
    "    i+=4\n",
    "    img = np.random.rand(100, 100, 3)\n",
    "    img = (img * 255).astype(np.uint8) # convert float values to int \n",
    "    img=rp.rotate_image(img,i)\n",
    "    img = Image.fromarray(img) # convert numpy array to image\n",
    "    img_display.update(img) # update the image\n",
    "    import time\n",
    "    time.sleep(.03)\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "7ccc52fb-9e25-42e6-80a2-154449202942",
   "metadata": {},
   "outputs": [],
   "source": [
    "import cv2\n",
    "import numpy as np\n",
    "from IPython.display import display, clear_output\n",
    "from PIL import Image\n",
    "\n",
    "def load_image_from_webcam_jupyter():\n",
    "    rp.pip_import(\"ipywebrtc\")\n",
    "    try:\n",
    "        from ipywebrtc import CameraStream, ImageRecorder\n",
    "    except ImportError:\n",
    "        raise ImportError(\"Please install ipywebrtc to use this feature\")\n",
    "    \n",
    "    camera = CameraStream.facing_user()\n",
    "    display(camera)\n",
    "    recorder = ImageRecorder(stream=camera)\n",
    "    recorder.image.observe(lambda change: print(change), 'value')\n",
    "    recorder.recording = True\n",
    "    return np.array(recorder.image.value)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "a4be9f7b-f47e-41ce-ba2e-ca8ec6722422",
   "metadata": {},
   "outputs": [],
   "source": [
    "load_image_from_webcam_jupyter()"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "cfed92fc-f943-4c58-ad82-a298b54f3d0c",
   "metadata": {},
   "outputs": [],
   "source": [
    "import plotly.graph_objs as go\n",
    "\n",
    "fig = go.Figure(data=[go.Mesh3d(x=[0, 0, 1, 1],\n",
    "                               y=[0, 1, 1, 0],\n",
    "                               z=[0, 0, 0, 0],\n",
    "                               i=[7, 0, 0, 0],\n",
    "                               j=[3, 4, 5, 6],\n",
    "                               k=[0, 1, 2, 3],\n",
    "                               color='lightpink',\n",
    "                               opacity=0.50)])\n",
    "# fig.show()\n",
    "\n",
    "config={'scrollZoom': True}\n",
    "fig.update_layout(scene = dict(aspectmode='data'),width=800, height=600, margin=dict(l=0, r=0, b=0, t=0),paper_bgcolor='rgba(0,0,0,0)',plot_bgcolor='rgba(0,0,0,0)',)\n",
    "fig.show(config=config)\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "aadbc696-8676-4b45-af78-6b750b993d53",
   "metadata": {},
   "outputs": [],
   "source": [
    "import plotly.subplots as sp\n",
    "\n",
    "fig = sp.make_subplots(rows=1, cols=1, specs=[[{'type': 'scene'}]])\n",
    "\n",
    "fig.add_trace(go.Mesh3d(x=[0, 0, 1, 1],\n",
    "                       y=[0, 1, 1, 0],\n",
    "                       z=[0, 0, 0, 0],\n",
    "                       i=[7, 0, 0, 0],\n",
    "                       j=[3, 4, 5, 6],\n",
    "                       k=[0, 1, 2, 3],\n",
    "                       color='lightpink',\n",
    "                       opacity=0.50))\n",
    "\n",
    "fig.update_layout(scene = dict(aspectmode='data'),width=800, height=600, margin=dict(l=0, r=0, b=0, t=0),paper_bgcolor='rgba(0,0,0,0)',plot_bgcolor='rgba(0,0,0,0)',)\n",
    "\n",
    "fig.update_layout(\n",
    "    autosize=True,\n",
    "    sliders=[\n",
    "        dict(\n",
    "            active=0,\n",
    "            currentvalue={\"prefix\": \"Height: \"},\n",
    "            pad={\"t\": 0, \"r\": 0},\n",
    "            steps=[\n",
    "                dict(\n",
    "                    method=\"relayout\",\n",
    "                    args=[\"height\", height],\n",
    "                    label=f\"{height}\"\n",
    "                ) for height in range(400, 800, 1)\n",
    "            ]\n",
    "        )\n",
    "    ])\n",
    "\n",
    "fig.show()\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "11313335-1a39-477e-a56f-3eca7482a2b8",
   "metadata": {},
   "outputs": [],
   "source": [
    "import plotly.graph_objs as go\n",
    "import time\n",
    "\n",
    "# Initialize the plot\n",
    "fig = go.Figure(data=[go.Mesh3d(x=[0, 0, 1, 1],\n",
    "                               y=[0, 1, 1, 0],\n",
    "                               z=[0, 0, 0, 0],\n",
    "                               i=[7, 0, 0, 0],\n",
    "                               j=[3, 4, 5, 6],\n",
    "                               k=[0, 1, 2, 3],\n",
    "                               color='lightpink',\n",
    "                               opacity=0.50)])\n",
    "fig.show()\n",
    "\n",
    "# Animation loop\n",
    "i = 0\n",
    "while True:\n",
    "    # Update the data\n",
    "    fig.update_traces(x=[1, 2, 3, 4],\n",
    "                      y=[2, 3, 4, 5],\n",
    "                      z=[1, 2, 3, 4],\n",
    "                      scene = dict(aspectmode='manual',aspectratio=dict(x=1, y=1, z=1), camera=dict(eye=dict(x=0, y=0, z=1))))\n",
    "    # Sleep for 100 milliseconds\n",
    "    time.sleep(0.1)\n",
    "    i += 1"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "44596953-ace3-4b1f-b73b-78aa8a827b2d",
   "metadata": {},
   "outputs": [],
   "source": [
    "# import plotly.graph_objs as go\n",
    "# import time\n",
    "# import math\n",
    "\n",
    "# # Initialize the plot\n",
    "# # fig = go.Figure(data=[go.Mesh3d(x=[0, 0, 1, 1],\n",
    "# #                                y=[0, 1, 1, 0],\n",
    "# #                                z=[0, 0, 0, 0],\n",
    "# #                                i=[7, 0, 0, 0],\n",
    "# #                                j=[3, 4, 5, 6],\n",
    "# #                                k=[0, 1, 2, 3],\n",
    "# #                                color='lightpink',\n",
    "# #                                opacity=0.50)])\n",
    "# fig = go.Figure(data=[go.Mesh3d(x=[0, 0, 1, 1],\n",
    "#                                y=[0, 1, 1, 0],\n",
    "#                                z=[0, 0, 0, 0],\n",
    "#                                i=[7, 0, 0, 0],\n",
    "#                                j=[3, 4, 5, 6],\n",
    "#                                k=[0, 1, 2, 3],\n",
    "#                                type='mesh3d',\n",
    "#                                color='black',\n",
    "#                                line=dict(width=1))])\n",
    "# fig.show()\n",
    "\n",
    "# # # Initialize the rotation angle\n",
    "# # angle = 0\n",
    "\n",
    "# # # Animation loop\n",
    "# # while True:\n",
    "# #     # Update the data\n",
    "# #     x = [0, 0, 1, 1]\n",
    "# #     y = [0, 1, 1, 0]\n",
    "# #     z = [0, 0, 0, 0]\n",
    "# #     for i in range(len(x)):\n",
    "# #         x[i], y[i] = x[i]*math.cos(angle) - y[i]*math.sin(angle), x[i]*math.sin(angle) + y[i]*math.cos(angle)\n",
    "# #     fig.update_traces(x=x, y=y, z=z)\n",
    "# #     # Sleep for 100 milliseconds\n",
    "# #     time.sleep(0.1)\n",
    "# #     angle += 0.1"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "934ad21a-771c-4465-bbec-2c2a1c7f6a03",
   "metadata": {},
   "outputs": [],
   "source": [
    "import plotly.graph_objs as go\n",
    "\n",
    "x=[0, 1, 1, 0, 0, 1, 1, 0]\n",
    "y=[0, 0, 1, 1, 0, 0, 1, 1]\n",
    "z=[0, 0, 0, 0, 1, 1, 1, 1]\n",
    "\n",
    "fig = go.Figure(data=[go.Scatter3d(x=x, y=y, z=z,\n",
    "                                   mode='lines',\n",
    "                                   line=dict(color='black', width=2))])\n",
    "fig.show()"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "6dacafd4-4dd2-47a1-a031-89b6b03b2a56",
   "metadata": {},
   "outputs": [],
   "source": [
    "import plotly.graph_objs as go\n",
    "import time\n",
    "import math\n",
    "\n",
    "x=[0, 1, 1, 0, 0, 1, 1, 0]\n",
    "y=[0, 0, 1, 1, 0, 0, 1, 1]\n",
    "z=[0, 0, 0, 0, 1, 1, 1, 1]\n",
    "\n",
    "fig = go.Figure(data=[go.Scatter3d(x=x, y=y, z=z,\n",
    "                                   mode='lines',\n",
    "                                   line=dict(color='black', width=2))])\n",
    "fig.show()\n",
    "\n",
    "angle = 0\n",
    "while True:\n",
    "    x=[0, 1, 1, 0, 0, 1, 1, 0]\n",
    "    y=[0, 0, 1, 1, 0, 0, 1, 1]\n",
    "    z=[0, 0, 0, 0, 1, 1, 1, 1]\n",
    "    for i in range(len(x)):\n",
    "        x[i], y[i] = x[i]*math.cos(angle) - y[i]*math.sin(angle), x[i]*math.sin(angle) + y[i]*math.cos(angle)\n",
    "    fig.data[0].x = x\n",
    "    fig.data[0].y = y\n",
    "    fig.data[0].z = z\n",
    "    fig.update_layout()\n",
    "    angle += 0.1\n",
    "    time.sleep(0.1)\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "8a51d2a4-872c-4ec2-8730-4f3f27a98b66",
   "metadata": {},
   "outputs": [],
   "source": [
    "import plotly.graph_objs as go\n",
    "import time\n",
    "import math\n",
    "\n",
    "x=[0, 1, 1, 0, 0, 1, 1, 0]\n",
    "y=[0, 0, 1, 1, 0, 0, 1, 1]\n",
    "z=[0, 0, 0, 0, 1, 1, 1, 1]\n",
    "\n",
    "fig = go.Figure()\n",
    "#     data=[\n",
    "#     go.Scatter3d(x=x, y=y, z=z,\n",
    "#                                    mode='lines',\n",
    "#                                    line=dict(color='black', width=2))\n",
    "# ])\n",
    "fig.show()\n",
    "\n",
    "angle = 0\n",
    "while True:\n",
    "    x=[0, 1, 1, 0, 0, 1, 1, 0]\n",
    "    y=[0, 0, 1, 1, 0, 0, 1, 1]\n",
    "    z=[0, 0, 0, 0, 1, 1, 1, 1]\n",
    "    for i in range(len(x)):\n",
    "        x[i], y[i] = x[i]*math.cos(angle) - y[i]*math.sin(angle), x[i]*math.sin(angle) + y[i]*math.cos(angle)\n",
    "    fig.update_traces(x=x, y=y, z=z)\n",
    "    angle += 0.1\n",
    "    time.sleep(0.1)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "99552d08-26be-4479-b209-5f8285fc0b52",
   "metadata": {},
   "outputs": [],
   "source": [
    "import plotly.graph_objs as go\n",
    "import random\n",
    "\n",
    "x=[0, 1, 1, 0, 0, 1, 1, 0]\n",
    "y=[0, 0, 1, 1, 0, 0, 1, 1]\n",
    "z=[0, 0, 0, 0, 1, 1, 1, 1]\n",
    "\n",
    "# create empty list to store line objects\n",
    "lines = []\n",
    "\n",
    "# loop through x, y, and z coordinates\n",
    "for i in range(len(x)-1):\n",
    "    # generate a random line width\n",
    "    line_width = random.uniform(0, 5)\n",
    "    # create a line object with the current coordinates and random width\n",
    "    line = go.Scatter3d(x=[x[i], x[i+1]], y=[y[i], y[i+1]], z=[z[i], z[i+1]],\n",
    "                       mode='lines',\n",
    "                       line=dict(color='black', width=line_width))\n",
    "    # add the line object to the list of lines\n",
    "    lines.append(line)\n",
    "\n",
    "fig = go.Figure(data=lines)\n",
    "fig.show()\n",
    "fig.show()\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "6f8cb0d8-d2ce-4a51-8b7e-b3b78601829c",
   "metadata": {},
   "outputs": [],
   "source": [
    "import plotly.graph_objs as go\n",
    "import random\n",
    "from IPython.display import display\n",
    "\n",
    "x=[0, 1, 1, 0, 0, 1, 1, 0]\n",
    "y=[0, 0, 1, 1, 0, 0, 1, 1]\n",
    "z=[0, 0, 0, 0, 1, 1, 1, 1]\n",
    "\n",
    "# create empty list to store line objects\n",
    "lines = []\n",
    "\n",
    "# loop through x, y, and z coordinates\n",
    "for i in range(len(x)-1):\n",
    "    # generate a random line width\n",
    "    line_width = random.uniform(0, 5)\n",
    "    # create a line object with the current coordinates and random width\n",
    "    line = go.Scatter3d(x=[x[i], x[i+1]], y=[y[i], y[i+1]], z=[z[i], z[i+1]],\n",
    "                       mode='lines',\n",
    "                       line=dict(color='black', width=line_width))\n",
    "    # add the line object to the list of lines\n",
    "    lines.append(line)\n",
    "\n",
    "fig = go.Figure(data=lines)\n",
    "display(fig)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "ecea0bf6-b84e-4331-ab00-f9ada22e1644",
   "metadata": {},
   "outputs": [],
   "source": [
    "import plotly.subplots as sp\n",
    "import plotly.graph_objs as go\n",
    "import time\n",
    "import math\n",
    "\n",
    "x=[0, 1, 1, 0, 0, 1, 1, 0]\n",
    "y=[0, 0, 1, 1, 0, 0, 1, 1]\n",
    "z=[0, 0, 0, 0, 1, 1, 1, 1]\n",
    "\n",
    "fig = sp.make_subplots(rows=1, cols=1, specs=[[{'type': 'scatter3d'}]])\n",
    "\n",
    "scatter = go.Scatter3d(x=x, y=y, z=z, mode='lines', line=dict(color='black', width=2))\n",
    "fig.add_trace(scatter)\n",
    "fig.show()\n",
    "\n",
    "# update vertex positions in a loop\n",
    "for i in range(10):\n",
    "    scatter.x = [math.sin(i/10)*val for val in scatter.x]\n",
    "    scatter.y = [math.cos(i/10)*val for val in scatter.y]\n",
    "    scatter.z = [math.tan(i/10)*val for val in scatter.z]\n",
    "    time.sleep(0.5)\n",
    "    fig.update_layout(scene_aspectmode='data')\n",
    "    fig.update_traces(scatter)\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "e1d3b94c-9db0-480d-afc7-3d733716a946",
   "metadata": {},
   "outputs": [],
   "source": [
    "import plotly.subplots as sp\n",
    "import plotly.graph_objs as go\n",
    "from plotly.subplots import make_subplots\n",
    "import time\n",
    "import math\n",
    "\n",
    "x=[0, 1, 1, 0, 0, 1, 1, 0]\n",
    "y=[0, 0, 1, 1, 0, 0, 1, 1]\n",
    "z=[0, 0, 0, 0, 1, 1, 1, 1]\n",
    "\n",
    "fig = make_subplots(rows=1, cols=1, specs=[[{'type': 'scatter3d'}]])\n",
    "\n",
    "scatter = go.Scatter3d(x=x, y=y, z=z, mode='lines', line=dict(color='black', width=2))\n",
    "fig.add_trace(scatter)\n",
    "\n",
    "frames = [go.Frame(data=[go.Scatter3d(x=x, y=y, z=z)]) for i in range(10)]\n",
    "\n",
    "for i, frame in enumerate(frames):\n",
    "    frame.data[0].x = [math.sin(i/10)*val for val in x]\n",
    "    frame.data[0].y = [math.cos(i/10)*val for val in y]\n",
    "    frame.data[0].z = [math.tan(i/10)*val for val in z]\n",
    "    \n",
    "fig.frames = frames\n",
    "\n",
    "fig.update_layout(scene_aspectmode='data', updatemenus=[go.layout.Updatemenu(type='buttons', showactive=False, buttons=[go.layout.updatemenu.Button(label='Play', method='animate', args=[None, {'frame': {'duration': 50, 'redraw': True}, 'fromcurrent': True, 'transition': {'duration': 50}}])])])\n",
    "\n",
    "fig.show()\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "da4e6b71-f783-443b-a1e2-c29e884cb892",
   "metadata": {},
   "outputs": [],
   "source": [
    "import plotly.subplots as sp\n",
    "import plotly.graph_objs as go\n",
    "from plotly.subplots import make_subplots\n",
    "from ipywidgets import Button\n",
    "import math\n",
    "\n",
    "x=[0, 1, 1, 0, 0, 1, 1, 0]\n",
    "y=[0, 0, 1, 1, 0, 0, 1, 1]\n",
    "z=[0, 0, 0, 0, 1, 1, 1, 1]\n",
    "\n",
    "fig = make_subplots(rows=1, cols=1, specs=[[{'type': 'scatter3d'}]])\n",
    "\n",
    "scatter = go.Scatter3d(x=x, y=y, z=z, mode='lines', line=dict(color='black', width=2))\n",
    "fig.add_trace(scatter)\n",
    "fig.show()\n",
    "\n",
    "def update_plot(*args, **kwargs):\n",
    "    scatter.x = [math.sin(i/10)*val for val in x]\n",
    "    scatter.y = [math.cos(i/10)*val for val in y]\n",
    "    scatter.z = [math.tan(i/10)*val for val in z]\n",
    "    fig.update_layout(scene_aspectmode='data')\n",
    "    fig.update_traces(scatter)\n",
    "    \n",
    "button = Button(description=\"Update Plot\")\n",
    "button.on_click(update_plot)\n",
    "display(button)\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "3690a27d-e635-409e-b3f5-d4803bbfbd52",
   "metadata": {},
   "outputs": [],
   "source": [
    "import plotly.subplots as sp\n",
    "import plotly.graph_objs as go\n",
    "from plotly.subplots import make_subplots\n",
    "from ipywidgets import Button\n",
    "import math\n",
    "\n",
    "x=[0, 1, 1, 0, 0, 1, 1, 0]\n",
    "y=[0, 0, 1, 1, 0, 0, 1, 1]\n",
    "z=[0, 0, 0, 0, 1, 1, 1, 1]\n",
    "\n",
    "fig = make_subplots(rows=1, cols=1, specs=[[{'type': 'scatter3d'}]])\n",
    "scatter = go.Scatter3d(x=x, y=y, z=z, mode='lines', line=dict(color='black', width=2))\n",
    "fig.add_trace(scatter)\n",
    "\n",
    "def update_plot(*args, **kwargs):\n",
    "    scatter.x = [math.sin(i/10)*val for val in x]\n",
    "    scatter.y = [math.cos(i/10)*val for val in y]\n",
    "    scatter.z = [math.tan(i/10)*val for val in z]\n",
    "    fig.update_layout(scene_aspectmode='data')\n",
    "    fig.update_traces(scatter)\n",
    "    fig.show()\n",
    "    \n",
    "button = Button(description=\"Update Plot\")\n",
    "button.on_click(update_plot)\n",
    "display(button)\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "ff74bb2c-8737-4c8e-a448-57220fbcf3c6",
   "metadata": {},
   "outputs": [],
   "source": [
    "import plotly.subplots as sp\n",
    "import plotly.graph_objs as go\n",
    "from plotly.subplots import make_subplots\n",
    "from ipywidgets import Button\n",
    "import math\n",
    "\n",
    "x=[0, 1, 1, 0, 0, 1, 1, 0]\n",
    "y=[0, 0, 1, 1, 0, 0, 1, 1]\n",
    "z=[0, 0, 0, 0, 1, 1, 1, 1]\n",
    "\n",
    "fig = make_subplots(rows=1, cols=1, specs=[[{'type': 'scatter3d'}]])\n",
    "\n",
    "scatter = go.Scatter3d(x=x, y=y, z=z, mode='lines', line=dict(color='black', width=2))\n",
    "fig.add_trace(scatter)\n",
    "fig.show()\n",
    "\n",
    "def update_plot(*args, **kwargs):\n",
    "    scatter.x = [math.sin(i/10)*val for val in x]\n",
    "    scatter.y = [math.cos(i/10)*val for val in y]\n",
    "    scatter.z = [math.tan(i/10)*val for val in z]\n",
    "    # fig.update_data(scatter)\n",
    "    fig.update_layout(scene_aspectmode='data')\n",
    "    \n",
    "button = Button(description=\"Update Plot\")\n",
    "button.on_click(update_plot)\n",
    "display(button)\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "2a4d9130-1f92-43fe-a4b7-e98be06b0553",
   "metadata": {},
   "outputs": [],
   "source": [
    "import plotly.subplots as sp\n",
    "import plotly.graph_objs as go\n",
    "from ipywidgets import Button\n",
    "import math\n",
    "\n",
    "x=[0, 1, 1, 0, 0, 1, 1, 0]\n",
    "y=[0, 0, 1, 1, 0, 0, 1, 1]\n",
    "z=[0, 0, 0, 0, 1, 1, 1, 1]\n",
    "\n",
    "scatter = go.Scatter3d(x=x, y=y, z=z, mode='lines', line=dict(color='black', width=2))\n",
    "fig = go.Figure(data=scatter)\n",
    "fig.show()\n",
    "\n",
    "def update_plot(*args, **kwargs):\n",
    "    i=rp.random_float()*88\n",
    "    scatter.x = [math.sin(i/10)*val for val in x]\n",
    "    scatter.y = [math.cos(i/10)*val for val in y]\n",
    "    scatter.z = [math.tan(i/10)*val for val in z]\n",
    "    fig.update_layout(scene_aspectmode='data')\n",
    "    fig.update_layout(scene = dict(aspectmode = \"data\"))\n",
    "    \n",
    "button = Button(description=\"Update Plot\")\n",
    "button.on_click(update_plot)\n",
    "display(button)\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "0e63de41-898d-4b8f-b43a-833b7db7ba34",
   "metadata": {},
   "outputs": [],
   "source": [
    "import plotly.subplots as sp\n",
    "import plotly.graph_objs as go\n",
    "from ipywidgets import Button\n",
    "import math\n",
    "\n",
    "x=[0, 1, 1, 0, 0, 1, 1, 0]\n",
    "y=[0, 0, 1, 1, 0, 0, 1, 1]\n",
    "z=[0, 0, 0, 0, 1, 1, 1, 1]\n",
    "\n",
    "scatter = go.Scatter3d(x=x, y=y, z=z, mode='lines', line=dict(color='black', width=2))\n",
    "fig = go.Figure(data=scatter)\n",
    "fig.show()\n",
    "\n",
    "i=0\n",
    "def update_plot(*args, **kwargs):\n",
    "    global i\n",
    "    i+=1\n",
    "    scatter.x = [math.sin(i/10)*val for val in x]\n",
    "    scatter.y = [math.cos(i/10)*val for val in y]\n",
    "    scatter.z = [math.tan(i/10)*val for val in z]\n",
    "    fig.update_layout(scene_aspectmode='data',scene = dict(aspectmode = \"data\"))\n",
    "    \n",
    "button = Button(description=\"Update Plot\")\n",
    "button.on_click(update_plot)\n",
    "display(button)\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "0fba2c40-bbf5-40e4-9b47-d28b131f1777",
   "metadata": {},
   "outputs": [],
   "source": [
    "import plotly.subplots as sp\n",
    "import plotly.graph_objs as go\n",
    "from ipywidgets import Button\n",
    "import math\n",
    "\n",
    "x=[0, 1, 1, 0, 0, 1, 1, 0]\n",
    "y=[0, 0, 1, 1, 0, 0, 1, 1]\n",
    "z=[0, 0, 0, 0, 1, 1, 1, 1]\n",
    "\n",
    "scatter = go.Scatter3d(x=x, y=y, z=z, mode='lines', line=dict(color='black', width=2))\n",
    "fig = go.Figure(data=scatter)\n",
    "d=display(fig,display_id=True)\n",
    "\n",
    "i = 0\n",
    "\n",
    "def update_plot(*args, **kwargs):\n",
    "    global i\n",
    "    scatter.x = [math.sin(i/10)*val for val in x]\n",
    "    scatter.y = [math.cos(i/10)*val for val in y]\n",
    "    scatter.z = [math.tan(i/10)*val for val in z]\n",
    "    i += 1\n",
    "    fig.update_layout(scene_aspectmode='data',scene = dict(aspectmode = \"data\"))\n",
    "    fig.write_html()\n",
    "    \n",
    "    \n",
    "while True:\n",
    "    update_plot()\n",
    "    time.sleep(.4)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "2d4c3843-ef09-4ab8-9760-7686a397d3b6",
   "metadata": {},
   "outputs": [],
   "source": [
    "rp.rinsp(fig)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "97d6fe18-c66a-499d-955a-62dd274f60b8",
   "metadata": {},
   "outputs": [],
   "source": [
    "import plotly.subplots as sp\n",
    "import plotly.graph_objs as go\n",
    "from ipywidgets import Button\n",
    "import math\n",
    "\n",
    "x=[0, 1, 1, 0, 0, 1, 1, 0]\n",
    "y=[0, 0, 1, 1, 0, 0, 1, 1]\n",
    "z=[0, 0, 0, 0, 1, 1, 1, 1]\n",
    "\n",
    "scatter = go.Scatter3d(x=x, y=y, z=z, mode='lines', line=dict(color='black', width=2))\n",
    "fig = go.Figure(data=scatter)\n",
    "fig.show()\n",
    "\n",
    "i = 0\n",
    "\n",
    "def update_plot(*args, **kwargs):\n",
    "    global i\n",
    "    scatter.x = [math.sin(i/10)*val for val in x]\n",
    "    scatter.y = [math.cos(i/10)*val for val in y]\n",
    "    scatter.z = [math.tan(i/10)*val for val in z]\n",
    "    i += 1\n",
    "    fig.update_layout(scene_aspectmode='data',scene = dict(aspectmode = \"data\"))\n",
    "    \n",
    "button = Button(description=\"Update Plot\")\n",
    "button.on_click(update_plot)\n",
    "display(button)\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "55933555-6036-4e49-b281-cdeb6b52fa72",
   "metadata": {},
   "outputs": [],
   "source": [
    "import plotly.subplots as sp\n",
    "import plotly.graph_objs as go\n",
    "from ipywidgets import Button\n",
    "import math\n",
    "\n",
    "x=[0, 1, 1, 0, 0, 1, 1, 0]\n",
    "y=[0, 0, 1, 1, 0, 0, 1, 1]\n",
    "z=[0, 0, 0, 0, 1, 1, 1, 1]\n",
    "\n",
    "scatter = go.Scatter3d(x=x, y=y, z=z, mode='lines', line=dict(color='black', width=2))\n",
    "fig = go.Figure(data=scatter)\n",
    "fig.update_layout(scene = dict(aspectmode='data'), height=600, margin=dict(l=0, r=0, b=0, t=0),\n",
    "                  paper_bgcolor='rgba(1.0,1.0,1.0,.5)',\n",
    "                 )\n",
    "\n",
    "fig.show()\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "b644aa60-8495-4c12-848e-eb66d49a7439",
   "metadata": {},
   "outputs": [],
   "source": [
    "from bokeh.plotting import figure, show\n",
    "from bokeh.models import ColumnDataSource\n",
    "\n",
    "x=[0, 1, 1, 0, 0, 1, 1, 0]\n",
    "y=[0, 0, 1, 1, 0, 0, 1, 1]\n",
    "z=[0, 0, 0, 0, 1, 1, 1, 1]\n",
    "\n",
    "source = ColumnDataSource(data=dict(x=x, y=y, z=z))\n",
    "\n",
    "p = figure(tools=\"pan,box_zoom,reset,save\",\n",
    "           background_fill_color='white')\n",
    "\n",
    "p.scatter(x='x', y='y', z='z',\n",
    "          line_width=2,\n",
    "          source=source)\n",
    "\n",
    "p.xaxis.axis_label = \"X\"\n",
    "p.yaxis.axis_label = \"Y\"\n",
    "p.zaxis.axis_label = \"Z\"\n",
    "\n",
    "show(p)\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "b62c21cd-c41c-49a6-bf5b-ce3374fe1594",
   "metadata": {},
   "outputs": [],
   "source": [
    "rp.pip_import('pyvista')"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "70676c0b-84b7-422a-b1ac-f300a4bad69d",
   "metadata": {},
   "outputs": [],
   "source": [
    "import pyvista as pv\n",
    "\n",
    "x=[0, 1, 1, 0, 0, 1, 1, 0]\n",
    "y=[0, 0, 1, 1, 0, 0, 1, 1]\n",
    "z=[0, 0, 0, 0, 1, 1, 1, 1]\n",
    "\n",
    "points = pv.PolyData(np.c_[x, y, z])\n",
    "scatter = pv.Plotter()\n",
    "scatter.add_mesh(points, color='black', point_size=0.05)\n",
    "scatter.show()\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "a87482d6-e8a3-4c71-b4a3-4b4a42f3c244",
   "metadata": {},
   "outputs": [],
   "source": [
    "%pip install pythreejs"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "7dfbdb25-2cc3-4c6c-aa57-1541005d6ba7",
   "metadata": {},
   "outputs": [],
   "source": [
    "from pythreejs import *\n",
    "import numpy as np\n",
    "\n",
    "x=[0, 1, 1, 0, 0, 1, 1, 0]\n",
    "y=[0, 0, 1, 1, 0, 0, 1, 1]\n",
    "z=[0, 0, 0, 0, 1, 1, 1, 1]\n",
    "\n",
    "scatter = Mesh(geometry=BufferGeometry(attributes=dict(\n",
    "    position=BufferAttribute(np.array(list(zip(x, y, z)))),\n",
    ")),\n",
    "material=PointsMaterial(size=5),\n",
    ")\n",
    "\n",
    "c = PerspectiveCamera(position=[2, 2, 2], fov=20, children=[DirectionalLight(color='white', position=[3, 5, 1], intensity=0.5)])\n",
    "\n",
    "sc = Scene(children=[scatter, c])\n",
    "Renderer(camera=c, scene=sc, controls=[OrbitControls(controlling=c)])\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "94255f61-1c53-4bba-bb03-518d3c436c8e",
   "metadata": {},
   "outputs": [],
   "source": [
    "rp.pip_import( \"ipyvolume\")"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "9d5a63ef-83a1-4cbf-a62e-6b010f42c88f",
   "metadata": {},
   "outputs": [],
   "source": [
    "import ipyvolume as ipv\n",
    "import numpy as np\n",
    "\n",
    "x=[0, 1, 1, 0, 0, 1, 1, 0]\n",
    "y=[0, 0, 1, 1, 0, 0, 1, 1]\n",
    "z=[0, 0, 0, 0, 1, 1, 1, 1]\n",
    "\n",
    "fig = ipv.figure()\n",
    "scatter = ipv.scatter(x, y, z, marker='sphere')\n",
    "ipv.show()"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "a3a24aee-d66a-4e32-ba9d-ef6ddf804967",
   "metadata": {},
   "outputs": [],
   "source": [
    "\n",
    "from IPython.display import display, HTML\n",
    "\n",
    "from IPython.display import HTML\n",
    "display(HTML(\"\"\"\n",
    "<link rel=\"stylesheet\" href=\"https://cdnjs.cloudflare.com/ajax/libs/flickity/2.2.1/flickity.min.css\">\n",
    "<script src=\"https://cdnjs.cloudflare.com/ajax/libs/flickity/2.2.1/flickity.pkgd.min.js\"></script>\n",
    "\"\"\"))\n",
    "\n",
    "\n",
    "def display_carousel(*images):\n",
    "    html = '''\n",
    "    <style>\n",
    "        .carousel {\n",
    "            min-height: 300px;\n",
    "        }\n",
    "    </style>\n",
    "    <div class=\"carousel\" data-flickity>\n",
    "    '''\n",
    "    for image in images:\n",
    "        html += f'<img src=\"{image}\" alt=\"image\">'\n",
    "        # html += f'<img src=\"{image}\" alt=\"image\" crossorigin=\"anonymous\">'\n",
    "    html += '''\n",
    "    </div>\n",
    "    <script>\n",
    "        var carousel = document.querySelector('.carousel');\n",
    "        var flkty = new Flickity( carousel, {\n",
    "            // options\n",
    "            cellAlign: 'left',\n",
    "            contain: true,\n",
    "            prevNextButtons: true,\n",
    "            pageDots: true\n",
    "        });\n",
    "    </script>\n",
    "    '''\n",
    "    display(HTML(html))\n",
    "    \n",
    "images=['https://media.npr.org/assets/img/2022/11/23/russian-toy-2-002--059b8a825dac13f92234d65777e6b29b0914e92f-s1100-c50.jpg',\n",
    "        'https://static01.nyt.com/images/2022/05/10/science/28DOGS-BEHAVIOR1/28DOGS-BEHAVIOR1-mediumSquareAt3X-v2.jpg',\n",
    "        'https://i.guim.co.uk/img/media/fe1e34da640c5c56ed16f76ce6f994fa9343d09d/0_174_3408_2046/master/3408.jpg?width=1200&height=900&quality=85&auto=format&fit=crop&s=0d3f33fb6aa6e0154b7713a00454c83d',\n",
    "       ]\n",
    "\n",
    "display_carousel(*images)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "636e895c-f6d9-4ca6-8a84-2243449ab148",
   "metadata": {},
   "outputs": [],
   "source": [
    "from typing import List, Union, Optional\n",
    "import numpy as np\n",
    "from PIL import Image\n",
    "\n",
    "from IPython.display import HTML\n",
    "display(HTML(\"\"\"\n",
    "<link rel=\"stylesheet\" href=\"https://cdnjs.cloudflare.com/ajax/libs/flickity/2.2.1/flickity.min.css\">\n",
    "<script src=\"https://cdnjs.cloudflare.com/ajax/libs/flickity/2.2.1/flickity.pkgd.min.js\"></script>\n",
    "\"\"\"))\n",
    "\n",
    "def display_carousel(images: List[Union[str, np.ndarray]],\n",
    "                      cell_align: Optional[str] = 'left', \n",
    "                      contain: Optional[bool] = True, \n",
    "                      prev_next_buttons: Optional[bool] = True, \n",
    "                      page_dots: Optional[bool] = True, \n",
    "                      auto_play: Optional[bool] = False, \n",
    "                      auto_play_interval: Optional[int] = 3000, \n",
    "                      wrap_around: Optional[bool] = True):\n",
    "    \"\"\"\n",
    "    This function displays a carousel of images in Jupyter lab. It can take in a list of image sources, \n",
    "    which can be either a string URL or a numpy array. \n",
    "    The function converts numpy arrays to JPEGs using the PIL library and saves them with the notebook. \n",
    "    It also allows for customization of the carousel options such as cell alignment, \n",
    "    whether to contain the cells within the carousel, whether to display previous/next buttons, \n",
    "    whether to display page dots, whether to play the carousel automatically, \n",
    "    the interval at which to play the carousel automatically, and whether to wrap around the carousel.\n",
    "    \n",
    "    Parameters:\n",
    "    - images (List[Union[str, np.ndarray]]): List of image sources, which can be either a string URL or a numpy array.\n",
    "    - cell_align (str, optional): Alignment of cells within the carousel. Defaults to 'left'.\n",
    "    - contain (bool, optional): Whether to contain the cells within the carousel. Defaults to True.\n",
    "    - prev_next_buttons (bool, optional): Whether to display previous/next buttons. Defaults to True.\n",
    "    - page_dots (bool, optional): Whether to display page dots. Defaults to True.\n",
    "    - auto_play (bool, optional): Whether to play the carousel automatically. Defaults to False.\n",
    "    - auto_play_interval (int, optional): Interval at which to play the carousel automatically. Defaults to 3000.\n",
    "    - wrap_around (bool, optional): Whether to wrap around the carousel. Defaults to True.\n",
    "    \n",
    "    Created by Ryan Burgert using ChatGPT\n",
    "    \"\"\"\n",
    "    \n",
    "    html = '''\n",
    "    <style>\n",
    "        .carousel {\n",
    "\n",
    "            overflow: hidden;\n",
    "            min-height: auto;\n",
    "        }\n",
    "    </style>\n",
    "    <div class=\"carousel\" data-flickity>\n",
    "    '''\n",
    "    \n",
    "    \n",
    "    for image in images:\n",
    "        if isinstance(image, str):\n",
    "            html += f'<img src=\"{image}\" alt=\"image\">'\n",
    "        else:\n",
    "            image_jpg = cv2.imencode('.jpg', image)[1]\n",
    "            image_b64 = base64.b64encode(image_jpg)\n",
    "            image_uri = f'data:image/jpg;base64,{image_b64.decode()}'\n",
    "            html += f'<img src=\"{image_uri}\" alt=\"image\">'\n",
    "    \n",
    "    html += f'''\n",
    "    </div>\n",
    "    <script>\n",
    "        var carousel = document.querySelector('.carousel');\n",
    "        var flkty = new Flickity( carousel, {{\n",
    "            // cellAlign: 'left',\n",
    "            // contain: true,\n",
    "            // prevNextButtons: true,\n",
    "            // pageDots: true,\n",
    "            // options\n",
    "            cellAlign: '{cell_align}',\n",
    "            contain: {str(contain).lower()},\n",
    "            prevNextButtons: {str(prev_next_buttons).lower()},\n",
    "            pageDots: {str(page_dots).lower()},\n",
    "            autoPlay: {str(auto_play).lower()},\n",
    "            autoPlayInterval: {auto_play_interval},\n",
    "            wrapAround: {str(wrap_around).lower()}\n",
    "        }});\n",
    "    </script>\n",
    "    '''\n",
    "    display(HTML(html))\n",
    "    \n",
    "    \n",
    "import numpy as np\n",
    "\n",
    "# Generate random numpy arrays as images\n",
    "images = [rp.as_byte_image(np.random.rand(100, 100, 3)) for _ in range(5)]\n",
    "# images=['https://media.npr.org/assets/img/2022/11/23/russian-toy-2-002--059b8a825dac13f92234d65777e6b29b0914e92f-s1100-c50.jpg',\n",
    "#         'https://static01.nyt.com/images/2022/05/10/science/28DOGS-BEHAVIOR1/28DOGS-BEHAVIOR1-mediumSquareAt3X-v2.jpg',\n",
    "#         'https://i.guim.co.uk/img/media/fe1e34da640c5c56ed16f76ce6f994fa9343d09d/0_174_3408_2046/master/3408.jpg?width=1200&height=900&quality=85&auto=format&fit=crop&s=0d3f33fb6aa6e0154b7713a00454c83d',\n",
    "#        ]\n",
    "\n",
    "# Pass the generated images to the display_carousel function\n",
    "display_carousel(images)\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "53235481-a8de-460f-bc1a-18966c9fb747",
   "metadata": {},
   "outputs": [],
   "source": [
    "from typing import List, Union, Optional\n",
    "import numpy as np\n",
    "from PIL import Image\n",
    "\n",
    "from IPython.display import HTML\n",
    "display(HTML(\"\"\"\n",
    "<link rel=\"stylesheet\" href=\"https://cdnjs.cloudflare.com/ajax/libs/flickity/2.2.1/flickity.min.css\">\n",
    "<script src=\"https://cdnjs.cloudflare.com/ajax/libs/flickity/2.2.1/flickity.pkgd.min.js\"></script>\n",
    "\"\"\"))"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "c50a8b33-3a8d-42ad-91d9-624a04935f25",
   "metadata": {},
   "outputs": [],
   "source": [
    "def display_carousel(images: List[Union[str, np.ndarray]],\n",
    "                      cell_align: Optional[str] = 'left', \n",
    "                      contain: Optional[bool] = False, \n",
    "                      prev_next_buttons: Optional[bool] = True, \n",
    "                      page_dots: Optional[bool] = True, \n",
    "                      auto_play: Optional[bool] = False, \n",
    "                      auto_play_interval: Optional[int] = 3000, \n",
    "                      wrap_around: Optional[bool] = True):\n",
    "    \"\"\"\n",
    "    This function displays a carousel of images in Jupyter lab. It can take in a list of image sources, \n",
    "    which can be either a string URL or a numpy array. \n",
    "    The function converts numpy arrays to JPEGs using the PIL library and saves them with the notebook. \n",
    "    It also allows for customization of the carousel options such as cell alignment, \n",
    "    whether to contain the cells within the carousel, whether to display previous/next buttons, \n",
    "    whether to display page dots, whether to play the carousel automatically, \n",
    "    the interval at which to play the carousel automatically, and whether to wrap around the carousel.\n",
    "    \n",
    "    Parameters:\n",
    "    - images (List[Union[str, np.ndarray]]): List of image sources, which can be either a string URL or a numpy array.\n",
    "    - cell_align (str, optional): Alignment of cells within the carousel. Defaults to 'left'.\n",
    "    - contain (bool, optional): Whether to contain the cells within the carousel. Defaults to True.\n",
    "    - prev_next_buttons (bool, optional): Whether to display previous/next buttons. Defaults to True.\n",
    "    - page_dots (bool, optional): Whether to display page dots. Defaults to True.\n",
    "    - auto_play (bool, optional): Whether to play the carousel automatically. Defaults to False.\n",
    "    - auto_play_interval (int, optional): Interval at which to play the carousel automatically. Defaults to 3000.\n",
    "    - wrap_around (bool, optional): Whether to wrap around the carousel. Defaults to True.\n",
    "    \n",
    "    Created by Ryan Burgert using ChatGPT\n",
    "    \"\"\"\n",
    "    id = rp.random_namespace_hash()\n",
    "    html = f'''\n",
    "    <style>\n",
    "        .carousel {{\n",
    "\n",
    "            overflow: hidden;\n",
    "            min-height: calc(auto + 200px);\n",
    "            min-height: 300px;\n",
    "\n",
    "        }}\n",
    "    </style>\n",
    "    <div class=\"carousel\" data-flickity id=\"{id}\">\n",
    "    '''\n",
    "    \n",
    "    for image in images:\n",
    "        if type(image) == str:\n",
    "            html += f'<img src=\"{image}\" alt=\"image\" id=\"{id}\">'\n",
    "        else:\n",
    "            _, buffer = cv2.imencode('.jpg', image)\n",
    "            b64 = base64.b64encode(buffer).decode()\n",
    "            img_uri = f'data:image/jpg;base64,{b64}'\n",
    "            html += f'<img src=\"{img_uri}\" alt=\"image\" id=\"{id}\">'\n",
    "        \n",
    "    html += f'''\n",
    "    <script>\n",
    "        var carousel{id} = document.querySelector('#{id}');\n",
    "        var flkty{id} = new Flickity( carousel{id}, {{\n",
    "            // options\n",
    "            cellAlign: '{cell_align}',\n",
    "            contain: {str(contain).lower()},\n",
    "            prevNextButtons: {str(prev_next_buttons).lower()},\n",
    "            pageDots: {str(page_dots).lower()},\n",
    "            autoPlay: {str(auto_play).lower()},\n",
    "            autoPlayInterval: {auto_play_interval},\n",
    "            wrapAround: {str(wrap_around).lower()}\n",
    "        }});\n",
    "    </script>\n",
    "    '''\n",
    "    display(HTML(html))\n",
    "    \n",
    "    \n",
    "import numpy as np\n",
    "\n",
    "# Generate random numpy arrays as images\n",
    "images = [rp.as_byte_image(np.random.rand(100, 100, 3)) for _ in range(5)]\n",
    "# images=['https://media.npr.org/assets/img/2022/11/23/russian-toy-2-002--059b8a825dac13f92234d65777e6b29b0914e92f-s1100-c50.jpg',\n",
    "#         'https://static01.nyt.com/images/2022/05/10/science/28DOGS-BEHAVIOR1/28DOGS-BEHAVIOR1-mediumSquareAt3X-v2.jpg',\n",
    "#         'https://i.guim.co.uk/img/media/fe1e34da640c5c56ed16f76ce6f994fa9343d09d/0_174_3408_2046/master/3408.jpg?width=1200&height=900&quality=85&auto=format&fit=crop&s=0d3f33fb6aa6e0154b7713a00454c83d',\n",
    "#        ]\n",
    "\n",
    "# Pass the generated images to the display_carousel function\n",
    "display_carousel(images)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "c71e7e7b-04b0-4aa7-899a-2c39f20aaf09",
   "metadata": {},
   "outputs": [],
   "source": [
    "\n",
    "display_carousel(images)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "89b2e2ad-3ccf-45a8-a852-f9674478ca79",
   "metadata": {},
   "outputs": [],
   "source": [
    "display_carousel([x//2 for x in images])"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "a9a10a15-43cc-49cc-a05c-d3e03dd0dd84",
   "metadata": {},
   "outputs": [],
   "source": []
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "7e8a2e88-c4b5-47d5-b15b-01e9a50782ca",
   "metadata": {},
   "outputs": [],
   "source": [
    "from typing import List, Union, Optional\n",
    "import numpy as np\n",
    "from PIL import Image\n",
    "\n",
    "from IPython.display import HTML\n",
    "display(HTML(\"\"\"\n",
    "<link rel=\"stylesheet\" href=\"https://cdnjs.cloudflare.com/ajax/libs/flickity/2.2.1/flickity.min.css\">\n",
    "<script src=\"https://cdnjs.cloudflare.com/ajax/libs/flickity/2.2.1/flickity.pkgd.min.js\"></script>\n",
    "\"\"\"))\n",
    "def display_carousel(images: List[Union[str, np.ndarray]],\n",
    "                      cell_align: Optional[str] = 'left', \n",
    "                      contain: Optional[bool] = False, \n",
    "                      prev_next_buttons: Optional[bool] = True, \n",
    "                      page_dots: Optional[bool] = True, \n",
    "                      auto_play: Optional[bool] = False, \n",
    "                      auto_play_interval: Optional[int] = 3000, \n",
    "                      wrap_around: Optional[bool] = True):\n",
    "    \"\"\"\n",
    "    This function displays a carousel of images in Jupyter lab. It can take in a list of image sources, \n",
    "    which can be either a string URL or a numpy array. \n",
    "    The function converts numpy arrays to JPEGs using the PIL library and saves them with the notebook. \n",
    "    It also allows for customization of the carousel options such as cell alignment, \n",
    "    whether to contain the cells within the carousel, whether to display previous/next buttons, \n",
    "    whether to display page dots, whether to play the carousel automatically, \n",
    "    the interval at which to play the carousel automatically, and whether to wrap around the carousel.\n",
    "    \n",
    "    Parameters:\n",
    "    - images (List[Union[str, np.ndarray]]): List of image sources, which can be either a string URL or a numpy array.\n",
    "    - cell_align (str, optional): Alignment of cells within the carousel. Defaults to 'left'.\n",
    "    - contain (bool, optional): Whether to contain the cells within the carousel. Defaults to True.\n",
    "    - prev_next_buttons (bool, optional): Whether to display previous/next buttons. Defaults to True.\n",
    "    - page_dots (bool, optional): Whether to display page dots. Defaults to True.\n",
    "    - auto_play (bool, optional): Whether to play the carousel automatically. Defaults to False.\n",
    "    - auto_play_interval (int, optional): Interval at which to play the carousel automatically. Defaults to 3000.\n",
    "    - wrap_around (bool, optional): Whether to wrap around the carousel. Defaults to True.\n",
    "    \n",
    "    Created by Ryan Burgert using ChatGPT\n",
    "    \"\"\"\n",
    "    id = rp.random_namespace_hash()\n",
    "    html = f'''\n",
    "    <style>\n",
    "        .carousel {{\n",
    "\n",
    "            min-height: calc(auto + 200px);\n",
    "\n",
    "        }}\n",
    "        \n",
    "        .carousel {{\n",
    "            min-height: auto;\n",
    "            min-height: 300px;\n",
    "        }}\n",
    "        .carousel-wrapper {{\n",
    "            overflow: hidden;\n",
    "        }}\n",
    "    </style>\n",
    "    <div class=\"carousel\" data-flickity id=\"{id}\">\n",
    "    '''\n",
    "    \n",
    "    for image in images:\n",
    "        if type(image) == str:\n",
    "            html += f'<img src=\"{image}\" alt=\"image\" id=\"{id}\">'\n",
    "        else:\n",
    "            _, buffer = cv2.imencode('.jpg', image)\n",
    "            b64 = base64.b64encode(buffer).decode()\n",
    "            img_uri = f'data:image/jpg;base64,{b64}'\n",
    "            html += f'<img src=\"{img_uri}\" alt=\"image\" id=\"{id}\">'\n",
    "        \n",
    "    html += f'''\n",
    "    </div>\n",
    "    <script>\n",
    "        var carousel{id} = document.querySelector('#{id}');\n",
    "        var flkty{id} = new Flickity( carousel{id}, {{\n",
    "            // options\n",
    "            cellAlign: '{cell_align}',\n",
    "            contain: {str(contain).lower()},\n",
    "            prevNextButtons: {str(prev_next_buttons).lower()},\n",
    "            pageDots: {str(page_dots).lower()},\n",
    "            autoPlay: {str(auto_play).lower()},\n",
    "            autoPlayInterval: {auto_play_interval},\n",
    "            wrapAround: {str(wrap_around).lower()}\n",
    "        }});\n",
    "    </script>\n",
    "    '''\n",
    "    display(HTML(html))\n",
    "    \n",
    "    \n",
    "import numpy as np\n",
    "\n",
    "# Generate random numpy arrays as images\n",
    "images = [rp.as_byte_image(np.random.rand(100, 100, 3)) for _ in range(5)]\n",
    "images+=['https://media.npr.org/assets/img/2022/11/23/russian-toy-2-002--059b8a825dac13f92234d65777e6b29b0914e92f-s1100-c50.jpg',\n",
    "        'https://static01.nyt.com/images/2022/05/10/science/28DOGS-BEHAVIOR1/28DOGS-BEHAVIOR1-mediumSquareAt3X-v2.jpg',\n",
    "        'https://i.guim.co.uk/img/media/fe1e34da640c5c56ed16f76ce6f994fa9343d09d/0_174_3408_2046/master/3408.jpg?width=1200&height=900&quality=85&auto=format&fit=crop&s=0d3f33fb6aa6e0154b7713a00454c83d',\n",
    "       ]\n",
    "\n",
    "# Pass the generated images to the display_carousel function"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "91c39f48-b485-45d3-a191-eb28d9646712",
   "metadata": {},
   "outputs": [],
   "source": [
    "\n",
    "display_carousel(images)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "0e47b7a2-e3c7-46d0-a834-a91576e6a6b2",
   "metadata": {},
   "outputs": [],
   "source": [
    "from typing import List, Union, Optional\n",
    "import numpy as np\n",
    "from PIL import Image\n",
    "from io import BytesIO\n",
    "from IPython.display import HTML\n",
    "import base64\n",
    "\n",
    "display(HTML(\"\"\"\n",
    "<link rel=\"stylesheet\" href=\"https://cdnjs.cloudflare.com/ajax/libs/swiper/6.4.5/css/swiper.min.css\">\n",
    "<script src=\"https://cdnjs.cloudflare.com/ajax/libs/swiper/6.4.5/js/swiper.min.js\"></script>\n",
    "\"\"\"))\n",
    "\n",
    "def display_carousel_swipr(images: List[Union[str, np.ndarray]],\n",
    "                      cell_align: Optional[str] = 'left', \n",
    "                      contain: Optional[bool] = False, \n",
    "                      prev_next_buttons: Optional[bool] = True, \n",
    "                      page_dots: Optional[bool] = True, \n",
    "                      auto_play: Optional[bool] = False, \n",
    "                      auto_play_interval: Optional[int] = 3000, \n",
    "                      wrap_around: Optional[bool] = True):\n",
    "    images_html = []\n",
    "    for img in images:\n",
    "        if isinstance(img, np.ndarray):\n",
    "            img = Image.fromarray(np.uint8(img))\n",
    "            img_io = BytesIO()\n",
    "            img.save(img_io, 'JPEG')\n",
    "            img_io.seek(0)\n",
    "            img_url = base64.b64encode(img_io.getvalue()).decode()\n",
    "            images_html.append('<img src=\"data:image/jpeg;base64,{}\">'.format(img_url))\n",
    "        else:\n",
    "            images_html.append('<img src=\"{}\">'.format(img))\n",
    "    carousel_html = '''\n",
    "    <div class=\"carousel\">\n",
    "        {}\n",
    "    </div>\n",
    "    '''.format('\\n'.join(images_html))\n",
    "    return display(HTML(carousel_html))\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "d79ebfc0-a3c5-46b4-9685-71205e4cbf11",
   "metadata": {},
   "outputs": [],
   "source": [
    "display_carousel_swipr(images)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "b9ff5ab3-1437-4a4b-b6cf-765b32ff38ea",
   "metadata": {},
   "outputs": [],
   "source": []
  }
 ],
 "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.8.10"
  }
 },
 "nbformat": 4,
 "nbformat_minor": 5
}