在 Folium html 文件中嵌入浮动图像

Question

我想在叶子图上显示固定的png图像，例如徽标或图例。我使用 Python 生成一个 html 文件，并且可以通过指向图像 url 或路径来成功做到这一点：

legend_img = 'path_to_legend/img.png'
FloatImage(legend_img, bottom=0, left=86).add_to(folium_map)

请注意，现在我必须将两个文件放在一起，一个 html 文件和一个 png 文件。如果我移动或重命名 png 文件，它将不会显示在地图上。但是，我希望 html 文件不依赖于任何其他文件或 url，而是包含其内部的所有内容。我怎样才能做到这一点？

Answer 1

这对您来说可能不是一个完整的解决方案，但是如果您可以将png图像保存在"公共"位置，则可以使用其URL：

#Legend
url = ('http://some/place/.......')
FloatImage(url, bottom=5, left=5).add_to(m)

，然后保存地图：

m.save('Map.html')

它将是一个文件。

Answer 2

以下信息来自 我可以将.png图像嵌入到 HTML 页面中吗？。

诀窍是将 base64 将图像数据编码为字符串，并使用该字符串而不是FloatImage中的图像 url。例如，假设 PNG 格式的图像：

with open(legend_img, 'rb') as lf:
# open in binary mode, read bytes, encode, decode obtained bytes as utf-8 string
b64_content = base64.b64encode(lf.read()).decode('utf-8')
FloatImage('data:image/png;base64,{}'.format(b64_content), bottom=0, left=86).add_to(folium_map)