Expand folium map size on mobile devices

Vitalii Mytenko 0
Viewed 38

I make a web app using Django, Folium. I have a navbar and a Folium map on the web page. It works fine om computers and landscape screen devices, but on portrait screen devices the map has a free space.

My code for map:

current_map = folium.Map(location=start_location, zoom_start=6)    
fig = branca.element.Figure(height="100%")
fig.add_child(current_map)
context = {"current_map": current_map._repr_html_()}
return render(request, template_name="index.html", context=context)

index.html

<!DOCTYPE html>  # this line causes map cropping
<html lang="en">
<head>
    <meta charset="utf-8">
    <title></title>
</head>
<body>
    {{ current_map | safe }}
</body>
</html>

I found, that <!DOCTYPE html> line causes map cropping.

How do I fill it?

enter image description here

folium django python
1 Answers

Try this:

context = {'map': map.get_root().render()}
return render(request, template_name="index.html", context=context)

index.html:

<html> 
    {{map|safe}}
</html>
user6bNW0
Related