plotly / plotly/plotly.py

Scattermapbox figure doesn't render correct bounds in my dash app

Aperta
#4,652 0 commenti 0 reazioni 0 assegnatari Vedi su GitHub

Nessuno ha ancora preso questa issue.

bug P3
Lingua principale
Python
Stelle
18.8k
Fork
2.8k
Merge medio
16h 26m
PR unite (30g)
21

Descrizione

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)



Guida per i contributori

Apri la guida per i contributori

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Direzione di ricerca

Inizia eseguendo l’app Dash fornita con Dash 2.17.1 e Plotly 5.22.0, quindi esamina il callback update_map e i mapbox_bounds della figure restituita dopo essere passato da Denver a Londra e viceversa. Il lavoro è completato quando entrambi i valori del dropdown eseguono il rendering in modo affidabile dei rispettivi limiti della mappa.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Valutazione

Stack tecnologico
plotly, python
Ambito
data-visualization
Tipo di issue
Bug
Difficoltà
3/5
Tempo stimato
1-2 giorni
Stato di attività
Ferma
Chiarezza
Abbastanza chiara
Idoneità per principianti
45/100

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.