iPython/Jupyter Notebook：如何使用 Desmos API 嵌入交互式图形？

Question

我最近从使用纸笔系统为我的微积分 II 课程做笔记切换到使用 Jupyter（以前称为 iPython）笔记本。有什么不同！

无论如何，作为一个通过视觉演示学习得最好的人，我真的很想在我的笔记本中嵌入一​​些交互式Desmos图（对于不熟悉 Desmos 的人来说，它是一个非常强大但易于使用的基于网络的图形计算器）。

不幸的是，iPython/Jupyter notebook安全 模型阻止了嵌入在 Markdown 单元格中的 JavaScript 的执行。HTML Sanitization 库（我相信是Google Caja）去除您放入 Markdown 单元格中的任何 HTML 标签和 JavaScript 代码。

根据安全模型文档中的注释，计划支持某种允许 HTML/CSS 用于笔记本主题的机制。但该说明并未提及 JavaScript 支持。

我意识到跨站脚本是一个严重且难以防御的问题，但真的没有办法放松笔记本作者的安全限制吗？也许将来可以向笔记本元数据（可以在笔记本会话中编辑）添加配置选项以指定允许的标签列表。

同时，有没有人知道使用 JavaScript 在笔记本的 Markdown 单元格中嵌入来自第三方 API 的输出的变通方法、黑客或其他方法？

如果要在 Python 单元格中使用 Python 打印适当的 HTML 和 JavaScript 代码，是否可以避免这些限制？也许我应该为 Desmos API 编写一个 Python 包装器......

Answer 1

我认为有几种方法可以实现

• 使用iframe
• 使用原始 html 显示，这可能需要您先编写一些包装器以使其可重用
• 使用一些 3 方库：mpld3、plot.js，这是一个列表
• 使用其他类型的 3 方库：IPython-Dashboard