<jupyter_start><jupyter_text>vis_getting_started_network_javascriptThe vis.js website provides a 'getting started' example for its Network tool:http://visjs.org/docs/network/This notebook looks at recreating this in Jupyter notebooks.  Importing vis.jsIn other examples on the web, vis.js is imported into a Jupyter notebook using the require.config command. The vis package could be loaded using the local copy `require.config({paths: {vis: '../vis-4.21.0/dist/vis'}});`. However this then doesn't seem to render on nbviewer.SO instead the package is loaded from the cdnjs website.<jupyter_code>from IPython.display import Javascript
Javascript(
"""
require.config({paths: {vis: '//cdnjs.cloudflare.com/ajax/libs/vis/4.21.0/vis.min'}});

require(['vis'], function(vis){
    
    // create an array with nodes
    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}
    ]);

    // create a network
    var container = document.getElementById('mynetwork10');

    // provide the data in the vis format
    var data = {
        nodes: nodes,
        edges: edges
    };
    var options = {width: '600px',
                   height: '400px'};

    // initialize your network!
    var network = new vis.Network(container, data, options);
});
element.append("<div id='mynetwork10'></div>")
""" 
)<jupyter_output><empty_output><jupyter_text>This renders as a html document saved in the same folder as this notebook. [./vis_getting_started_network_notebook_javascript.html](./vis_getting_started_network_notebook_javascript.html)Can't load this on GitHub at present, so don't know how it is rendering.https://github.com/stevenkfirth/Jupyter_and_vis.js/blob/master/vis_getting_started_network/vis_getting_started_network_notebook_javascript.ipynbHowever this does seem to render on nbviewer. https://nbviewer.jupyter.org/github/stevenkfirth/Jupyter_and_vis.js/blob/master/vis_getting_started_network/vis_getting_started_network_notebook_javascript.ipynb?flush_cache=true<jupyter_code>'test'<jupyter_output><empty_output>
{'fraction_non_alphanumeric': 0.12136752136752137, 'fraction_numerical': 0.015384615384615385, 'mean_word_length': 3.787321063394683, 'pattern_counts': {'":': 0, '<': 11, '<?xml version=': 0, '>': 11, 'https://': 2, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'chain_length': '2', 'dir': 'jupyter-structured-clean-dedup', 'id': '512035', 'license': 'MIT', 'n_tokens_mistral': 798, 'n_tokens_neox': 742, 'n_words': 209, 'path': 'vis_getting_started_network/vis_getting_started_network_notebook_javascript.ipynb', 'repo_name': 'stevenkfirth/Jupyter_and_vis.js', 'size': '2340'}