Add extra data to color, classes and fontWeight callbacks

API.md

@@ -47,15 +47,15 @@ Available options as the property of the `options` object are:
 
 * `list`: List of words/text to paint on the canvas in a 2-d array, in the form of `[word, size]`.
 	* e.g. `[['foo', 12], ['bar', 6]]`
-	* Optionally, you can send additional data as array elements, in the form of `[word, size, data1, data2, ... ]` which can then be used in the callback functions of `click` and `hover` interactions.
+	* Optionally, you can send additional data as array elements, in the form of `[word, size, data1, data2, ... ]` which can then be used in the callback functions of `click`, `hover` interactions and fontWeight, color and classes callbacks.
 	* e.g. `[['foo', 12, 'http://google.com?q=foo'], ['bar', 6, 'http://google.com?q=bar']]`. 
 * `fontFamily`: font to use.
-* `fontWeight`: font weight to use, can be, as an example, `normal`, `bold` or `600` or a `callback(word, weight, fontSize)` specifies different font-weight for each item in the list. 
+* `fontWeight`: font weight to use, can be, as an example, `normal`, `bold` or `600` or a `callback(word, weight, fontSize, extraData)` specifies different font-weight for each item in the list. 
 * `color`: color of the text, can be any CSS color, or a `callback(word, weight, fontSize, distance, theta)` specifies different color for each item in the list.
   You may also specify colors with built-in keywords: `random-dark` and `random-light`. If this is a DOM cloud, color can also be `null` to disable hardcoding of
   color into span elements (allowing you to customize at the class level).
 * `classes`: for DOM clouds, allows the user to define the class of the span elements. Can be a normal class string,
-  applying the same class to every span or a `callback(word, weight, fontSize, distance, theta)` for per-span class definition.
+  applying the same class to every span or a `callback(word, weight, fontSize, extraData)` for per-span class definition.
   In canvas clouds or if equals `null`, this option has no effect.
 * `minSize`: minimum font size to draw on the canvas.
 * `weightFactor`: function to call or number to multiply for `size` of each word in the list.

src/wordcloud2.js

@@ -146,6 +146,17 @@ if (!window.clearImmediate) {
     return 0
   })()
 
+  var getItemExtraData = function (item) {
+    if (Array.isArray(item)) {
+      var itemCopy = item.slice()
+      // remove data we already have (word and weight)
+      itemCopy.splice(0, 2)
+      return itemCopy
+    } else {
+      return []
+    }
+  }
+
   // Based on http://jsfromhell.com/array/shuffle
   var shuffleArray = function shuffleArray (arr) {
     for (var j, x, i = arr.length; i;) {
@@ -507,7 +518,7 @@ if (!window.clearImmediate) {
       }
     }
 
-    var getTextInfo = function getTextInfo (word, weight, rotateDeg) {
+    var getTextInfo = function getTextInfo (word, weight, rotateDeg, extraDataArray) {
       // calculate the acutal font size
       // fontSize === 0 means weightFactor function wants the text skipped,
       // and size < minSize means we cannot draw the text.
@@ -534,7 +545,7 @@ if (!window.clearImmediate) {
       // Get fontWeight that will be used to set fctx.font
       var fontWeight
       if (getTextFontWeight) {
-        fontWeight = getTextFontWeight(word, weight, fontSize)
+        fontWeight = getTextFontWeight(word, weight, fontSize, extraDataArray)
       } else {
         fontWeight = settings.fontWeight
       }
@@ -722,26 +733,26 @@ if (!window.clearImmediate) {
     }
 
     /* Actually draw the text on the grid */
-    var drawText = function drawText (gx, gy, info, word, weight, distance, theta, rotateDeg, attributes) {
+    var drawText = function drawText (gx, gy, info, word, weight, distance, theta, rotateDeg, attributes, extraDataArray) {
       var fontSize = info.fontSize
       var color
       if (getTextColor) {
-        color = getTextColor(word, weight, fontSize, distance, theta)
+        color = getTextColor(word, weight, fontSize, distance, theta, extraDataArray)
       } else {
         color = settings.color
       }
 
       // get fontWeight that will be used to set ctx.font and font style rule
       var fontWeight
       if (getTextFontWeight) {
-        fontWeight = getTextFontWeight(word, weight, fontSize)
+        fontWeight = getTextFontWeight(word, weight, fontSize, extraDataArray)
       } else {
         fontWeight = settings.fontWeight
       }
 
       var classes
       if (getTextClasses) {
-        classes = getTextClasses(word, weight, fontSize)
+        classes = getTextClasses(word, weight, fontSize, extraDataArray)
       } else {
         classes = settings.classes
       }
@@ -910,8 +921,10 @@ if (!window.clearImmediate) {
       }
       var rotateDeg = getRotateDeg()
 
+      var extraDataArray = getItemExtraData(item)
+
       // get info needed to put the text onto the canvas
-      var info = getTextInfo(word, weight, rotateDeg)
+      var info = getTextInfo(word, weight, rotateDeg, extraDataArray)
 
       // not getting the info means we shouldn't be drawing this one.
       if (!info) {
@@ -951,7 +964,7 @@ if (!window.clearImmediate) {
 
         // Actually put the text on the canvas
         drawText(gx, gy, info, word, weight,
-          (maxRadius - r), gxy[2], rotateDeg, attributes)
+          (maxRadius - r), gxy[2], rotateDeg, attributes, extraDataArray)
 
         // Mark the spaces on the grid as filled
         updateGrid(gx, gy, gw, gh, info, item)