Os gráficos altos alteram dinamicamente a cor da barra com base no valor
Estou criando um gráfico de tipo de coluna usando dados json. Aqui está a função JS que eu chamo para obter os dados usando a chamada ajax e plotar o gráfico.
function getChart(){
var categorySeries = [];
var dataSeries = [];
var url = "CallToControllerURL";
$.getJSON(url, function(response) {
$.each(response, function(i, item) {
categorySeries .push(response[i].dateVal);
dataSeries.push(response[i].count);
});
$('#chartDiv').highcharts({
chart : {type : 'column'},
title : {text : 'Date vs Count'},
xAxis : {categories : categorySeries, crosshair : true},
yAxis : {allowDecimals: false, min : 0, title : { text : 'Count'}},
plotOptions : { column : { pointPadding : 0.2, borderWidth : 0, allowPointSelect: true } },
series : [ {name : 'Nbr of Records',data : dataSeries } ]
});
});
}
Quero poder modificar a cor da barra para qualquer dia se a contagem for maior que um valor específico, digamos 10.
É assim que o json entra na função.
[{"id":3,"dateVal":"2015-11-12","count":6},{"id":2,"dateVal":"2015-11-11","count":8},{"id":1,"dateVal":"2015-11-10","count":5}]
Alguma sugestão de como eu posso fazer isso?