Change image of all nodes using json data in Vivagraph
- Dominant language
- JavaScript
- Stars
- 3.9k
- Forks
- 418
- PR merge metrics
- No merged PRs in 30d
Description
Hi,
I am using vivagraph for displaying my JSON data in the form of a diagram.
However,when I am trying to change the image of all nodes according to the
JSON data the image of only the last node is changing.
I have created one svg element which I am appending to the node element.The svg element is as follows:-
var img = Viva.Graph.svg('image')
.attr('width', 24)
.attr('height', 24)
.link('images/black.png');
var ui = Viva.Graph.svg('g')
.attr('id',node.data.id);
After the JSON data is called I am storing the data and assigning colors to distinct value from the JSON data in an object named objNodeData.Then I am using graph.foreachnode to iterate the nodes but at the last color of only the last iterated node is changing.I am stuck with this issue.Please help.Thank You.
graph.forEachNode(function (node){
var nodeUI = graphics.getNodeUI(node);
if(nodeUI){
if(objNodeData[node.data.id]){
colornodesbl = objNodeData[node.data.id].colour;
}
img.link(colornodesbl);
ui.append(img);
}
});
Contributor guide
No contributing guide indexed for this repository
Research direction
Start with the provided graph.forEachNode callback and the shared SVG img and ui objects used for each node. Reproduce the JSON-driven rendering and inspect how each iteration updates and appends those elements. Done means every node displays the image or color associated with its own JSON data, rather than only the last node's value.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript
- Domain
- data-visualization, frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Needs clarification
- Newbie friendliness
- 30/100