Use code splitting import() for vis-network
Some checks failed
continuous-integration/drone/push Build is failing
Some checks failed
continuous-integration/drone/push Build is failing
This commit is contained in:
parent
5bed4d4652
commit
0b7c2323ad
|
@ -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
|
||||||
}
|
}
|
||||||
|
})
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue
Block a user