Assign js array values to a series bar chart

Suite and Optimus Suite 5
#1

Hi

I want to create a bar chart of series type, (3 bar’s similar to the example given here dhtmlx.com/docs/products/dhtmlxC … eries.html),
but I want to load the data using jsarray instead of using json.
I tried to declare the array as below:
var data = [
[100, 125, 245, 147, 67],
[85, 156, 179, 211, 123],
[97, 87, 56, 267, 157]
];

var myBarChart;
function doOnLoad() {
myBarChart = new dhtmlXChart({
view:“bar”,
container:“chart1”,
value:“#data1#”,
color: “#58dccd”,
gradient:“rising”,
tooltip:{
template:“#data1#”
},
width:60,
xAxis:{
template:function(item){
return item.$unit;
},
value:function(item){
return item.year;
},
units:{
start:2000,
end:2004,
next:function(value){
return value+1;
}
}
},
yAxis:{
start:0,
step:10,
end:100
},
legend:{
values:[{text:“Type A”,color:“#58dccd”},{text:“Type B”,color:“#a7ee70”},{text:“Type C”,color:“#36abee”}],
valign:“middle”,
align:“right”,
width:90,
layout:“y”
}
});
myBarChart.addSeries({
value:“#data2#”,
color:“#a7ee70”,
tooltip:{
template:“#data2#”
}
});
myBarChart.addSeries({
value:“#data3#”,
color:“#36abee”,
tooltip:{
template:“#data3#”
}
});
myBarChart.parse(data,“jsarray”);
}

the x and y-axis are displayed but the values are not being plotted.
can anyone help in using jsarray for this chart?

result.png901×261 3.66 KB

#2

Hello,

the x and y-axis are displayed but the values are not being plotted.

You specified incorrect xAxis. You need to change “value” and “units” definition there. If xAxis values correspond the first element of datasource arrays. The value method should return item.data0. Also there is a mistake in units definition. Try to set start:80 and end:100 in this case values from datasource will be included:

xAxis:{ template:function(item){ return item.$unit; }, value:function(item){ return item.data0; }, units:{ start:80, end:100, next:function(value){ return value+1; } } },

#3

Hi Thanks for the reply will make the corrections, but it does work when I declare the array as below:
var data = [
[20, 35, 55, 02],
[40, 24, 40, 03],
[44, 20, 27, 04],
[23, 50, 43, 05],
[21, 36, 31, 06],
[50, 40, 56, 07],
[30, 65, 75, 08],
[90, 62, 55, 09],
[55, 40, 60, 10]

];