Observable JS Plot error in quarto document: Plot.pointerX is not a function

[rogerjbos]

I have a question about using Observable JS functions in quarto documents. I have been looking at the Observables website for examples, but I am having trouble getting some of them to run in a quarto doc (as opposed to in an Observerables notebook). It sounds like it should be possible, but in this small example I am getting an error TypeError: Plot.pointerX is not a function:

Plot.plot({
  height: 160,
  y: {axis: "right", grid: true, nice: true},
  marks: [
    Plot.lineY(aapl, {x: "Date", y: "Close", fy: d => (d.Close % 2) === 0}),
    Plot.ruleX(aapl, Plot.pointerX({x: "Date", py: "Close", fy: d => (d.Close % 2) === 0, stroke: "red"})),
    Plot.dot(aapl, Plot.pointerX({x: "Date", y: "Close", stroke: "red"})),
    Plot.text(aapl, Plot.pointerX({px: "Date", py: "Close", dy: -17, frameAnchor: "top-left", fontVariant: "tabular-nums", text: (d) => [`Date ${Plot.formatIsoDate(d.Date)}`, `Close ${d.Close.toFixed(2)}`].join("   ")}))
  ]
})

Does anyone know how to make this example work?

[cderv]

Could you asked your question at quarto-dev/quarto-cli · Discussions · GitHub ?

There will be more Quarto user, and especially Observable JS one that could help ? The Discussion board is also monitored by all Devs, including the one knowing the more ojs feature.

[rogerjbos]

Thanks for that. I actually came across the solution. pointerX is a new feature, so you have to import a newer version of the Plot library. You can do so easily like this:

Plot = import("https://esm.sh/@observablehq/plot")

Hope this helps others. Quarto + OJS is pretty neat!