You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
In the context of working on another project i had to fork this library and add features to it.
As a first feature i added a highlight nodes children function wich blur any other nodes wich is not the children of the selected node.
The function works as expected, but there's an infinite loop when i call any method related to state.forceGraph.
In this copied code where there is console.log(" there is loop here") that means the infinite loop detected there
Also, consolo.log(" No loop here") means that no loop found there, jsut to clarify that the function itself does not loop but state.forceGraph does.
Any advice or idea willbe appreciated
The method is added in force-graph.js
`highlightNeighbors: async function (state, node) {
if (!state.canvas) return null;
consolo.log(" No loop here")
// getting the current canvas
const ctx = state.canvas.getContext("2d");
const highlightNodes = new Set();
const highlightLinks = new Set();
//filling the two sets with the connected nodes and edges to node
const addNeighbors = async (highlightNodes, highlightLinks, node) => {
return new Promise((resolve) => {
if (node) {
highlightNodes.add(node);
node.neighbors.forEach((neighbor) => highlightNodes.add(neighbor));
node.links.forEach((link) => highlightLinks.add(link));
}
resolve();
});
};
await addNeighbors(highlightNodes, highlightLinks, node);
const getNodeColor = accessorFn(state.nodeColor);
//! ********************************************************* !\\
//! we have an optimization problem, kind of infinite loop !\\
//! ********************************************************** !\\
const g = state.forceGraph()(ctx).graphData(state.graphData);
g.linkWidth((link) => {
console.log(" there is loop here")
return highlightLinks.has(link) ? 2 : 1;
});
g.linkDirectionalParticles((link) => {
console.log(" there is loop here")
return highlightLinks.has(link) ? 4 : 0;
});
g.nodeVal((node) => {
console.log(" there is loop here")
return highlightNodes.has(node) ? 3 : 2;
});
g.nodeColor((node) => {
console.log(" there is loop here")
if (highlightNodes.size === 0) {
return getNodeColor(node);
} else if (!highlightNodes.has(node)) {
return "rgba(128,128,128,0.2)";
} else {
return getNodeColor(node);
}
});
},`
And i call it in the html file like this : <script> fetch("../datasets/miserables.json") .then((res) => res.json()) .then((data) => { const elem = document.getElementById("graph"); const Graph = ForceGraph()(elem) .graphData(data) .nodeLabel("id") .nodeAutoColorBy("group") .onNodeHover((node) => { Graph.highlightNeighbors(node); }); }); </script>
The text was updated successfully, but these errors were encountered:
In the context of working on another project i had to fork this library and add features to it.
As a first feature i added a highlight nodes children function wich blur any other nodes wich is not the children of the selected node.
The function works as expected, but there's an infinite loop when i call any method related to state.forceGraph.
In this copied code where there is console.log(" there is loop here") that means the infinite loop detected there
Also, consolo.log(" No loop here") means that no loop found there, jsut to clarify that the function itself does not loop but state.forceGraph does.
Any advice or idea willbe appreciated
The method is added in force-graph.js
`highlightNeighbors: async function (state, node) {
if (!state.canvas) return null;
consolo.log(" No loop here")
And i call it in the html file like this :
<script> fetch("../datasets/miserables.json") .then((res) => res.json()) .then((data) => { const elem = document.getElementById("graph"); const Graph = ForceGraph()(elem) .graphData(data) .nodeLabel("id") .nodeAutoColorBy("group") .onNodeHover((node) => { Graph.highlightNeighbors(node); }); }); </script>
The text was updated successfully, but these errors were encountered: