d3.js - Fixing color to each path for donut in d3js -



d3.js - Fixing color to each path for donut in d3js -

i drawing donut in d3js. had 3 values in array dataset (e.g totalpop, ruralpop,urbanpop-----> [1000,2000,3000]).i want these values fill specific color in donut (e.g totalpop - reddish color,ruralpop - blue, urbanpop-orange)

below have tried in code

var color = d3.scale.ordinal() .domain([totalpop,ruralpop,urbanpop]) .range(["red","blue","orange"]); var dataset = [parseint(totalpop),parseint(ruralpop),parseint(urbanpop)]; var arc = d3.svg.arc() .innerradius(r-20) .outerradius(r); var pie = d3.layout.pie() .value(function(dataset){return dataset;});

the main code color appending

var arcs = groupx.selectall(".arc") .data(pie(dataset)) .enter() .append("g") .attr("class","arc");

here have added color path

arcs.append("path") .attr("d",arc) .attr("fill",function(dataset){return color(dataset.data)});

i have found solution, here goes, instead of adding @ end have added color the path when creating

var color = d3.scale.ordinal() .domain(parseint(totalwater),parseint(ruralwater),parseint(urbanwater)) .range(["red","blue","orange"]); var arcs = groupx.selectall(".arc") .data(pie(dataset)) .enter() .append("g") .attr("class","arc") .attr("fill",function(dataset,i){return color(i)}) arcs.append("path") .attr("d",arc)

d3.js

Comments

Popular posts from this blog

Delphi change the assembly code of a running process -

json - Hibernate and Jackson (java.lang.IllegalStateException: Cannot call sendError() after the response has been committed) -

C++ 11 "class" keyword -