plotly のダッシュを使用して、グラフとマップ (mapbox に基づく) の 2 つのウィジェットを含む単純なダッシュボードを作成しようとしています。グラフのデータ ポイントとマップ上の位置は相互に接続されており、ユーザーのマウスがグラフ上の関連するポイントの上に置かれたときに、マップ上の関連するドットを強調表示したいと考えています。
次のレイアウトでダッシュのコールバックを使用してみました:
app = dash.Dash()
app.layout = html.Div(children=[
html.H1(children='Hello Dash'),
html.Div(children='''
Dash: A web application framework for Python.
''', id='xxx'),
dcc.Graph(
id='example-graph',
figure=sl.draw_graph('Altitude')
),
dcc.Graph(
id='example-map',
figure=sl.draw_map()
),
])
そして、次のコールバック:
@app.callback(
Output('example-map', 'figure'),
[Input('example-graph', 'hoverData')])
def display_hover_data(hoverData):
figure = app.layout['example-map'].figure
figure['data'].append(get_new_highlighted_dot(hoverData))
return figure
古い強調表示されたドットを削除する必要があることを認識していることに注意してください-しかし、それはここでのポイントではありません.
これで問題は解決しますが、マップボックスの図を常に再読み込みする必要があり、ユーザー エクスペリエンスが損なわれます。私が望むのは、図全体をリロードせずにマップ内のトレースを変更することです。
図全体をリロードせずにデータのみを更新できるモジュールを使用してみましたmydcc
が、マップ上に何千ものトレースがある場合でも動作が遅くなります。
とにかくこの問題を克服する方法があるかどうか疑問に思っていましたか? また、他の同様の Python ベースのテクノロジを使用することにもオープンです。