Search code examples
primefacesjqplot

Different Colors in primefaces bar chart


I would like to show primefaces barchart with different colors for each bar. the most close I got is like the image:

sample

I would like to have different color those bars, like green for "on time", yellow for "warning " and red for "overdue"

I tried to used model.setSeriesColors("58BA27,FFCC33,F74A4A,F52F2F,A30303"); but if i do that each bar should be a new series, therefore I won't be able to show the labels as I wish (like the image), I got this..

enter image description here

last, how can I make it show 0,1,2,3 (integers) instead repeating 0_0_0_1_1_1_2_2_2 like the image 1 :/

thanks


Solution

  • I solved the problem by my own reading this jplot documentation, I'm posting here hope it can help someone...

    for somehow, adding extender in the tag is not working for me, I have to put it via java code:

    barModel.setSeriesColors("58BA27,FFCC33,F74A4A,F52F2F,A30303");
    barModel.setExtender("chartExtender");
    

    then javascript inside

    <h:outputScript>
                            function chartExtender() {        
                             // this = chart widget instance        
                             // this.cfg = options      
                             this.cfg.seriesDefaults.rendererOptions.varyBarColor = true;
                            }
                            </h:outputScript>
    

    and done!

    enter image description here