chrisrzhou / react-wordcloud

☁️ Simple React + D3 wordcloud component with powerful features.
https://react-wordcloud.netlify.app
MIT License
210 stars 138 forks source link

How to assign fixed color to individual word? #107

Open Maxwell-Wong opened 1 year ago

Maxwell-Wong commented 1 year ago

I want to assign fixed color to the words with same frequency, and the words with higher frequency will also have deeper color. I have generated the color array for each word. Is there any way to turn off the random assignment of the color and assign each word with self-defined color from the options? Thank you!

Maxwell-Wong commented 1 year ago

As we have determined the color for each word, but the behaviour of the wordcloud seems to shuffle the color array and assign the color to each word randomly within the given colors. What we are caring about is disabling the random mechanism and assign the color to each word along the sequence of the color in the color array.

juanabal commented 1 year ago

you could use the callback getWordColor like this: getWordColor: word => word.value > 50 ? "blue" : "red",

<ReactWordcloud
    callbacks={{
      getWordColor: (word) => word.value > 50 ? "blue" : "red"
    options={options}
    words={words}
    }}
 />