jqxChart Column type

[QualiAdminParticipant]

I have created a chart and want to set the column series color based on value. I have trying to find a way to do this for over an hour and have given up. Below is the seriesGroups section of the chart settings. When I use this code I get the following error. Error: Object doesn’t support property or method ‘indexOf’

Please Help, how can I do this.

seriesGroups:
[
{
type: ‘column’,
columnsGapPercent: 20,
seriesGapPercent: 0,
//toolTipFormatFunction: toolTipCustomFormatFn,
valueAxis:
{
unitInterval: 20,
minValue: 0,
maxValue: 100,
displayValueAxis: true,
axisSize: ‘auto’,
tickMarksColor: ‘#888888’
},
series: [
{
dataField: ‘tota’,
displayText: ‘Site’,
//showlabels: true,
//labelsVerticalAlignment: ‘top’,
color: function (value) {
switch (value) {
case 50:
return RED;
break;
case 60:
return GRN;
break;
case 70:
return YEL;
break;
};
},
labelsOffset: { x: 0, y: -20 },
formatFunction: function (value, itemIndex) {
var dataItem = source[itemIndex];
return Math.round(value) + ‘%’ + ‘ [‘ + dataItem.Y + ‘/’ + dataItem.N + ‘]’;
}
}],

[QualiAdminParticipant]

` seriesGroups:
[
{
type: ‘column’,
columnsGapPercent: 20,
seriesGapPercent: 0,
//toolTipFormatFunction: toolTipCustomFormatFn,
valueAxis:
{
unitInterval: 20,
minValue: 0,
maxValue: 100,
displayValueAxis: true,
axisSize: ‘auto’,
tickMarksColor: ‘#888888’
},
series: [
{
dataField: ‘tota’,
displayText: ‘Site’,
//showlabels: true,
//labelsVerticalAlignment: ‘top’,
color: function (value) {
switch (value) {
case 50:
return RED;
break;
case 60:
return GRN;
break;
case 70:
return YEL;
break;
};
},
labelsOffset: { x: 0, y: -20 },
formatFunction: function (value, itemIndex) {
var dataItem = source[itemIndex];
return Math.round(value) + ‘%’ + ‘ [‘ + dataItem.Y + ‘/’ + dataItem.N + ‘]’;
}
}],

[DimitarParticipant]

Hello QualiAdmin,

This functionality can be achieved with the colorFunction callback. Please refer to the following demo to see it in action: http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxchart/javascript_chart_series_conditional_colors.html?arctic.

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/

[Author]

Posts