D3plus Graph

HTML

<script src="https://raw.githubusercontent.com/alexandersimoes/d3plus/master/d3plus.full.min.js"></script>
<script src="https://rawgit.com/alexandersimoes/d3plus/master/d3plus.full.min.js"></script>
<div id="viz"></div>

CSS

rect.d3plus_data{
    stroke-width:10px !important;
    stroke: white !important;
}

.d3plus_edge_line line{
    stroke: white !important;    
    stroke-width:10px !important;
}
.d3plus_label{
    display:none;
}
#bg{
    fill: #ddd !important;
}

JavaScript

var sample_data = [
    {"name": "alpha", "size": 9},
    {"name": "beta", "size": 9},
    {"name": "gamma", "size": 9},
  ]

  // create list of node positions
  var positions = [
    {"name": "alpha", "x": 60, "y": 100},
    {"name": "beta", "x": 240, "y": 200},
    {"name": "gamma", "x": 240, "y": 60}
  ]
  
  // create list of node connections
  var connections = [
    {"source": "alpha", "target": "beta"},
    {"source": "alpha", "target": "gamma"}
  ]
  
  // instantiate d3plus
  var visualization = d3plus.viz()
    .container("#viz")
    .data(sample_data)
    .size("size")
    .type("network")    
    .nodes(positions)   
    .edges(connections)
    .edges({"arrows": true})
    .zoom(true)
    .id("name")
    .draw()
    
   function obtenerImagen(nodo) {
   		if(nodo.name == "gamma"){
        	return "hola";
        }
        return nodo.name;
   }
    
  setTimeout(function(){
      var node = d3.selectAll(".d3plus_rect")
      	.append("g")
        .attr("fill", "back");
        node.append("image")
      	.attr("xlink:href", "https://github.com/favicon.ico")
        .attr("width", 16)
      .attr("height", 16);
        node.append("text")
        	.text(function(d){
            	console.log(d);
                
                return obtenerImagen(d);
            });
 
  }, 1000)