Animation and animation buttons not showing up in Julia Dash webpage

Dash R, MATLAB, Julia
1

I wrote a simple webpage demo with Plotly Dash for Julia, using a Plotly Animation. I provided the simple code below. I emulated an example.

In the code below, the static plots show up, but the animation does not seem to work, and I don’t see the “Animate” button as I should see–according to the code below. I was wondering if anyone could figure out what was missing? I followed the example link very closely, so not sure what the problem is. Also, the web page is not producing any errors.

I was hoping someone might identify the problem in the code below. Or if there is no error, then please let me know so that I can open an issue with the Dash developers.


using Dash, Printf, PlotlyJS

app = dash()
app.layout = html_div() do
    html_div(html_button("Plot", id="b1")),
    html_div(dcc_graph(id="g1"))
end


callback!(
    app,
    Output("g1", "figure"),
    Input("b1", "n_clicks")
) do nc

    N=200
    xs1 = LinRange(0, 35, N)
    ys1 = sin.(xs1)
    ys2 = cos.(xs1)
    ys3 = sin.(2 .* xs1) 

    trace1 = scatter(x = xs1,  
                y = ys1,
                mode="lines",
                line_width=1.5,
                line_color="RoyalBlue")
    
    trace2 = scatter(x = xs1,  
                y = ys2,
                mode="lines",
                line_width=1.5)
    
    trace3 = scatter(x = xs1,  
                y = ys3,
                mode="lines",
                line_width=1.5)
    
    # animations 

    frames = PlotlyFrame[]

    x_inc = LinRange(0, 8*pi, N)
    
    for i in eachindex(x_inc)
        b = sin(x_inc[i])

        new_frame = scatter(; x = xs1, y = ys1 .+ b, mode="lines")
        push!(frames, frame(name="a$(i)", data = [new_frame]))
    end

    layout = Layout(;
        yaxis_range = [-5, 10],
        xaxis_type = "linear",
        xaxis_title = "timesteps",
        yaxis_title = "score",
        title="Optimization Example",
        legend_x = 1,
        legend_y = 1,
        hovermode = "closest",
        hoverlabel=(font=(size=10,),font_family="Rockwell"),
        transition_duration = 5,
        updatemenus=[
            (   visible=true,
                type="buttons",
                buttons=[(label="Animate", method="animate", args=[nothing])]
            )
        ]
    )

    return Plot([trace1, trace2, trace3], layout, frames) 

end;



run_server(app, "0.0.0.0", 8106, debug=true)