web-dev-qa-db-ja.com

Jupyterノートブックでcustom.jsファイルを使用するにはどうすればよいですか？

IPythonノートブック（v3.1など）では、~/.ipython/profile_default/static/custom/custom.jsファイルを追加してカスタムJavaScriptを実行できます。たとえば、次のようなことができます。

require(['base/js/namespace', 'base/js/events'], function(IPython, events) {
    console.log("A");
    events.on('app_initialized.NotebookApp', function() {
        console.log("B");
    });
    console.log("C");
});

次に、JSコンソールで、A、B、Cの順に表示されます。

現在、バージョン4.0では、Jupyterノートブックに分割されています。同じファイルが読み込まれ（~/.ipythonではなく~/.jupyterの下にあるにもかかわらず）、コードが実行されます。ただし、B行は表示されなくなりました。アプリが初期化されていないと思います。 ソースコード でトリガーされることはまだわかりますが、それは後で発生するのですか、それとも機能しませんか？

どうすれば再び機能させることができますか？もうapp_initializedを待つ必要はありませんか？このいずれかがどこかに記載されていますか？

編集する

このページ は、現在のところ、カスタム拡張機能を作成し、すべてのアクションをload_ipython_extension関数に配置することを提案しているようです。そうですか？もしそうなら、mathjaxはどうですか？そしてCodeMirrorオプション？

ipythonipython-notebookjupyter-notebookjupyter
21
Mike

custom.jsを使用しても問題は解決しましたが、かなり動き回っているようです。

現在（バージョン4.2.3）および次の5.0リリースのドキュメントでは、~/.jupyter/custom/custom.jsにあります。 http://jupyter-notebook.readthedocs.io/en/latest/examples/Notebook/JavaScript%20Notebook%20Extensions.html#custom.js にあるドキュメントを参照してください

ノートブックで次のスニペットを実行すると、custom.jsへのパスとコンテンツを表示できます。

from jupyter_core.paths import jupyter_config_dir
jupyter_dir = jupyter_config_dir()
import os.path
custom_js_path = os.path.join(jupyter_dir, 'custom', 'custom.js')
print("searching for custom.js in ", custom_js_path)
#  my custom js
if os.path.isfile(custom_js_path):
    with open(custom_js_path) as f:
        print(f.read())
else:
    print("You don't have a custom.js file")
12
Matthias Winkelmann

どうすれば再び機能させることができますか？もうapp_initializedを待つ必要はありませんか？

私はこれを行うための推奨される方法について深い洞察はありませんが、Jupyter/IPython 4.0では、「app_initialized.NotebookApp」の代わりに「notebook_loaded.Notebook」で機能します。つまり、次の行を使用します。

    events.on("notebook_loaded.Notebook", function () {
6
MHH

この質問は、Githubの課題追跡で発生しました- jupyter 4.0の問題 -拡張機能のロードを簡略化するように見える最近の更新へのリンク： code update ：

「notebook.jsonを手動で編集します。デフォルトでは、〜/ .jupyter/nbconfig/notebookにあります。 json： "

{
    "load_extensions": {
      "notify": true,
      "theme_toggle": true
  }
}

"code_folding/main": trueなどの追加も機能するようです。

だから私の理解は、これが拡張機能をロードするためのcustom.jsの使用に置き換わることだと思いますか？

5
psychemedia

ノートブック _app_initialized.NotebookApp_ コードを確認すると、_static/notebook/js/main.js_イベントは引き続き発生します。

しかし、requireJSのdefine（）関数を使用してこのイベントをリッスンする必要があります：

_define([
  'base/js/namespace',
  'base/js/events'
], function(IPython, events) {
   events.on('app_initialized.NotebookApp', function() {
     // Your Code
   });
});
_

ここでコールバックが実行されます。

_custom.js_を入力した場合：

_ require(['base/js/namespace', 'base/js/events'], function(IPython, events) {
     events.on('notebook_loaded.Notebook', function() {
        console.log('require & notebook_loaded.Notebook');
    });
     events.on('app_initialized.NotebookApp', function() {
        console.log('require & app_initialized.NotebookApp');
     });
 });

 define(['base/js/namespace', 'base/js/events'], function(IPython, events) {
     events.on('notebook_loaded.Notebook', function() {
        console.log('define & notebook_loaded.Notebook');
    });
     events.on('app_initialized.NotebookApp', function() {
         console.log('define & app_initialized.NotebookApp');
     });
 });
_

コンソールの結果は次のようになります。

_define() & app_initialized.NotebookApp
define() & notebook_loaded.Notebook
require() & notebook_loaded.Notebook
_

require()を使用して、すでに発生したイベントに登録すると思います...

require()は、すべての依存関係とサブモジュールが初期化されるのを待っています... _app_initialized.NotebookApp_イベントには遅すぎる可能性があります。

3
B0ltz