Plotly: Change marker text in scatter plot on on_click evet

Question

I was following an example on how to update points in a scatter plot with click events https://plotly.com/python/click-events/.

The callback function in the example updates the color and size of markers upon click. (see my question after the code extract)

# create our callback function
def update_point(trace, points, selector):
    id=trace.ids[points.point_inds[0]]
    c = list(scatter.marker.color)
    s = list(scatter.marker.size)
    for i in points.point_inds:
        #change only this one
        c[i] = '#bae2be'
        s[i] = 20
        with f.batch_update():
            scatter.marker.color = c
            scatter.marker.size = s

My question is: How do you, on the same click, update the marker text (in this case the text parameter of the Scatter-object)?

Thanks

Michael

user3422424 user3422424 · Accepted Answer · 2020-09-21T07:24:35

After some digging:

The text is not a property of the marker object. Rather it is a list-type-property of the Scatter-object, meaning that you have to update the applicable element of the text list.

Here is the updated callback function following the original example:

# create our callback function
def update_point(trace, points, selector):
    id=trace.ids[points.point_inds[0]]
    c = list(scatter.marker.color)
    s = list(scatter.marker.size)
    for i in points.point_inds:
        #change only this one
        c[i] = '#bae2be'
        s[i] = 20
        **ids[i]+=ids[i] #duplicate text to test effect**
        with f.batch_update():
            scatter.marker.color = c
            scatter.marker.size = s
            **f.data[0]['text']=ids #update the entire text-list-property**

Plotly: Change marker text in scatter plot on on_click evet

1 Answers