html - 如何在Jupyter笔记本单元格中制作一个大图，输出到html时可滚动

Question

如您所知，当您在 Jupyter Notebook 单元格中打印一个大表格时，无论表格是在 Notebook 环境中打印还是保存到 html 文件中，如果表格太大，它会自动水平或垂直滚动​​。

但是对于图形来说，当它太大时，它会像一个大表格一样可以滚动，但只有在笔记本环境中打印时才可以。当它被保存到一个 html 文件时，整个图适合一个较小的区域，因此使得阅读轴标签非常困难。

我该怎么做？

例如，在 Notebook 中，如果您单击图形的左侧和底部边框，那么您将在右侧和底部看到滚动条。

但是当它输出到html文件时，整个图被塞进了“ Canvas ”，如下所示:

Answer 1

您可以通过三个选项来修改笔记本的样式。

在代码单元中注入(inject) CSS

如果您只想修改单个笔记本的行为，可以在代码中注入(inject)一些 CSS 来自定义您的样式。

from IPython.core.display import HTML
style = """
<style>
div.output_area {
    overflow-y: scroll;
}
div.output_area img {
    max-width: unset;
}
</style>
"""
HTML(style) 

要禁用您的修改，您只需清除该单元格的输出即可。

自定义样式表

如果您想在全局级别修改您的样式，您可以将自定义样式放入 jupyter 配置目录中的 custom/custom.css 文件中(该文件可能尚不存在)。要确定配置文件夹在您的安装中的位置，请运行此

import jupyter_core;jupyter_core.paths.jupyter_config_dir()

这不能即时切换。

自定义 nbconvert 模板

最后，如果您只想设置 HTML 导出的输出样式，请查看 nbconvert documentation在自定义模板部分。这种方法可能是设置导出样式的最强大选项，但它只会影响导出版本，而不影响实时笔记本。