File tree Expand file tree Collapse file tree 2 files changed +58
-0
lines changed
docs/user_guide/vector_layers Expand file tree Collapse file tree 2 files changed +58
-0
lines changed Original file line number Diff line number Diff line change 1+ Vector Layers
2+ =============
3+
4+ This section covers the different vector layers available in Folium.
5+ Vector layers are used to draw shapes and display information directly on your maps.
6+
7+ .. toctree ::
8+ :maxdepth: 2
9+
10+ rectangle
11+ polyline
12+ polygon
13+ text_elements
Original file line number Diff line number Diff line change 1+ Text Elements
2+ =============
3+
4+ Folium allows you to add text to your maps in several ways, beyond the standard
5+ marker popups and tooltips. This section covers the most common approaches.
6+
7+ Adding Text with DivIcon
8+ ------------------------
9+
10+ The simplest way to display static text on a map is by using a `DivIcon `.
11+ A `DivIcon ` creates a marker that shows HTML content directly on the map.
12+
13+ Example:
14+
15+ .. code-block :: python
16+
17+ import folium
18+ from folium.features import DivIcon
19+
20+ m = folium.Map(location = [40 , - 100 ], zoom_start = 4 )
21+
22+ folium.Marker(
23+ location = [40 , - 100 ],
24+ icon = DivIcon(
25+ icon_size = (150 ,36 ),
26+ icon_anchor = (0 ,0 ),
27+ html = ' <div style="font-size: 16pt; color: red;">Hello Map!</div>' ,
28+ )
29+ ).add_to(m)
30+
31+ m
32+
33+ Other Approaches
34+ ----------------
35+
36+ - **Leaflet text layers **: You can directly use the underlying Leaflet `L.divIcon ` or
37+ `L.tooltip ` via Folium's `CustomPane ` or plugins.
38+ - **Branca HTML templates **: For more advanced formatting, you can inject HTML
39+ elements into your map using Branca's `Element ` class.
40+
41+ Tips
42+ ----
43+
44+ - DivIcon text is always visible, unlike tooltips or popups.
45+ - Use HTML/CSS for styling text size, color, and position.
You can’t perform that action at this time.
0 commit comments