Realtime dashboard - working with maps

Dash Python
1

Hi,

I’ve a car which is on move and I’d like to see the roads in real time.
I’ve created a tile server (as it is a stand alone app), and can successfully read the real time data.
The code below is the one responsible for the path drawing.
The problem is that due to each call of the callback function (every 2 secs), the map is resized to it’s original size - i.e. if I perform a zoom, move to some area - it is always returns to the first map which was generated.
How to fix it so that it will show my preferred map?

def draw_path(df):
	fig = px.scatter_mapbox(df,	lat="CarLat", lon="CarLon")
	fig.update_layout(mapbox_style="white-bg", 
					  mapbox_layers=[
					  { "below": 'traces',
					  "sourcetype": 'raster',
					  "source": ["http://127.0.0.1:1234/static/tiles/{z}/{x}/{y}.jpg"],
					  }
					])
	fig.update_scences(aspectmode="cube")
	
	return fig
2

Hi there,

Have you tried the approach described here?

You just need to pass the uirevision parameter to the figure layout and assign it to an object that “persists” over your callback updates (ex: a click counter for a “Reset Zoom” button). When I used it (in, a bubble chart), I saw some comments about not working in mapbox/geo, but this should be fixed now.

Hope this helps!

1 Like
3

OK, I’ve read about it, but it is not clear to me what value shall be assigned to the uirevision

4

You can assign anything constant, e.g. the string ‘constant’ (:

5

I’ve set “123” and sometimes I’m getting an error like:

ValueError: Invalid property specified for object of type plotly.graph_objs.layout.mapbox.Layer ‘uirevision’

Did you mean “visible”?

Valid properties:
…

6

It looks like you set the prop on the layer? I believe should be on the layout

EDIT: I haven’t tested it though. I have mostly used dash-leaflet for map visualizations (:

7

I believe it can also be passed to the layout.Mapbox object, apparently not to the layout.mapbox.Layer one :slight_smile:

8

It was appended to the mapbox_layers=[{…}]

9

Can you please elaborate about dash leaflet?

10

It is a leaflet-based alternative map component. You can see a few examples here,

http://dash-leaflet.herokuapp.com/

12

Bring live data into any map.Here’s how it works: Two sources of data need to be joined at runtime to create the real-time.

MyLowesLife

13

Please clarify your answer