我想向 folium 地图添加一个文本框，以提供有关源数据以及如何将地图用作资源的更多信息。如果可能的话，我希望它的外观和行为与 LayerControl 函数几乎相同（如果它也可以折叠，那就更好了）。
（顺便说一句，这是我尝试解决我最初想要的问题：将鼠标悬停在 LayerControl 面板中每个项目旁边的图标上以显示弹出信息框的能力，但我怀疑这会要求更高，因为它涉及修改 folium.LayerControl）。
到目前为止，我只能找到向地图添加标记 的解决方案，但这实际上与简单文本框的作用不同。 其他解决方案 涉及在地图上的特定位置添加文本，但我需要在用户导航的任何地方显示文本框。 This 是我遇到的最接近我需要的解决方案，但这只会在地图上方添加文本，而且我不确定修改 html 代码是否可以简化为与在以下位置添加文本相同的解决方案一个特定的位置。
您可以使用 branca 注入 HTML 和 CSS（可用于添加自定义图例，也可拖动）。
这是一个基于这个 branca demo nbviewer
的基本示例因为 stackoverflow 不会让我过去的图像这里是托管预览结果。 成绩预览
你可以看到我什至可以自定义浏览器选项卡的标题。如果您将文件托管在 GitHub Pages 或其他地方，您可以在选项卡上显示您的项目名称，添加一个图标......等等。
import folium
from branca.element import Template, MacroElement
import webbrowser
# main map
m = folium.Map(location=[35, 38], tiles=None, zoom_start=3)
# adding a basemap
dark_basemap = folium.TileLayer("cartodbdark_matter", name="Dark Theme Basemap").add_to(m)
# Injecting custom css through branca macro elements and template, give it a name
textbox_css = """
{% macro html(this, kwargs) %}
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Textbox Project</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.1/css/all.min.css" integrity="sha512-MV7K8+y+gLIBoVD59lQIYicR65iaqukzvf/nwasF0nqhPay5w/9lJmVM2hMDcnK1OnMGCdVK+iQrJ7lzPJQd1w==" crossorigin="anonymous" referrerpolicy="no-referrer"/>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script>
$( function() {
$( "#textbox" ).draggable({
start: function (event, ui) {
$(this).css({
right: "auto",
top: "auto",
bottom: "auto"
});
}
});
});
</script>
</head>
<body>
<div id="textbox" class="textbox">
<div class="textbox-title">Textbox (draggable)</div>
<div class="textbox-content">
<p>You can put whatever content here.<br>You can create as many elements and positon them all over the map.</p>
<p>You can delete the script that makes it draggable and all script links that come with it.</p>
<p>You can add a link to a local CSS file in the head and past the css in it instead of here.</p>
<p>You can find a way to make it collapsible with JS or CSS, it's a normal HTML div after all.</p>
</div>
</div>
</body>
</html>
<style type='text/css'>
.textbox {
position: absolute;
z-index:9999;
border-radius:4px;
background: rgba( 28, 25, 56, 0.25 );
box-shadow: 0 8px 32px 0 rgba( 31, 38, 135, 0.37 );
backdrop-filter: blur( 4px );
-webkit-backdrop-filter: blur( 4px );
border: 4px solid rgba( 215, 164, 93, 0.2 );
padding: 10px;
font-size:14px;
right: 20px;
bottom: 20px;
color: orange;
}
.textbox .textbox-title {
color: darkorange;
text-align: center;
margin-bottom: 5px;
font-weight: bold;
font-size: 22px;
}
</style>
{% endmacro %}
"""
# configuring the custom style (you can call it whatever you want)
my_custom_style = MacroElement()
my_custom_style._template = Template(textbox_css)
# Adding my_custom_style to the map
m.get_root().add_child(my_custom_style)
# Adding the layer control
folium.LayerControl(collapsed=False).add_to(m)
# save the map as html
m.save("m.html")
# opens in default browser
webbrowser.open("m.html")
为了好玩，我添加了玻璃形态效果，但你可以用它做很多事情。