python-visualization / python-visualization/folium
Font Awesome Brand Icons do not work
Nessuno ha ancora preso questa issue.
- Lingua principale
- Python
- Stelle
- 7.4k
- Fork
- 2.3k
- Merge medio
- 17h 22m
- PR unite (30g)
- 11
Descrizione
Describe the bug
Brand icons from font-awesome do not render correctly.
To Reproduce
from flask import Flask, render_template_string
import folium
app = Flask(__name__)
@app.route("/")
def fullscreen():
"""Simple example of a fullscreen map."""
m = folium.Map(location=[41, -71], zoom_start=4)
folium.Marker(location=[41, -72],
icon=folium.Icon(prefix='fa', icon='fa-heart')).add_to(m)
folium.Marker(location=[41, -75],
icon=folium.Icon(prefix='fa', icon='fa-bluetooth')).add_to(m)
return m.get_root().render()
if __name__ == "__main__":
app.run(debug=True)
Expected behavior
All icons to render correctly
Environment (please complete the following information):
- Browser: Firefox 140.15.0esr and Chromium 152.0.7977.64
- Jupyter Notebook or html files? Flask
- Python version:
sys.version_info(major=3, minor=13, micro=5, releaselevel='final', serial=0) - folium version:
0.19.5+dfsg - branca version:
0.8.1
Additional context
It seems that the appropriate web font is not loaded. If I go to Web Developer Tools -> Inspector -> Fonts -> All Fonts on Page only https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6.2.0/webfonts/fa-solid-900.woff2 is loaded and I believe the glyph for bluetooth is in https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6.2.0/webfonts/fa-brands-400.woff2 so it isn't rendered correctly.
Screenshots
folium is maintained by volunteers. Can you help making a fix for this issue? Probably not
Guida per i contributori
Apri la guida per i contributori
Come iniziare
- Leggi tutta la issue e poi la guida ai contributi del progetto.
- Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
- Fai un fork del repository e lavora su un branch.
- Apri una pull request che faccia riferimento al numero della issue.
Direzione di ricerca
Inizia eseguendo la riproduzione Flask dell’issue e ispezionando l’HTML generato e i web font Font Awesome caricati in Firefox o Chromium. Traccia il modo in cui folium.Icon gestisce il prefisso fa e confronta l’icona solid heart con l’icona brand bluetooth. Il lavoro è completo quando entrambi i marker vengono visualizzati correttamente e un controllo di regressione copre le icone brand.
Scritto dal modello di indicizzazione a partire dal testo della issue.
Valutazione
- Stack tecnologico
- css, javascript, python
- Ambito
- data-visualization, frontend
- Tipo di issue
- Bug
- Difficoltà
- 3/5
- Tempo stimato
- 1-2 giorni
- Stato di attività
- Attiva
- Chiarezza
- Abbastanza chiara
- Idoneità per principianti
- 67/100