Trying to set up a html popup in Python, using folium to fit images sizes

Question

I am trying to write this code to display popups using folium on a default map. The following loop is searching through my database for the location of each point, to display the picture belonging to it. The code works nicely, but I cannot customize the size of the image to fit the iframe belonging to the popup. I want the popup to show up without any scroll bars. Any suggestions?

This is the code:

for i in range(0, len(locationlist)):
    folium.Marker(
        locationlist[i],
        popup = folium.Popup(IFrame('<img src="data:image/jpeg;base64,
{}">'.format(base64.b64encode(open(df6['path'][i], 'rb').read()).decode()), 
width=500, height=300), max_width=500),
        icon = folium.Icon(color='green')
        ).add_to(m)

This is an example of how the image in the popup looks right now: image

Answer 1

You can try fitting the image into the iframe by writing into the html code something like this:

<img style="width:100%; height:100%;">