iPython/Jupyter笔记本：如何使用desmosapi嵌入交互式图形？

Question

我最近从用纸笔系统记微积分II课程的笔记改为使用Jupyter（以前称为iPython）笔记本。多大的不同！在

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

不幸的是，iPython/Jupyter笔记本securitymodel阻止了嵌入在降价单元格中的JavaScript的执行。HTML清理库（Google Caja，我相信）会将您放入降价单元格中的任何HTML标记和JavaScript代码剥离。在

根据anote in the security model docs，计划支持某种机制，允许HTML/CSS用于笔记本主题。但该说明没有提到JavaScript支持。在

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

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

如果要在Python单元中使用Python打印适当的HTML和JavaScript代码，这会避免这些限制吗？也许我应该为desmosapi编写一个Python包装器。。。在

Answer 1

您可以始终使用来自IPython小部件的交互

from IPython.html.widgets import *
import numpy as np
import matplotlib.pyplot as plt
import math

def linear(w,x,b):
    return w*x + b

def logistic(z):
    return 1/(1+math.e**(-z))

def plt_logistic(a, b):
    x = np.linspace(-20,20, 100)
    h = linear(a,x,b)
    y = logistic(h)
    plt.ylim(-5,5)
    plt.xlim(-5,5)
    plt.plot(x,h)
    plt.plot(x,y)
    plt.grid()
    plt.show()

interact(plt_logistic, a = (-10,10,0.1), b = (-10,10,0.1))

Answer 2

我想有几种方法可以做到

• 使用iframe
• 使用原始html显示，这可能需要您编写 一些包装首先使其可重用
• 使用一些三方库：mpld3，绘图.js，这是一个list
• 使用其他类型的三方库：IPython-Dashboard

Answer 3

以下是如何使用jp泷u proxy widgets在Jupyter中嵌入Desmos：

请参见https://github.com/AaronWatters/jp_proxy_widget 此代码基于快速入门示例：https://www.desmos.com/api/v1.2/docs/index.html