Interactive plot in Jupyter notebook with Deno kernel #22467

vwkd · 2024-02-18T21:11:11Z

vwkd
Feb 18, 2024

How can I make an interactive plot in a Jupyter notebook with Deno kernel?

For example, using Observable Plot similar to the blog post Deno in 2023.

import * as Plot from "npm:@observablehq/plot";
import { DOMParser } from "npm:linkedom";

const document = new DOMParser().parseFromString(
  `<!DOCTYPE html><html lang="en"></html>`,
  "text/html",
);

const data = [
  {x: 0, y: 0},
  {x: 1, y: 1},
  {x: 2, y: 2},
  {x: 3, y: 3},
  {x: 4, y: 4},
  {x: 5, y: 5},
]

const plot = Plot.plot({
  document,
  marks: [
    Plot.line(data, { x: "x", y: "y", /* tip: true */ }),
  ],
}).toString();

const display = {
  [Symbol.for("Jupyter.display")]() {
    return {
      "image/svg+xml": plot,
    };
  },
};

display;

Trying to set the interactive tip option throws an error.

Stack trace:
TypeError: Cannot set property eventPhase of #<Event> which has only a getter
    at SVGElement.dispatchEvent (file:///Users/username/Library/Caches/deno/npm/registry.npmjs.org/linkedom/0.16.8/esm/interface/event-target.js:72:22)
    at Object.context.dispatchValue (file:///Users/username/Library/Caches/deno/npm/registry.npmjs.org/@observablehq/plot/0.6.13/src/plot.js:178:12)
    at render (file:///Users/username/Library/Caches/deno/npm/registry.npmjs.org/@observablehq/plot/0.6.13/src/interactions/pointer.js:129:59)
    at Tip.<anonymous> (file:///Users/username/Library/Caches/deno/npm/registry.npmjs.org/@observablehq/plot/0.6.13/src/interactions/pointer.js:182:14)
    at Tip.render (file:///Users/username/Library/Caches/deno/npm/registry.npmjs.org/@observablehq/plot/0.6.13/src/mark.js:144:15)
    at Module.plot (file:///Users/username/Library/Caches/deno/npm/registry.npmjs.org/@observablehq/plot/0.6.13/src/plot.js:287:25)
    at <anonymous>:30:19

deno 1.40.2
VSCode 1.86.2
VSCode Jupyter extension v2024.1.1

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Interactive plot in Jupyter notebook with Deno kernel #22467

{{title}}

{{editor}}'s edit

{{editor}}'s edit

Replies: 0 comments

Select a reply

Interactive plot in Jupyter notebook with Deno kernel #22467

vwkd Feb 18, 2024

Replies: 0 comments

vwkd
Feb 18, 2024