Quantcast
Channel: Active questions tagged javascript - Stack Overflow
Viewing all articles
Browse latest Browse all 142159

Change Legends and Node to an circle image

$
0
0

I'm still new in D3.js , currently I had hand over with the project using D3.js.

May I ask about how to change the colour Scale to image ? The Nodes and Legends is related, the Node color is based on Legends.

Here with my JSON.

"colourScale":"d3.scaleOrdinal().domain([\"Low\",\"Medium\",\"High\",\"Very High\"]).range([\"#009a44\",\"#eaaa00\",\"#f68d2e\",\"#bc204b\"]);",

and here with my Javascript

    // draw nodes
    var node = svg.selectAll(".node")
      .data(force.nodes())
      .enter().append("g")
      .attr("class", "node")
     .style("fill", function(d) { 
     if(d['group']==='Low')
     {
     return "#009a44";
     }
     else if(d['group']==='Medium')
     {
     return "#eaaa00";
     }
     else if(d['group']==='High')
     {
     return "#f68d2e";
     }
     else{
      return "#bc204b"; 
     }

     })

      .style("opacity", options.opacity)
      .on("mouseover", mouseover)

      .on("mouseout", mouseout)
      .on("click", click)
      .call(drag);

Here with my screenshot of result. enter image description here


Viewing all articles
Browse latest Browse all 142159

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>