# SelectedData in Scattermapbox doesn't fire when select markers

**URL:** <https://community.plotly.com/t/selecteddata-in-scattermapbox-doesnt-fire-when-select-markers/54007>\
**Category:** Dash Python\
**Created:** [June 19, 2021, 7:54am UTC](https://community.plotly.com/t/selecteddata-in-scattermapbox-doesnt-fire-when-select-markers/54007 "2021-06-19T07:54:41Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![juanluis.rivero](https://avatars.discourse-cdn.com/v4/letter/j/ba9def/32.png) [@juanluis.rivero](https://community.plotly.com/u/juanluis.rivero)\
**Post date:** [June 19, 2021, 7:54am UTC](https://community.plotly.com/t/selecteddata-in-scattermapbox-doesnt-fire-when-select-markers/54007/1 "2021-06-19T07:54:41Z")

</div>

Hello everybody,  
I am new in this word and I need your support for the following issue I have spent days without getting a solution.

I have a map with markers on it. I define a callback to get the selected nodes. The callback fires the first time when run the app with selected = None, but after that I select different nodes and the callback doesn’t fire. I don’t know what I am doing wrong, because I have read many examples and pages and it seems I have the same.

My script is:

```auto
import plotly.graph_objects as go

import json
import dash
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Input, Output
from dash.exceptions import PreventUpdate

external_stylesheets = ['https://codepen.io/chriddyp/pen/bWLwgP.css']

app = dash.Dash( __name__ , external_stylesheets=external_stylesheets, suppress_callback_exceptions=True)
app.title = "Network test"

# Data
lon_media = -3.52443595
lat_media = 40.5314
colors = ['#238443', '#78C679', '#C2E699', '#FFFFB2', '#FECC5C', '#FD8D3C', '#FF0909', '#B30622', '#67033B', '#1C0054']
name_nodes = ['E10301', 'E108', 'E121', 'E120', 'E122', 'P1', 'P2']
node_x = [40.49364, 40.5291696, 40.53518, 40.55151, 40.56916, 40.49952, 40.54665]
node_y = [-3.556693, -3.4921079, -3.545163, -3.529916, -3.556764, -3.546705, -3.550422]
# Color Node Points (Hoover sobre los nodos y color dependiendo de las conexiones)
node_in = [125, 34, 56, 110, 60, 120, 58]
node_out = [100, 50, 60, 100, 30, 78, 25]
node_total = []
node_text = []
for i, node in enumerate(name_nodes):
    node_total.append(node_in[i] + node_out[i])
    node_text.append('Estación: {}<br>Flow in: {}<br>Flow out: {}'.format(name_nodes[i], node_in[i], node_out[i]))

# Figure
fig = go.Figure(go.Scattermapbox(
        lat=node_x,
        lon=node_y,
        mode='markers+text',
        hovertemplate='<b>%{text}</b>',
        showlegend=False,
        text=node_text,
        marker=go.scattermapbox.Marker(
            size=20,
            colorscale=colors,
            # reversescale=True,
            color=node_total,
            colorbar=dict(
                thickness=15,
                title='Vehículos/hora',
                xanchor='left',
                titleside='right'
            ),
        ),
))

fig.update_layout(
    mapbox_style="open-street-map",
    hovermode='closest',
    width=800,
    height=800,
    title='Network test',
    clickmode='event+select',
    mapbox=dict(
        zoom=12,
        style="open-street-map",
        center=go.layout.mapbox.Center(
            lat=lat_media,
            lon=lon_media
        )
    )
)

# App
app.layout = html.Div([
    dcc.Location(id='url', refresh=False),
    dcc.Graph(
        id='network',
        config={'displaylogo': False, 'modeBarButtonsToRemove': ['toImage']},
        figure=fig
    ),
    html.Div(id='test'),
])

@app.callback(Output('test', 'children'),
              Input('network', 'selectedData'))
def select_nodes(selected_data):
    print('Callback select_nodes: ', selected_data)
    if not selected_data:
        return 'hello'
    else:
        return json.dumps(selected_data, indent=2)

app.run_server(debug=False)

```

---

<div class="post-metadata">

**Author:** ![atharvakatre](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/atharvakatre/32/14713_2.png) [@atharvakatre](https://community.plotly.com/u/atharvakatre)\
**Post date:** [June 19, 2021, 8:31am UTC](https://community.plotly.com/t/selecteddata-in-scattermapbox-doesnt-fire-when-select-markers/54007/2 "2021-06-19T08:31:18Z")

</div>

> [@juanluis.rivero](#):
>
> `mode='markers+text',`

I think the behaviour of selectedData changes or don’t work when using the `mode='markers+text'`. If you set `mode='markers'` the callback seems to work fine.

---

<div class="post-metadata">

**Author:** ![juanluis.rivero](https://avatars.discourse-cdn.com/v4/letter/j/ba9def/32.png) [@juanluis.rivero](https://community.plotly.com/u/juanluis.rivero)\
**Post date:** [June 19, 2021, 10:01am UTC](https://community.plotly.com/t/selecteddata-in-scattermapbox-doesnt-fire-when-select-markers/54007/3 "2021-06-19T10:01:54Z")

</div>

Many thanks Atharva, It works fine.  
My best regards.  
Juan Luis

---

<div class="post-metadata">

**Author:** ![Gijs1973](https://avatars.discourse-cdn.com/v4/letter/g/77aa72/32.png) [@Gijs1973](https://community.plotly.com/u/Gijs1973)\
**Post date:** [May 21, 2022, 2:03pm UTC](https://community.plotly.com/t/selecteddata-in-scattermapbox-doesnt-fire-when-select-markers/54007/4 "2022-05-21T14:03:09Z")

</div>

Sorry for the late reply on your solution, but glad I read it because it solved my problem as well; would you have some good documentation on why the mode=‘markers’ is the key in making the callback work?