javascript - In sequences sunburst, how to give a child the same color of parent? -


what give child same colour of parent lighter, used following generate colour

   var color = d3.scale.category20b();   .style("fill", function(d) { return color((d.children ? d : d.parent).name); }) 

this code gives random colour each node. first image : random colour

the next image need, code produce randomly. gradient colour

i want make colour of child lighter colour of parent.

sorry, put result images link because not have enough reputation. thank you

this interesting one. bulk of work in setting colors , associated web page types. had weird issues when trying use d3.interpolatestring() , have shelved later investigation. in case, here preparation piece:

var brewercolors = d3.entries(colorbrewer); // offsets 1-5 similar // offsets 6-13 offer greatest contrast // offsets 4 , above no var breweroffset = 9; var pagetypes = ["home","product","search","account","other","end"]; var colors = []; var pages = []; (var ct=0; ct<pagetypes.length; ct++) {     var colorbucket = brewercolors[ct + breweroffset].value[pagetypes.length];     (var ct2=0; ct2<colorbucket.length; ct2++) {         pages.push(pagetypes[ct] + (ct2 + 1));         colors.push(colorbucket[ct2]);     } }  var ramps = d3.scale.ordinal()     // not reverse if center colors lighter edge colors     .domain(pages.reverse())     .range(colors); 

after that, filling shapes appropriate colors simple:

var path = vis.data([json]).selectall("path")     .data(nodes)     .enter().append("svg:path")     ...     .style("fill", function(d) {         return ramps(d.name + d.depth); // e.g. product1, home2, etc.     })     ... 

here complete working plunk.

note: suggest fork plunk not lost if gets inadvertently deleted later.


Comments

Popular posts from this blog

database - VFP Grid + SQL server 2008 - grid not showing correctly -

jquery - Set jPicker field to empty value -

.htaccess - htaccess convert request to clean url and add slash at the end of the url -