Skip to content

GenieFramework/StipplePlotly.jl

Folders and files

NameName
Last commit message
Last commit date

Latest commit

author
hhaensel
Jan 30, 2025
b168f89 · Jan 30, 2025
Feb 17, 2024
Oct 7, 2024
Oct 30, 2023
Jan 2, 2025
Oct 7, 2024
May 29, 2024
Aug 24, 2022
Jan 19, 2021
Jan 30, 2025
Oct 7, 2024

Repository files navigation

StipplePlotly

Embedding Plotly Charts in Stipple.

News: The standard API is now PlotlyBase, the StipplePlotly API is considered legacy.

Example with forwarding of plotly events

See the docstrings of watchplots() and watchplot() for more details!

using Stipple, Stipple.ReactiveTools
using StipplePlotly
using PlotlyBase

@app Example begin
    @mixin plot::PBPlotWithEvents
    @in plot_cursor = Dict{String, Any}()

    @onchange isready begin
        isready || return
        p = Plot(scatter(y=1:10))
        plot.layout = p.layout
        plot.data = p.data
    end

    @onchange plot_selected begin
        haskey(plot_selected, "points") && @info "Selection: $(getindex.(plot_selected["points"], "pointIndex"))"
    end

    @onchange plot_click begin
        @info "$plot_click"
    end

    @onchange plot_hover begin
        @info "hovered over $(plot_hover["points"][1]["x"]):$(plot_hover["points"][1]["y"])"
        # @info "$plot_hover"
    end

    @onchange plot_cursor begin
        @info "cursor moved to $(plot_cursor["cursor"]["x"]):$(plot_cursor["cursor"]["y"])"
        # @info "$plot_cursor"
    end
end

# commented lines below: manual definition of plot_events
# @app Example begin
#     @in plot = Plot()
#     @in plot_selected = Dict{String, Any}()
#     @in plot_click = Dict{String, Any}()
#     @in plot_hover = Dict{String, Any}()
#     @in plot_cursor = Dict{String, Any}()
# end

@mounted Example watchplots()

# the keyword argument 'keepselection' (default = false) controls whether the selection outline shall be removed after selection
function ui()
    cell(class = "st-module", [
        plotly(:plot, syncevents = true, keepselection = false),
    ])
end

@page("/", ui, model = Example)

Possible forwarded events are

  • '_selected' (Selection changed)
  • '_hover' (hovered over data point)
  • '_click' (click event on plot area)
  • '_relayout' (plot layout changed)
  • '_cursor' (current mouse position, not covered in PBPlotWithEvents in order to reduce data traffic)

For more Stipple Plotly Demos please check: Stipple Demos Repo

Acknowledgement

Handling of Plotly Events was highly inspired by the PlotlyJS package by Spencer Lyon