Get hoverable dimensions of plotly express figure

  plotly-express, plotly-python, python

I am using plotly express to show images. I have altered the layout to have width=800 and height=800. However, I notice that when hovering around the image, the maximum x and y coordinates that can be hovered around may be less or greater than 800. This is fine, but I would like to determine what the "actual" maximum x and y coordinates that can be hovered around are programmatically (I have a long list of images I need to do this for). That is, the maximum x and y coordinates that will show up on hover, as demonstrated below:

import plotly.express as px
import numpy as np
from PIL import Image
import requests

# Example image
ss_url = "https://image.shutterstock.com/image-photo/dabbing-trends-overjoyed-woman-showing-260nw-1714457554.jpg"

# Get rgb array of image
rgb_arr = np.array(Image.open(requests.get(ss_url, stream=True).raw))

# Turn rgb into plotly express image
fig = px.imshow(rgb_arr)

# Update layout 
fig.update_xaxes(visible=False)
fig.update_yaxes(visible=False)
fig.update_layout(autosize=True, dragmode=False, width=800, height=800)

# Appx maximum (x,y) desired: (389, 262) ..  Numbers approximated by manually hovering over image

# Layout just says height=800 and width=800
fig.layout.height, fig.layout.width

Source: Python Questions

LEAVE A COMMENT