Pentaho Tools :

Pentaho C-Tools(CDE,CDF,CDA),Pentaho CE & EE Server,OLAP-Cubes,Analysis using Pivot4J, Saiku Analytics, Saiku Reporting, Ad-hoc Reporting using Interactive Reporting Tool,Dashboards,Reports using PRD, PDD,Data Integration using Kettle ETL,Data Mining usign WEKA,Integration of Servers with Databases,Mobile/iPad compatible Dashboards using Bootstrap Css,Drilldown dashboards,Interactive Dashboards

Wednesday 29 October 2014

Fill Colour of bar(s) based on a condition in Pentaho CDE

This post will talk about conditional colours of bars with below like scenarios.

Sample Scenario : 
Print bar color as red when bar value <=2000
Print bar color as green when bar value >2000 and <10000
Print bar color as black when bar value>=10000

Scenario 2 : 
When representing -Ve values on charts .. this kind of representation is preferable. 

Code is Taken from Reference links :


function changeBars(){
var cccOptions = this.chartDefinition;

// For changing extension points, a little more work is required:
var eps = Dashboards.propertiesArrayToObject(cccOptions.extensionPoints);

// add extension points:
eps.bar_fillStyle = function getColor(){
var val = this.scene.vars.value.value;

if(val > 0 && val <= 5000){
return 'red';
}
else if(val > 5000 && val <= 50000){
return 'green';
}
else{
return 'black';
}
};

// Serialize back eps into cccOptions
cccOptions.extensionPoints = Dashboards.objectToPropertiesArray(eps);
}



NOTE : I have tried directly in Extension points but it did not work. 

Sample output 1 : 
Sample output 2 : 

function changeBars(){
var cccOptions = this.chartDefinition;

// For changing extension points, a little more work is required:
var eps = Dashboards.propertiesArrayToObject(cccOptions.extensionPoints);

// add extension points:
eps.bar_fillStyle = function getColor(){
var val = this.scene.vars.value.value;

if(val == 26297.2900){
return 'black';
}
else{
return 'blue';
}
};

// Serialize back eps into cccOptions
cccOptions.extensionPoints = Dashboards.objectToPropertiesArray(eps);
}



References : 

http://translate.google.com/translate?&ie=UTF-8&sl=&tl=en&u=http://www.redopenbi.com/group/ctools/forum/topics/colores-en-bar-chart?commentId=2400100%3AComment%3A103280&xg_source=activity&groupId=2400100%3AGroup%3A73260

OR

http://www.redopenbi.com/group/ctools/forum/topics/colores-en-bar-chart?commentId=2400100%3AComment%3A103280&xg_source=activity&groupId=2400100%3AGroup%3A73260

OR

http://forums.pentaho.com/showthread.php?150582-Bar-chart-colors-dynamically-changed-based-on-data-value-Along-with-JavaScript-vars

1 comment: