using d3 in anywidget

[cornhundred]

Hi, does anyone know how I could go about using d3 in the anywidget Python widget library? It is possible to import external libraries like this

see Google Colab notebook example

import anywidget

class ConfettiWidget(anywidget.AnyWidget):
    _esm = """
    import confetti from "https://esm.sh/canvas-confetti@1.6";

    export function render({ model, el }) {
      let btn = document.createElement("button");
      btn.classList.add("confetti-button");
      btn.innerHTML = "click me!";
      btn.addEventListener("click", () => {
        confetti();
      });
      el.appendChild(btn);
    }
    """
    _css="""
    .confetti-button { background-color: #ea580c; }
    .confetti-button:hover { background-color: #9a3412; }
    """

ConfettiWidget()

and deck.gl like this

import anywidget
import traitlets

# class DeckWidget(anywidget.AnyWidget):
#     import anywidget



class DeckWidget(anywidget.AnyWidget):
    _esm = """
    import { Deck, ScatterplotLayer } from 'https://esm.sh/deck.gl@8.9.21?bundle';
    export function render({ model, el }) {
        let root = document.createElement("div");
        root.style.height = "800px";
        let deck = new Deck({
          parent: root,
          controller: true,
          initialViewState: { longitude: -122.45, latitude: 37.8, zoom: 15 },
          layers: [
            new ScatterplotLayer({
              data: [{ position: [-122.45, 37.8], color: [255, 0, 0], radius: 100}],
              getFillColor: d => d.color,
              getRadius: d => d.radius,
              pickable: true,
              onClick: d => console.log('hi hi hi', d)
            })
          ],
        });
        el.appendChild(root);
        return () => deck.finalize();
    }
    """

DeckWidget()

[cornhundred]

The solution is

import anywidget

class D3Widget(anywidget.AnyWidget):
    _esm = """

    import * as d3 from "https://esm.sh/d3@7";

    export function render({ model, el }) {

    console.log('something')
    console.log(d3)

    }
    """
    _css="""
    """

D3Widget()

from here manzt/anywidget#191