Streamlit image enlarge

Hi Folks,
I was tring to create a cropping tool and this is the workflow :

1.) Create an upload button to upload a pdf and converted it to a jpg image
2.) User then can crop this image according to their wish.

The problem is these images need to be enlarged / zoomed into before cropping becuase it contains very small engineering icons.

So far , i have been able to create a button and upload the jpg with cropping function too.
I have been facing challenges on the zooming functionality.

st.set_option('deprecation.showfileUploaderEncoding', False)

st.header("Cropper Demo")
img_file = st.sidebar.file_uploader(label='Upload a file', type=['png', 'jpg', 'pdf'])
realtime_update = st.sidebar.checkbox(label="Update in Real Time", value=True)
box_color = st.color_picker(label="Box Color", value='#0000FF')
aspect_choice = st.sidebar.radio(label="Aspect Ratio", options=["1:1", "16:9", "4:3", "2:3", "Free"])
aspect_dict = {"1:1": (1,1),
            "16:9": (16,9),
            "4:3": (4,3),
            "2:3": (2,3),
            "Free": None}
aspect_ratio = aspect_dict[aspect_choice]

if img_file:
 data = img_file.read()
 img = convert_from_bytes(data)
 if not realtime_update:
     st.write("Double click to save crop")
 #Get a cropped image from the frontend
 cropped_img = st_cropper(img, realtime_update=realtime_update, box_color=box_color,
                            aspect_ratio=aspect_ratio)
 # Manipulate cropped image at will
 st.write("Preview")
 _ = cropped_img.thumbnail((150,150))
 st.image(cropped_img)
Streamlit version : - '0.73.1'
Python. : 3.7

Hi @Peaceout21, welcome to the Streamlit community!

I don’t have specific experience here, but it looks like this function in scipy might have the capability you are looking for?

You could attach a Streamlit slider to the zoom argument and dynamically resize maybe?

Best,
Randy

Thanks @randyzwitch for taking the time to reply.
Actually i was looking at it from the front end point of view , meaning giving the option to user to zoom into
the image from streamlit’s environment itself

1 Like