IPython:将Javascript脚本添加到IPython笔记本中

Question

作为项目的一部分,我需要在IPython模块中嵌入一些javascripts.这就是我想要做的:

from IPython.display import display,Javascript
Javascript('echo("sdfds");',lib='/home/student/Gl.js')

我的Gl.js看起来像这样

function echo(a){
alert(a);
}

有没有办法让我可以在笔记本中嵌入"Gl.js"和其他类似的外部脚本,这样每次我尝试执行一些需要该库的Javascript代码时,我都不必将它们包含为"lib"参数.

Answer 1

作为一个非常短期的解决方案,您可以使用IPython display()和HTML()函数将一些JavaScript注入页面.

from IPython.display import display, HTML
js = "<script>alert('Hello World!');</script>"
display(HTML(js))

虽然我不建议使用官方custom.js方法,但我有时会发现快速测试某些内容或动态生成一个小的JavaScript代码段很有用.

Answer 2

在IPython Notebook中嵌入D3

• https://blog.thedataincubator.com/2015/08/embedding-d3-in-an-ipython-notebook/

总结一下代码。

导入脚本：

%%javascript
require.config({
  paths: {
      d3: '//cdnjs.cloudflare.com/ajax/libs/d3/3.4.8/d3.min'
  }
});

添加这样的元素：

%%javascript
element.append("<div id='chart1'></div>");

或这个：

from IPython.display import Javascript
#runs arbitrary javascript, client-side
Javascript("""
           window.vizObj={};
           """.format(df.to_json()))

IPython Notebook：Javascript / Python双向通信

• http://jakevdp.github.io/blog/2013/06/01/ipython-notebook-javascript-python-communication/

更广泛的文章解释了如何在JavaScript中访问Python变量，反之亦然。

Answer 3

我已经和这个问题斗争了好几天了，这里有一些看起来可行的东西；但买家要注意，这是一个最小的工作解决方案，它既不漂亮也不理想 - 更好的解决方案将非常受欢迎！

首先，在 中.ipython/<profile>/static/custom/myScript.js，我们做了一些 require.js 魔法：

define(function(){

    var foo = function(){
            console.log('bar');
        }

    return {
        foo : foo
    }
});

复制此模式以实现任意数量的功能。然后，在 中.ipython/<profile>/static/custom/custom.js，将它们拖到持久的东西中：

$([IPython.events]).on('notebook_loaded.Notebook', function(){

    require(['custom/myScript'], function(custom){
        window.foo = custom.foo;
    } );

});

是的，我是一个可怕的人，因为我会在窗口对象、命名空间上扔你认为合适的东西。但现在在笔记本中，像这样的单元格

%%javascript

foo();

应该完全按照它看起来应该做的那样，而用户不必显式导入你的 JS。我很想看到一个更简单的解决方案（请开发人员我们可以加载$.getScript('/static/custom/util.js');一堆custom.js全局 JS 函数） - 但这是我目前拥有的最好的解决方案。除了唱歌和跳舞之外，IPython 笔记本团队的巨大进步，这是一个很棒的平台！

Answer 4

至少目前还不能通过安装软件包来开箱即用。实现的方法是使用custom.jsjQuerygetScript将 js 注入到笔记本中。

我明确地对如何做到这一点保持模糊，因为它是一个不时变化的开发功能。

您应该知道的是，static用户配置文件中的文件夹是merged包含网络服务器静态资产，允许您通过询问正确的 URL 来访问此文件夹中的任何文件。

另外，几个小时前，这个问题已经在 IPython 每周视频“实验室会议”上被问到，该视频在 YouTube 上现场直播且可负责（您可能有更长的答案），我已与该问题的作者在这里展开讨论