Scattermapbox figure doesn't render correct bounds in my dash app
Personne n'a encore pris cette issue.
- Langage dominant
- Python
- Étoiles
- 18.8k
- Forks
- 2.8k
- Merge moyen
- 16 h 26 min
- PR mergées (30 j)
- 21
Description
I wrote a very simple Dash app in Python that allows the user to select either "Denver" or "London" from a dropdown list. A point is then plotted on a map below the dropdown showing that city. When I run this code, the map does not show the appropriate bounds for London. It seems to be stuck rendering the bounds for Denver, though the map object changes bounds. If I set the default value of the dropdown as "London", the map will only render the bounds for London. I am using Dash version 2.17.1 and Plotly version 5.22.0. Some help in figuring this out would be appreciated!
# third party imports
import dash
import dash_bootstrap_components as dbc
import dash_renderjson
import numpy as np
import pandas as pd
import plotly.graph_objects as go
import requests
from dash import Input, Output, State, callback, dcc, html, callback_context, dash_table
from dash.exceptions import PreventUpdate
import dash_bootstrap_components as dbc
import dash_renderjson
import warnings
from datetime import date
app = dash.Dash(
__name__,
assets_folder="assets",
external_stylesheets=[dbc.themes.BOOTSTRAP],
suppress_callback_exceptions=True,
)
app.layout = dbc.Container(
html.Div(
[
html.Br(),
dbc.Row([html.H1("ShakeMap Sampler")]),
html.Div(id="event-output-container"),
html.Br(),
dbc.Row(
[
dcc.Dropdown(
["Denver", "London"],
value="Denver",
placeholder="Select an Event",
id="event-dropdown",
disabled=False,
),
]
),
dbc.Row(
[
html.Div(
id="graph",
children=dash.dcc.Graph(
id="map",
style={"width": "82vh", "height": "58vh"},
),
),
]
),
],
),
fluid=True,
className="dbc",
)
@callback(
Output("map", "figure"),
Input("event-dropdown", "value"),
State("map", "relayoutData"),
State("map", "figure"),
)
def update_map(value, map_layout, map_state):
# initialize map
map = go.Figure(layout={"hoverdistance": 500, "spikedistance": 500})
map.update_layout(mapbox_style="open-street-map") # stamen-terrain
hovertemp = "<b>Latitude: </b>%{lat} <br> <b>Longitude: </b>%{lon}<extra></extra>"
# plot stations on the map
if value == "London":
station_lon = [-0.13]
station_lat = [51.5]
station_id = ["London"]
map_xmin = -1
map_xmax = 1
map_ymax = 52
map_ymin = 51
elif value == "Denver":
station_lon = [-104]
station_lat = [39]
station_id = ["Denver"]
map_xmin = -105
map_xmax = -103
map_ymax = 40
map_ymin = 38
num_stations = len(station_lon)
text_list = ["station"] * num_stations
map.add_traces(
go.Scattermapbox(
lon=station_lon,
lat=station_lat,
ids=station_id,
legendgrouptitle_text="Map Legend",
legendgroup="group",
name="Stations",
marker_color="rgba(0, 0, 255, 1)",
hovertemplate=hovertemp,
text=text_list,
)
)
# fit bounds for requested event
map.update_layout(
mapbox_bounds={
"west": map_xmin,
"east": map_xmax,
"south": map_ymin,
"north": map_ymax,
}
)
print(map_xmax, map_xmin, map_ymin, map_ymax)
print(map)
return map
# return go.Figure(map)
# Run app
if __name__ == "__main__":
app.run_server(debug=True)
Guide de contribution
Ouvrir le guide de contribution
Par où commencer
- Lisez l'issue en entier, puis le guide de contribution du projet.
- Signalez en commentaire que vous la prenez — cela évite que deux personnes fassent le même travail.
- Forkez le dépôt et travaillez sur une branche.
- Ouvrez une pull request qui référence le numéro de l'issue.
Piste de recherche
Commencez par exécuter l’application Dash fournie avec Dash 2.17.1 et Plotly 5.22.0, puis inspectez le callback update_map et les mapbox_bounds de la figure renvoyée après avoir basculé entre Denver et Londres. C’est terminé lorsque les deux valeurs du dropdown rendent de manière fiable les limites de carte correspondantes.
Rédigé par le modèle d'indexation à partir du texte de l'issue.
Évaluation
- Stack technique
- plotly, python
- Domaine
- data-visualization
- Type d'issue
- Bug
- Difficulté
- 3/5
- Temps estimé
- 1-2 jours
- Activité
- À l'abandon
- Clarté
- Plutôt claire
- Accessibilité débutants
- 45/100