I am trying to add static points to a plotly plot with sliders, with each static point having a vertical line to the sliding function line, to display what cost in regression looks like. How would I do this?
I have tried different methods of adding the points, but the points end up disappearing, I believe because of the update slider method, or moving with the y intercept slider, that is using the update method.
@cost_bp.route('/page1')
def costpage1():
# Create figure
fig = go.Figure()
# Add traces, one for each slider step
for weight in np.arange(-5, 5, 0.25):
fig.add_trace(
go.Scatter(
visible=False,
line=dict(color="#00CED1", width=2),
x=np.arange(0, 10, 0.01),
y=weight * np.arange(0, 10, 0.01)
)
)
# Make 1st trace visible
fig.data[10].visible = True
# Create and add slider
weight_steps = []
for i, wval in enumerate(np.arange(-5, 5, 0.25)):
step = dict(
method="update",
args=[{"visible": [i == j for j in range(len(fig.data))]}],
label=f"{wval}"
)
step["args"][0]["visible"][i] = True # Toggle i'th trace to "visible"
weight_steps.append(step)
weight_slider = dict(
active=30,
currentvalue={"prefix": "Slope(w): "},
pad={"t": 50},
steps=weight_steps,
tickwidth=.5,
len=.5,
x=.5
)
yint_steps = []
for i, bval in enumerate(np.arange(0, 8, .25)):
y_values = [weight * np.arange(0, 10, 0.01) + bval for weight in np.arange(-5, 5, 0.25)]
step = dict(
method="restyle", # Use "restyle" method to update traces
args=["y", y_values], # Update y-values based on the selected y-intercept
label=f"{bval}"
)
yint_steps.append(step)
yint_slider = dict(
active=5,
currentvalue={"prefix": "Y-Intercept(b): "},
pad={"t": 50},
steps=yint_steps,
tickwidth=.5,
len=.5,
x=0
)
sliders = [weight_slider, yint_slider]
static_points = [
dict(
x=0,
y=0,
mode="lines",
line=dict(color="#00CED1", width=2),
name="Origin"
),
dict(
x=10,
y=0,
mode="lines",
line=dict(color="#00CED1", width=2),
name="X-Axis"
),
dict(
x=0,
y=8,
mode="lines",
line=dict(color="#00CED1", width=2),
name="Y-Axis"
)
]
fig.update_layout(
title="Updatable Linear Function",
template='simple_white',
sliders=sliders,
xaxis=dict(range=[0,10], dtick=1, showgrid=True),
yaxis=dict(range=[0,8], dtick=1, showgrid=True),
width=900, height=600,
static_points=static_points
)
graph = fig.to_html()
return render_template('cost/page1.html', prev_page='page3', next_page='page2', graph=graph)