Skip to content

Instantly share code, notes, and snippets.

@sglyon
Last active May 15, 2021 18:55
Show Gist options
  • Save sglyon/4e85aa915b30586bddf2c0249e94a58b to your computer and use it in GitHub Desktop.
Save sglyon/4e85aa915b30586bddf2c0249e94a58b to your computer and use it in GitHub Desktop.
PlotlyJS.jl slider example
using PlotlyJS
# set up data
na = 10
nw = 5
zz = rand(1:4, na, nw, nw)
text = similar(zz, String)
text[zz .== 1] = "stay, work"
text[zz .== 2] = "move, work"
text[zz .== 3] = "stay, quit"
text[zz .== 4] = "move, quit"
agrid = linspace(0, 5, na)
wgrid = linspace(0, 1, nw)
# construct sliders inside the layout
layout = Layout(
sliders=[attr(
steps=[
attr(
label=round(agrid[i], 3),
method="restyle",
args=[attr(z=(zz[i, :, :],), text=(text[i, :, :],)), 0]
)
for i in 1:na
],
active=1,
currentvalue_prefix="Assets: ",
pad_t=40
)],
xaxis_title="zh",
yaxis_title="zf",
title="Discrete policy"
)
# we only have one trace -- a headmap for z
a0 = round(Int, na/2)
t = heatmap(
z=zz[a0, :, :],
x=wgrid,
y=wgrid,
colorscale="Blues",
colorbar=attr(
ticks="outside",
tickvals=1:4,
ticktext=["(N, Y)", "(Y,Y)", "(N,N)", "(Y,N)"],
title="(move, work)",
),
text=text[a0, :, :],
hoverinfo="all",
name="Discrete policy",
)
p = plot(t, layout)
@alexlenail
Copy link

alexlenail commented May 14, 2021

Cool! This isn't a self-contained example sadly:

UndefVarError: z not defined  (line 8)

@sglyon
Copy link
Author

sglyon commented May 14, 2021

good catch -- changed the z to zz. Hopefully it works! (no promises though -- it is 4 years old!)

@alexlenail
Copy link

alexlenail commented May 15, 2021

Alas no. Did you follow any documentation at all for this? This is the only thing google served me for "Julia plotly slider"

@alexlenail
Copy link

alexlenail commented May 15, 2021

For future folks, here is the plot I wanted:

using PlotlyJS

f(x, y) = x^2 + 2y^2

x = 6

xlim=[-10, x]
ylim=[-10, 10]

xs = LinRange(xlim..., 101)
ys = LinRange(ylim..., 101)
zs = [f(x, y) for x in xs, y in ys]

y = 4
dy = 4
f_y(y) = 4y

traces = GenericTrace[]

push!(traces, PlotlyJS.surface(x=xs, y=ys, z=zs, 
        visible=true, showscale=false, opacity=0.8))
push!(traces, PlotlyJS.surface(x=[x, x+0.001], y=ylim, z=[[maximum(zs), minimum(zs)] [maximum(zs), minimum(zs)]], 
        visible=true, showscale=false, color="grey", opacity=0.3))
push!(traces, PlotlyJS.scatter3d(x=fill(x, size(ys)), y=ys, z=[x^2 + 2y^2 for y in ys], 
        visible=true, showlegend=false, mode="lines", line=attr(color="red", width=2)))

for y in ys
    push!(traces, PlotlyJS.scatter3d(x=fill(x, 2),y=[y-dy, y+dy], z=[f(x,y)-f_y(y)*dy, f(x,y)+f_y(y)*dy], 
            mode="lines", visible=false, showlegend=false, line=attr(color="orange", width=5)))
end

layout = Layout(
    sliders=[attr(
        steps=[
            attr(
                label=round(y, digits=2),
                method="update",
                args=[attr(visible=[fill(true, 3); fill(false, i-1); true; fill(false, 101-i)])]
            )
            for (i, y) in enumerate(ys)
        ],
        active = y,
        currentvalue_prefix="x = 6, y = ",
    )],
    scene = attr(
        xaxis = attr(range=[-10,10]),
        yaxis = attr(range=[-10,10]),
        zaxis = attr(range=[0,300])
    ),
)

p = PlotlyJS.plot(traces, layout)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment