Use code splitting import() for vis-network
Some checks failed
continuous-integration/drone/push Build is failing

This commit is contained in:
Peter Stuifzand 2021-08-18 21:40:56 +02:00
parent 5bed4d4652
commit 0b7c2323ad

View File

@ -1,59 +1,67 @@
import {DataSet} from "vis-data/peer"; // import {DataSet} from "vis-data/peer";
import {Network} from "vis-network/peer"; // import {Network} from "vis-network/peer";
import $ from 'jquery'; import $ from 'jquery';
function wikiGraph(selector, options) { function wikiGraph(selector, options) {
$(selector).each(function (i, el) { Promise.all([
let $el = $(el) import("vis-data/peer"),
var nodeName = $el.data('name') import("vis-network/peer"),
fetch('/api/graph?name=' + nodeName) ]).then(imports => {
.then(res => res.json()) const DataSet = imports[0].DataSet
.then(graph => { const Network = imports[1].Network
var nodes = new DataSet(graph.nodes)
var edges = new DataSet(graph.edges)
var data = { $(selector).each(function (i, el) {
nodes: nodes, let $el = $(el)
edges: edges var nodeName = $el.data('name')
}; fetch('/api/graph?name=' + nodeName)
.then(res => res.json())
.then(graph => {
var nodes = new DataSet(graph.nodes)
var edges = new DataSet(graph.edges)
var options = { var data = {
edges: { nodes: nodes,
arrows: 'to', edges: edges
color: { };
highlight: 'green'
}, var options = {
chosen: { edges: {
edge: function (values, id, selected, hovering) { arrows: 'to',
if (this.from === 1) { color: {
values.color = 'blue'; highlight: 'green'
},
chosen: {
edge: function (values, id, selected, hovering) {
if (this.from === 1) {
values.color = 'blue';
}
} }
} }
} },
},
nodes: { nodes: {
shape: 'dot', shape: 'dot',
size: 15, size: 15,
font: { font: {
background: 'white' background: 'white'
}
},
layout: {
improvedLayout: true
} }
}, };
layout: {
improvedLayout: true
}
};
var network = new Network(el, data, options); var network = new Network(el, data, options);
network.on('doubleClick', function (props) { network.on('doubleClick', function (props) {
if (props.nodes.length) { if (props.nodes.length) {
let nodeId = props.nodes[0] let nodeId = props.nodes[0]
let node = nodes.get(nodeId) let node = nodes.get(nodeId)
// TODO: Reload directly in this same page // TODO: Reload directly in this same page
window.location.href = '/edit/' + node.label window.location.href = '/edit/' + node.label
} }
})
}) })
}) })
}) })
} }