在 GitHub Pages 上显示交互式绘图图表（.html 文件）

Question

我已经创建了以下情节情节是这样的：

import plotly
labels = ['Oxygen', 'Hydrogen', 'Carbon_Dioxide', 'Nitrogen']
values = [4500, 2500, 1053, 500]

trace = plotly.graph_objs.Pie(labels=labels, values=values)
plotly.offline.plot([trace], filename='basic-pie-chart')

然后我创建了这样的html：

print(plotly.offline.plot([trace], include_plotlyjs=False, output_type='div'))

运行上面的代码会生成一个 .html 文件，我可以在浏览器中查看该文件。

有没有办法在我的 GitHub 页面上的 Markdown 文件中间显示 .html 文件，以便我可以使用 plotly 的交互功能？

这是我问的类似问题

Answer 1

如果您在 GitHub 页面站点中使用Jekyll。

准备数据：

import plotly.graph_objects as go

labels = ['Oxygen','Hydrogen','Carbon_Dioxide','Nitrogen']
values = [4500, 2500, 1053, 500]
fig = go.Figure(data=[go.Pie(labels=labels, values=values)])
fig.show()

生成 HTML 文件：

import plotly.io as pio

pio.write_html(fig, file='figure.html', auto_open=True)

上传figure.html文件并将其提交到_includes站点存储库根目录中的文件夹。

现在，如果您使用Markdown来创建您的帖子，您可以使用include标签并使用以下内容调用figure.html您的帖子：

{% include figure.html %}

将此行提交到.md文件_posts夹中的帖子文件。检查结果。