Estoy trabajando en un proyecto para hacer un mapa usando folium y matraz y estoy tratando de agregar mi propio javascript para agregar algo de animación al mosaico para que aparezca uno por uno. La pregunta es ¿cómo puedo agregar mi javascript personalizado al mapa usando el matraz de python?
como lo he intentado de esta manera en este código a continuación:
from branca.element import Element m = folium.Map() map_id = m.get_name() my_js = """ const items = document.querySelectorAll('.leaflet-interactive') items.forEach((one) => { one.style.visibility = 'hidden' }) if (items.length > 0) { if (items.length !== 0) { let i = 0 const m = setInterval(function () { if (i < items.length) { items[i].style.visibility = 'visible' i++ } console.log('now i =' + i + ' || the number of circle = ' + items.length) if (i === items.length) { clearInterval(m) console.log('now cleared') } }, 1000) } } """.format(map_id) e = Element(my_js) html = m.get_root() html.script.get_root().render() # Insert new element or custom JS html.script._children[e.get_name()] = e m.save('mymap.html')También he intentado de otra manera como esta:
base_map.get_root().html.add_child(folium.JavascriptLink('static/custom.js'))se inyecta en el cuerpo de la plantilla pero sigue sin funcionar
Ya descubrí cómo incluir el enlace externo JavaScript y CSS también en línea js:
En primer lugar, podemos agregar un enlace CSS al encabezado de la página
m.get_root().header.add_child(CssLink('./static/style.css'))Entonces, este es el código para insertar JavaScript Enlace externo a folium
m.get_root().html.add_child(JavascriptLink('./static/js.js'))Finalmente, para agregar al script Folium que se generó antes
my_js = ''' console.log('working perfectly') ''' m.get_root().script.add_child(Element(my_js))Los recursos que me ayudaron a entender cómo hacer esto son leer los elementos throw branca y verificar el repositorio de Folium.