search

jasondavies / d3-cloud

Create word clouds in JavaScript.
https://www.jasondavies.com/wordcloud/
Other
3.85k stars 1.07k forks source link

Coloring words in the cloud #2

Closed ghost closed 12 years ago

ghost commented 12 years ago

Hi,

I want to know how to color differently each word in the cloud ?

Thanks for you help

Amine

vincenttheeten commented 12 years ago

I had the same question, I found the answer in the demo.

var fill = d3.scale.category20();
...
.style("fill", function(d) { return fill(d.text.toLowerCase()); })
...
jasondavies commented 12 years ago

I’ve updated the example to include some colour, but this is really a D3.js usage question.

In future you might be better off asking on StackOverflow or the d3-js Google Group. GitHub issues are meant to be for bugs only. Thanks!

Honghe commented 6 years ago

in d3 v4, use as follow:

var color = d3.scaleOrdinal(d3.schemeCategory10);
alexresolute commented 1 year ago

This no longer works. Is using custom style deprecated? At a skim, it almost looks like the textFill is hard coded to red...

jankapunkt commented 1 year ago

@alexresolute

Looking at the example from the /examples folder I simply added this after the font family style:

...
    .style('font-family', 'Impact')
    .style('fill', function (d) {
      return randomColor()
    })
...

// this is of course just an example, taken from 
// https://stackoverflow.com/a/25873123/3098783
const randomColor = () => {
  return 'hsla(' + (Math.random() * 360) + ', 100%, 50%, 1)';
}