Dash: реализация обратного вызова выделения трассировки

У меня есть базовое приложение для тире со следующим app.py файлом:

import dash
import dash_core_components as dcc
import dash_html_components as html
import plotly.graph_objects as go

def generate_plot():
    fig = go.Figure()
    fig.add_trace(go.Scatter(x=[1, 2, 3], y=[1, 2, 3], name="A", line={"width": 1}))
    fig.add_trace(go.Scatter(x=[1, 2, 3], y=[1, 3, 5], name="B", line={"width": 1}))
    return fig

app = dash.Dash(__name__)
app.layout = html.Div(children=[
    html.H1(children="title", className="title"),
    dcc.Graph(figure=generate_plot(), className="plot")
])

Хочу выделить (увеличить ширину линии до 5) след при наведении курсора. Пока что я нашел способ добиться этого в записной книжке Jupyter, используя объект go.FigureWidget вместо go.Figure (см. эта ссылка для получения дополнительной информации), однако в Dash это не работает. Если у кого-то есть идеи, как добиться желаемого эффекта, дайте нам знать.

Большое спасибо.


python javascript plotly-dash data-visualization plotly
person IVR    schedule 30.03.2020    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Думаю, мне удалось решить половину проблемы.

Во-первых, если вы используете метод для создания фигуры, вам необходимо сохранить ее в отдельный объект:

my_plot = generate_plot()

Во-вторых, вам нужно дать вашей фигуре идентификатор:

dcc.Graph(figure=my_plot, id="my_plot")

В-третьих, вам нужно добавить app.callback вот так:

@app.callback(
    dash.dependencies.Output("my_plot", "figure"),
    [dash.dependencies.Input("my_plot", "hoverData")]
)
def highlight_trace(hover_data):
    # here you set the default settings
    for trace in my_pot.data:
        country["line"]["width"] = 1
        country["opacity"] = 0.5
    if hover_data:
        trace_index = hover_data["points"][0]["curveNumber"]
        my_plot.data[trace_index]["line"]["width"] = 5
        my_plot.data[trace_index]["opacity"] = 1
    return my_plot

Это выделит трассу при наведении, но сбросит ее состояние только при наведении курсора на другую трассу (что может быть предполагаемым поведением в некоторых случаях). Я до сих пор не придумал, как сбросить внешний вид следа, если вы не наводите на него курсор, поэтому, если у вас есть какие-либо предложения по этому поводу, сообщите нам, до тех пор я буду считать этот вопрос без ответа < / сильный>

ИЗМЕНИТЬ

Хорошо, я понял, как сбросить эффекты наведения: просто добавьте параметр clear_on_hover, например: dcc.Graph(figure=my_plot, id="my_plot", clear_on_hover=True)

Большое спасибо

person IVR    schedule 31.03.2020