Within the jsFiddle demo provided in this query, there is code displayed. I am curious about how I can assign images to each node.
var graph = {
"nodes":[
{"name":"1","rating":90,"id":2951},
]
}
You can access my jsFiddle Demo through this link: http://jsfiddle.net/JSDavi/qvco2Ljy/
Update 1 :
node.append("circle")
.attr("r", function(d) { return d.weight * 2+ 12; })
.style("fill", function(d) { return color(1/d.rating); });
node.append("image")
.attr("xlink:href", d=> d.url)
//people icon's location (x,y)
.attr("x", function(d) { return d.weight * 2+ 12; })
.attr("y", function(d) { return d.height * 2+ 12; })
//people icon's size
.attr("width", width/10)
.attr("height", height/10);
The above codes demonstrate how the circle and images are configured.
https://i.stack.imgur.com/yI7O3.png
Despite that, they do not merge properly.
This is the updated version of my demo : http://jsfiddle.net/qvco2Ljy/116/