Plotly dash: Prevent scales from remapping after interactive data filtering

Question

I have a plot in dash of the mapbox scatter type that allows to interactively filter data points. Their size and color are determined by a common float variable. Upon filtering, the range of the relevant values (originally, say, 0-10) is reduced (for instance 2-5) and plotly re-maps the extremes of the color and size spectrum now to 2 and 5, so every remaining point changes color and size. I want to prevent that and let those points keep their color and size. How is this possible?

Note that the subsetting occurs not via Plotly’s own interactive box tool, but via a range slider that helps filter the underlying data frame. In fact, the slider addresses the float variable that determines color and size, so the user can filter towards the upper vs. lower end of the color/size spectrum.

Asked By: andreas

||

Source

Answer 1

You can hardcode the original color range and then when you’re updating your figure your callback that regenerates your mapbox figure, you can use the parameter range_color in px.scatter_mapbox.

For example:

RANGE_COLOR = [0,10]

@app.callback(
    Output('graph', 'figure'),
    Input(...)
)
def update_mapbox(...):

    fig = px.scatter_mapbox(
        ...,
        range_color=RANGE_COLOR,
        ...
    )
    return fig

Answered By: Derek O

Plotly dash: Prevent scales from remapping after interactive data filtering

Question:

Answers: