{ "cells": [ { "cell_type": "markdown", "id": "5a3a3e8b-b14d-48f7-9dfc-192df5da60f5", "metadata": {}, "source": [ "# Deno 2 + Jupyter Demo" ] }, { "cell_type": "markdown", "id": "c8daaf0b-b428-4f31-8e53-fa6076da3d8c", "metadata": {}, "source": [ "## Create a chart with observable plot\n", "\n", "https://observablehq.com/plot/" ] }, { "cell_type": "code", "execution_count": 1, "id": "62f2b479-ff39-4123-984f-861ea0119ff6", "metadata": {}, "outputs": [], "source": [ "import * as Plot from \"npm:@observablehq/plot\"" ] }, { "cell_type": "code", "execution_count": 2, "id": "87882fe4-54a2-4b71-9a5b-6036582b79e1", "metadata": {}, "outputs": [], "source": [ "import * as d3 from \"npm:d3\"" ] }, { "cell_type": "code", "execution_count": 3, "id": "7b1633ae-7604-4169-8fdc-9d18eb481949", "metadata": {}, "outputs": [], "source": [ "// Borrowed from https://jsr.io/@ry/jupyter-helper/0.2.0/mod.ts#L6\n", "\n", "// Another option? https://blog.logrocket.com/deno-jupyter-notebook-data-dashboard/\n", "\n", "import { DOMParser } from \"npm:linkedom@0.18\";\n", "\n", "const document: any = new DOMParser().parseFromString(\n", " ``,\n", " \"text/html\",\n", ");" ] }, { "cell_type": "code", "execution_count": 4, "id": "26cf1e00-0ff3-4593-a4dc-1a45ab855f55", "metadata": {}, "outputs": [ { "data": { "image/svg+xml": [ "0100200300400500600700↑ Frequency−3−2−101234" ] }, "execution_count": 4, "metadata": {}, "output_type": "execute_result" } ], "source": [ "Plot.rectY({length: 10000}, Plot.binX({y: \"count\"}, {x: d3.randomNormal(), fill: \"blue\"})).plot({ document })" ] }, { "cell_type": "markdown", "id": "fd9d0b73-8fff-43c1-bed7-37b669df1f6c", "metadata": {}, "source": [ "## Use a Polars DataFrame" ] }, { "cell_type": "code", "execution_count": 5, "id": "7fa4515e-f131-498d-a3ee-908c93892e52", "metadata": {}, "outputs": [], "source": [ "import pl from \"npm:nodejs-polars@0.14\";" ] }, { "cell_type": "code", "execution_count": 6, "id": "3ee7f72e-bd22-40d1-b066-bfb31ec0721a", "metadata": {}, "outputs": [], "source": [ "const df = pl.DataFrame(\n", "{\n", " A: [1, 2, 3, 4, 5],\n", " fruits: [\"banana\", \"banana\", \"apple\", \"apple\", \"banana\"],\n", " B: [5, 4, 3, 2, 1],\n", " cars: [\"beetle\", \"audi\", \"beetle\", \"beetle\", \"beetle\"],\n", " }\n", ")" ] }, { "cell_type": "code", "execution_count": 7, "id": "302854c2-6368-4762-9732-ec826f4fffc0", "metadata": {}, "outputs": [ { "data": { "application/vnd.dataresource+json": { "bytes": null, "data": [ { "A": 1, "B": 5, "cars": "beetle", "fruits": "banana" }, { "A": 2, "B": 4, "cars": "audi", "fruits": "banana" }, { "A": 3, "B": 3, "cars": "beetle", "fruits": "apple" }, { "A": 4, "B": 2, "cars": "beetle", "fruits": "apple" }, { "A": 5, "B": 1, "cars": "beetle", "fruits": "banana" } ], "description": null, "dialect": null, "encoding": null, "format": null, "hash": null, "homepage": null, "licenses": null, "mediatype": null, "path": null, "schema": { "fields": [ { "constraints": null, "description": null, "example": null, "format": null, "name": "A", "rdfType": null, "title": null, "type": "number" }, { "constraints": null, "description": null, "example": null, "format": null, "name": "fruits", "rdfType": null, "title": null, "type": "string" }, { "constraints": null, "description": null, "example": null, "format": null, "name": "B", "rdfType": null, "title": null, "type": "number" }, { "constraints": null, "description": null, "example": null, "format": null, "name": "cars", "rdfType": null, "title": null, "type": "string" } ], "foreignKeys": null, "missingValues": null, "primaryKey": null }, "sources": null, "title": null }, "text/html": [ "
AfruitsBcars
1banana5beetle
2banana4audi
3apple3beetle
4apple2beetle
5banana1beetle
" ] }, "execution_count": 7, "metadata": {}, "output_type": "execute_result" } ], "source": [ "df" ] }, { "cell_type": "code", "execution_count": 8, "id": "a04e4f7b-1487-4d86-9ef8-5a286e71379c", "metadata": {}, "outputs": [ { "data": { "text/plain": [ "\u001b[33m3\u001b[39m" ] }, "execution_count": 8, "metadata": {}, "output_type": "execute_result" } ], "source": [ "df['A'].mean()" ] }, { "cell_type": "markdown", "id": "3cbd5e74-f21c-4778-ad9b-b261ea01f175", "metadata": {}, "source": [ "## Render HTML Output" ] }, { "cell_type": "code", "execution_count": 9, "id": "2669a807-76b2-47a1-a671-a0f744547130", "metadata": {}, "outputs": [ { "data": { "text/html": [ "" ] }, "execution_count": 9, "metadata": {}, "output_type": "execute_result" } ], "source": [ "// From : https://docs.deno.com/runtime/reference/cli/jupyter/#examples\n", "Deno.jupyter.html``;" ] }, { "cell_type": "markdown", "id": "94278fef-106f-4818-95ca-eb042070227e", "metadata": {}, "source": [ "## Render SVG Output" ] }, { "cell_type": "code", "execution_count": 10, "id": "7b164ab8-6cd2-4331-a769-d47d9e73c368", "metadata": {}, "outputs": [ { "data": { "image/svg+xml": [ "\n", " \n", "\n" ] }, "execution_count": 10, "metadata": {}, "output_type": "execute_result" } ], "source": [ "// From HeroIcons : https://heroicons.com/\n", "Deno.jupyter.svg`\n", " \n", "\n", "`;" ] }, { "cell_type": "markdown", "id": "c5edb011-5295-4577-9b88-ba0ce5cd8f3e", "metadata": {}, "source": [ "## Mermaid Chart?" ] }, { "cell_type": "code", "execution_count": 11, "id": "6769125f-dc6f-496f-bbd3-35e023eb1058", "metadata": {}, "outputs": [ { "ename": "TypeError", "evalue": "[ERR_MODULE_NOT_FOUND] Cannot find module 'file:///Users/aaronblondeau/Library/Caches/deno/npm/registry.npmjs.org/khroma/2.1.0/dist/channels/utils/index.js' imported from 'file:///Users/aaronblondeau/Library/Caches/deno/npm/registry.npmjs.org/khroma/2.1.0/dist/channels//index.js'", "output_type": "error", "traceback": [ "Stack trace:", "TypeError: [ERR_MODULE_NOT_FOUND] Cannot find module 'file:///Users/aaronblondeau/Library/Caches/deno/npm/registry.npmjs.org/khroma/2.1.0/dist/channels/utils/index.js' imported from 'file:///Users/aaronblondeau/Library/Caches/deno/npm/registry.npmjs.org/khroma/2.1.0/dist/channels//index.js'", " at async :1:53" ] } ], "source": [ "import mermaid from 'npm:mermaid'" ] }, { "cell_type": "markdown", "id": "8b33d244-55bc-4646-9c36-c8f70c3afc9f", "metadata": {}, "source": [ "**:-( Deno strikes again : https://github.com/denoland/deno/issues/9427**" ] }, { "cell_type": "code", "execution_count": null, "id": "269fa154-252e-44a5-83f2-adbbb9ecfd38", "metadata": {}, "outputs": [], "source": [] } ], "metadata": { "kernelspec": { "display_name": "Deno", "language": "typescript", "name": "deno" }, "language_info": { "codemirror_mode": "typescript", "file_extension": ".ts", "mimetype": "text/x.typescript", "name": "typescript", "nbconvert_exporter": "script", "pygments_lexer": "typescript", "version": "5.6.2" } }, "nbformat": 4, "nbformat_minor": 5 }