Bar chart color depending on the value.

Hello,

I’m doing a bar chart and I’d like that the bar with positive values had green color and red the negative values. I guess there must be a not so complicated solution for this because it’s a very logical request, but I can’t find it.

`var myChart = new Chart(ctx, {
type: ‘bar’,
data: {
labels: info.dates,
datasets: [{
label: info.label + ‘ ‘ + info.unit,
data: info.numbers,
backgroundColor: ‘green’,
borderWidth: 0,
fill: true,
pointRadius:0,
pointHitRadius: 10
}]
},
options: {
scales: {

    		xAxes:[{
    			ticks:{
    				
    			},
    			gridLines:{
    				tickMarkLength: 10,
    				drawBorder: false,
    				display: false,
    			} 
    		}],
        	yAxes:[{
        		gridLines:{
            		
        			drawBorder: false,
        			display: false,
        		},
            	ticks: {
            		beginAtZero:true, 
            	}
        	}]
   	 	}
	}
});

`

Thanks a lot.

Author: Fantashit

2 thoughts on “Bar chart color depending on the value.

Comments are closed.