1

I am working on a Folium map and am trying to inject parts of the leaflet/js solution suggested in this thread in my code.

My map has already been initialized in Folium, so I don't want to initialize it again with Leaflet and create another map on top of the Folium map, but instead access the Folium map from the JavaScript code. How can I do this? I tried

var map=window.maps.leafletList[0].map.getCenter()

but this didn't work.

Another way I tried to solve it was to initialize a completely blank map in folium

m = folium.Map(crs='Simple', zoom_start=2, tiles=None)

and then initialize the map in Leaflet, but it seems that when I add markers in Folium later on, these are still placed on the 'blank' folium map underneath and not the Leaflet map that I added on top?

I am totally new to this.

4
  • Can I ask why you don’t just use leaflet? Instead of trying to mix the two? Folium is a “light-weight” Leaflet for Python /R. It generates all the calls and scripts for you. There are “plug-in” for Folium that add some of the Leaflet tools / features for you. Open your leaflet map in a text editor and look for yourself. Chances are you will be able to replicate it in Leaflet, with the full Leaflet capabilities. Aug 17, 2022 at 9:49
  • Thanks for the reply - my python/folium code is pretty much completed and this is an additional feature in my code I wanted to integrate, so instead of rewriting my whole code using leaflet/js I would prefer if there was a way to integrate it in my already existing python/folium code.
    – JoeMount
    Aug 17, 2022 at 10:44
  • You can access the leaflet in folium but its very hackish I would not advise this. You are better off just bulding it from pure leaflet or look into ipyleaflet which has greater interactivity with user
    – ziggy
    Aug 17, 2022 at 13:06
  • I'll give it a try with ipyleaflet, thanks for the tip!
    – JoeMount
    Aug 20, 2022 at 9:31

1 Answer 1

1

You can manipulate javascript with:

from folium.elements import *

my_js = '''
console.log('here add your code javascript')
'''

m.get_root().script.add_child(Element(my_js))

where m is the variable of map folium. Too you can invoke a file .js or .css:

m.get_root().html.add_child(JavascriptLink('./static/js/script.js'))
m.get_root().header.add_child(CssLink('./static/css/style.css'))

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.