Try local javascript

Links: notebook, html, PDF, python, slides, GitHub

Use javascript in a notebook with local scripts.

from jyquickhelper import add_notebook_menu
add_notebook_menu()

JSJSON

from jyquickhelper import JSONJS
JSONJS(dict(name="xavier", city="Paris"), only_html=True, show_to_level=3, local=True)

The function copies the javascript code in the current folder.

import os
[_ for _ in os.listdir(os.getcwd()) if '.js' in _]

['custom_demo.js', 'renderjson.js', 'vis.min.js', 'viz-lite.js', 'viz.js']

RenderJsDot

from jyquickhelper import RenderJsDot

dot = """
digraph {
    d[label="longer label"];
    a -> b -> c;
    b -> d;
}
"""

RenderJsDot(dot, local=True)

RenderJsVis

script = """
  var nodes = new vis.DataSet([
    {id: 1, label: 'Node 1'},
    {id: 2, label: 'Node 2'},
    {id: 3, label: 'Node 3'},
    {id: 4, label: 'Node 4'},
    {id: 5, label: 'Node 5'}
  ]);

  // create an array with edges
  var edges = new vis.DataSet([
    {from: 1, to: 3},
    {from: 1, to: 2},
    {from: 2, to: 4},
    {from: 2, to: 5},
    {from: 3, to: 3}
  ]);

  // create a network
  var data = {
    nodes: nodes,
    edges: edges
  };
  var options = {};
"""

from jyquickhelper import RenderJsVis
RenderJsVis(script, local=False, width="400px", height="300px")

RenderJsVis with DOT

[DOT](https://en.wikipedia.org/wiki/DOT_(graph_description_language) is quite popular to desccribe graph.

from jyquickhelper import RenderJsVis

dot = """
digraph {
    d[label="longer label"];
    a -> b -> c;
    b -> d;
}
"""

RenderJsVis(dot=dot, local=True)

RenderJsVis(dot=dot, local=True, layout="hierarchical", height="200px")