Javascript 在folium/bootstrap可折叠中使用mpld3标记标签抖动
前言：我知道使用mpld3时会出现一些勾号格式问题，但我相信这是另外一回事。它几乎可以完美地工作 我正在folium（这是一个天赐之物）中创建一个在标记和GeoJson弹出窗口中包含html内容的地图。其中一些内容包括引导折叠按钮，我现在将mpld3内容合并到我的产品中。我注意到一些我不完全理解的行为：Javascript 在folium/bootstrap可折叠中使用mpld3标记标签抖动,javascript,python,matplotlib,folium,mpld3,Javascript,Python,Matplotlib,Folium,Mpld3,前言：我知道使用mpld3时会出现一些勾号格式问题，但我相信这是另外一回事。它几乎可以完美地工作 我正在folium（这是一个天赐之物）中创建一个在标记和GeoJson弹出窗口中包含html内容的地图。其中一些内容包括引导折叠按钮，我现在将mpld3内容合并到我的产品中。我注意到一些我不完全理解的行为： 放在iframe中父div中的mpld3材料可以顺利加载，很好！但是 当我将图形html放入可折叠按钮时，在展开时，x轴标签几乎与脊椎重叠。如果单击图形上的“主页”按钮（或使用平移或缩放进行
- 放在iframe中父div中的mpld3材料可以顺利加载，很好！但是
- 当我将图形html放入可折叠按钮时，在展开时，x轴标签几乎与脊椎重叠。如果单击图形上的“主页”按钮（或使用平移或缩放进行交互），标签将捕捉到正确的位置
ax.tick_参数（axis='x'，pad=10）plt.xticks（ticks=[]，labels=[my label list]）import folium, branca
import matplotlib.pyplot as plt
import mpld3
import os
fig = plt.figure()
plt.title('Testing!')
plt.xlabel('x labels')
plt.ylabel('y labels')
plt.bar([1, 10], [5, 9])
html_graph = mpld3.fig_to_html(fig)
html_graph2 = mpld3.fig_to_html(fig)
m = folium.Map(location=[39, -98], zoom_start=5, tiles="Stamen Terrain")
header_content="""
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
</head>
"""
html = """
<html>
<body>
<div class="container">
{}
<h5>This guy works just fine!</h5>
<h2 class="btn btn-block" data-toggle="collapse" style="background-color: powderblue;" data-target="#demo" href="#">Click me!</h2>
<div id="demo" class="collapse">
{}
<h5>And this guy requires you to click on the home button (or navigate through the graph) to get tick labels to move to the correct position. What gives?</h5>
</div>
</div>
</body>
</html>
""".format(html_graph, html_graph2)
iframe = branca.element.IFrame(html=header_content+html, width=600, height=550)
c = folium.Marker([39, -98], popup=folium.Popup(iframe, parse_html=True)).add_to(m)
m.save(os.path.join(r'[target folder]', 'folium_mpld3.html'))
导入小叶、小枝
将matplotlib.pyplot作为plt导入
导入mpld3
导入操作系统
图=plt.图（）
产品名称（“测试！”）
plt.xlabel（'x标签'）
plt.ylabel（'y标签'）
plt.bar（[1,10]，[5,9]）
html\u graph=mpld3.fig到html（图）
html_graph2=mpld3.fig_to_html（fig）
m=folium.Map（位置=[39，-98]，缩放开始=5，tiles=“雄蕊地形”）
标题_content=“”
"""
html=”“”
{}
这家伙干得很好！
点击我！
{}
这家伙要求你点击主页按钮（或在图表中导航）以获取记号标签，并将其移动到正确的位置。给出了什么？
“”格式（html\U图形、html\U图形2）
iframe=branca.element.iframe（html=header\u content+html，宽度=600，高度=550）
c=folium.Marker（[39，-98]，popup=folium.popup（iframe，parse_html=True））。添加到（m）
m、 保存（os.path.join（r'[target folder]'，'folium_mpld3.html'））