将Jupyter Notebook转换为幻灯片时不显示绘图图

Question

我有一个带有交互式绘图的Jupyter笔记本。我正在使用将笔记本转换成幻灯片nbconvert。当我这样做时，在幻灯片中不会显示密谋图。我也收到以下龙卷风警告

$ jupyter nbconvert presentation.ipynb --to slides --post serve
[NbConvertApp] Converting notebook presentation.ipynb to slides
[NbConvertApp] Writing 818538 bytes to presentation.slides.html
[NbConvertApp] Redirecting reveal.js requests to https://cdnjs.cloudflare.com/ajax/libs/reveal.js/3.1.0
Serving your slides at http://127.0.0.1:8000/presentation.slides.html
Use Control-C to stop this server
WARNING:tornado.access:404 GET /custom.css (127.0.0.1) 1.53ms
WARNING:tornado.access:404 GET /custom.css (127.0.0.1) 0.96ms
WARNING:tornado.access:404 GET /plotly.js (127.0.0.1) 0.84ms

昨天，这种侮辱增加了伤害，我认为我并没有做出任何重大改变。我尝试重新启动浏览器和计算机，但均无济于事。

Answer 1

1) 如果您通过 Jupyter 提供幻灯片，请检查 JS 控制台是否有错误和 Jupyter 日志。当你浏览slides.html时，你可能会得到
404 GET /files/mydir/plotly.js

将plotly.js 文件放在slides.html 所在的目录中（下载例如https://cdn.plot.ly/plotly-latest.min.js并重命名为plotly.js）

2) 确保您在 Jupyter 笔记本中指定了布局高度和宽度，例如

trace_data = [trace1]
layout = Layout(
    autosize=False,
    width=720,
    height=480,
    margin=Margin(
        l=50,
        r=50,
        b=100,
        t=100,
        pad=4
    ),
    bargroupgap=0.3
)
fig = Figure(data=trace_data, layout=layout)

重新运行您的图表，检查它们是否在笔记本中正确显示，保存笔记本，重新运行 nbconvert。

您不需要自定义 custom.css 并制作 myreveal.tpl Reveal 模板并在 nbconvert 命令行上指定它，但如果您希望自定义幻灯片，则可以这样做。

Answer 2

您执行 nbconvert 的目录中必须有一个plotly.js 文件。由于某种原因，“to html”会将plotly javascript嵌入到HTML文件中，但“to slips”会在目录中搜索plotly.js文件。

也就是说，您必须对reveal.js 进行模板化，以根据绘图图表的大小来更改幻灯片的尺寸。或者自定义绘图的尺寸。如果幻灯片太大（或相反），图表将在幻灯片中折叠成一行。