PlotlyDemoPackage.jl

This (unregisted) package demonstates how you can expose Plotly in a Julia package, in a way that works reliably in all Julia programming environments.

How to use

See [How to test plotly.md](How to test plotly.md) for examples in each environment.

In short:

begin
    import Pkg
    Pkg.activate(temp=true)
    Pkg.add([
        Pkg.PackageSpec(
            url="https://github.com/JuliaPluto/PlotlyDemoPackage.jl", # fill in package URL
            rev="main", # fill in branch name here
        ),
    ])
    using Plots
end

plot(1:10, rand(10))

This demo package only supports:

plot(x::Vector, y::Vector)

Offline mode

By default, plots get JS assets from the jsdelivr CDN. To use offline mode, set PlotlyDemoPackage.use_cdn[] = false and re-display a plot.

Used technologies

Notable are:

• No requireJS (it has been deprecated/abandoned for a long time)
• <script type="module"> for top-level await
• E6 dynamic import to dynamically load libraries or not, depending on what is already loaded. E.g. Pluto and Jupyter preload MathJax.
• top-level await to avoid redundant work when rendering multiple plots at the same time.
• Julia Artifacts to make the JS assets available in a very reliable way.
• No Pkg build step for reliability
• Data URL (using Base64) to make the local JS assets available without relying on file server dynamics.

Environment support

It works in all environments!

In Jupyter

In Pluto

In VS Code notebooks

In VS Code results

In the web

You can write the HTML repr to a file and open it in a browser:

p = plot(1:100, rand(100))

write("/Users/fons/Downloads/test.html", repr(MIME"text/html"(), p))

This HTML snippet also works when embedded in a larger page. This is done in:

• Documenter.jl
• Genie.jl
• Franklin.jl
• Weave.jl
• etc

It works regardless of whether Plotly and MathJax are already loaded.

Pluto optimizations (not in this package)

Using specific API for Pluto, we could make the experience even better in Pluto. Right now, this is not done for simplicity. What would be added:

• AbstractPlutoDingetjes.Display.published_to_js for:
  • offline support without performance penalty.
  • displaying large amounts of data more quickly.
• AbstractPlutoDingetjes.Display.is_inside_pluto to display different content when rendered in a Pluto(-compatible) display.
• Plotly.react and some of Pluto's JS API to dynamically update plots when the data changes, for ultra-fast updates without layout shift.

These technologies are used in the https://github.com/JuliaPluto/PlutoPlotly.jl package, but it would be nice to make some of it available by default in other plotting package.