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


作为项目的一部分,我需要在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'参数。


1136
2018-05-31 08:21


起源



答案:


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

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

虽然我 不推荐 这超过官方 custom.js 方法,我有时会发现快速测试某些内容或动态生成一个小的JavaScript代码段很有用。


7
2017-07-31 16:31



我们可以改变吗? js 字符串在这里加载外部 .js 文件? - cqcn1991
您也可以将其更改为js =“”“<script type ='text / javascript'src ='。/ my_toc / test2.js'> </ script>”“”HTML(js),这样您就可以加载外部js文件。 - cqcn1991


答案:


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

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

虽然我 不推荐 这超过官方 custom.js 方法,我有时会发现快速测试某些内容或动态生成一个小的JavaScript代码段很有用。


7
2017-07-31 16:31



我们可以改变吗? js 字符串在这里加载外部 .js 文件? - cqcn1991
您也可以将其更改为js =“”“<script type ='text / javascript'src ='。/ my_toc / test2.js'> </ script>”“”HTML(js),这样您就可以加载外部js文件。 - cqcn1991


安装包装不是开箱即用,至少目前是这样。 这样做的方法是使用 custom.js 和jQuery getScript 将js注入笔记本中。

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

你应该知道的是 static 用户档案中的文件夹是 merged 使用webserver静态资产,您可以通过请求正确的URL来访问此文件夹中的任何文件。

几个小时前在IPython每周视频中也提到了这个问题“实验室会议“在youtube上广播直播(你可能会有更长的答案),我已经与问题的作者展开了讨论 这里


3
2018-05-31 09:02



我需要存储我的脚本“Gl.js”以使用getScript()。 'Javascript('''$。getScript(“Gl.js”);'''''它给出了404错误 - Tarun Gaba
确切的路径和指令取决于您运行的IPython版本。这将是$ .getScript(“static / Gl.js”)和 ~/.ipython/profile_default/static/[custom]/GI.js。我建议你去搜索一下 IPython custom.js,询问/搜索ml / hipchat,因为我担心stackoverflow会有一点限制,无法给你所有必要的解释。 - Matt
那个尴尬的时刻,当你无法在stackoverflow上找到解释时.. - Tarun Gaba
这里的问题是解释时间太长,可能会发生变化,难以嵌入代码......等等。我们可以在IPython ML或gihtub bugtracker上讨论这个问题,或者在你的回购中讨论它是否在任何地方托管问题跟踪器。 - Matt
好吧,我和我的导师谈过同样的问题,他或者我自己都会在IPython ML上发布大量的研究,结果发现这是IPython开发的热门话题之一 - Tarun Gaba


我已经和这个问题争了好几天了,这里的东西看起来很有效;买家要小心,这是一个最小的工作解决方案,它既不漂亮也不优化 - 一个更好的解决方案将非常受欢迎!

首先,在 .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。我很想看到一个更简单的解决方案(PLZ devs我们可以plz拥有 $.getScript('/static/custom/util.js'); 在 custom.js 加载一堆全局JS函数) - 但这是我现在最好的。抛开这个歌舞,巨大的升级到IPython笔记本团队,这是一个很棒的平台!


3
2018-02-06 22:03





在IPython笔记本中嵌入D3

总结一下代码。

导入脚本:

%%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双向通信

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


1
2017-11-21 13:54