I cannot figure out how to use the preRender function to have colors for the category labels depending on their value.
For instance: using your default chart (with ‘finger’) I would like to have “Middle” with a diferent color than “Thumb”.
I found a valid statement for the whole axis or all labels (config.categoryAxis.color = “black”; config.categoryAxis.labels.color = “#50AF4B”
but don’t know how to make it variable.
Not sure if it works in all browsers, but you can try this:
[code]var handlers = {};
handlers.preRender = function(config, logger, processor, el) {
logger.debug('Configuration: ', config);
var isReady = false;
el.on(“DOMSubtreeModified”,function(){
if (!isReady) {
var index = $(‘svg’).find(‘g[clip-path]’);
for (var i = 0; i < data.items.length; i++){
currentColor = data.items[i].colorLabel;
index.next().children().attr(‘fill’, currentColor);
index = index.next();
console.log(index.children().attr(‘fill’));
isReady = true;
}
return true;
}
});
}[/code]
Where ‘colorLabel’ is a list column containing the color.
When I use this in the ‘standard’ Finger chart it seems to work (although I’m not sure w.r.t. the browsers).
However, I tyr to use it in a chart that combines task data from multiple subsites (one of your examples), using this code:
var handlers = {};
handlers.preRender = function(config, logger, processor, el) {
logger.debug('Configuration: ', config);
var isReady = false;
el.on(“DOMSubtreeModified”,function(){
if (!isReady) {
var index = $(‘svg’).find(‘g[clip-path]’);
for (var i = 0; i < data.items.length; i++){
// console.log(data.items[i].Project, data.items[i].Project[0]);
currentColor = “black”;
if (data.items[i].Project[0] == “<”) {
console.log(data.items[i].Project[0]);
currentColor = “#red”;
}
index.next().children().attr(‘fill’, currentColor);
index = index.next();
console.log(index.children().attr(‘fill’));
isReady = true;
}
return true;
}
});
}
And then all catagory labels just look black.
Any suggestions?
Kind Regards
Besides that, …
The code can be used while in Designer mode.
As soon as I save the code and return to ‘real mode’ the code seems to get into some loop,
and the page isn’t responsive anymore.
Hi,
Our support team can assist you with the task. Please, send the detailed description of the case to support@spchart.com and we will estimate it in support minutes.