views:

27

answers:

1

I'm trying to create a bar chart where the data is grouped. Eg. let's say the first 4 bars are 'Dark Orange', the next 10 are 'Fire Brick', the next 5 are 'Dark Orchid' & the last group are Yellow. I know there's a property called groupdBars, but I'm unsure of how to utilise this:

http://www.ejschart.com/help/index.html?ejsc_barseries_properties_groupedbars.html

Anyone know how I do this? I thought I could do it like below, but it doesn't work:

var chart = new EJSC.Chart("myChart", {
  show_legend: false
});
chart.addSeries(new EJSC.BarSeries(
  new EJSC.ArrayDataHandler([
    [[1,1],[2,1],[3,1]],
    [[4,1],[5,1],[6,1]],
    [[7,1],[8,1],[9,1]],
    [[10,1],[11,1],[12,1]]
  ]),
  {
    lineWidth: 0,
    title: "The Green Series",
    groupedBars: true,
    useColorArray: true ,
    defaultColors: [
      'rgb(255,140,0)',  //DarkOrange
      'rgb(178,34,34)',  //FireBrick
      'rgb(153,50,204)',  //DarkOrchid
      'rgb(255,255,0)'  //Yellow
    ]
  }
));

I'm a bit of a newbie when it comes to Emprise... :)

A: 

Found it out myself :) You add them as separate 'series':

var chart = new EJSC.Chart("myChart", {
  show_legend: false,
  groupedBars: true
});

chart.addSeries(new EJSC.BarSeries(
  new EJSC.ArrayDataHandler([
    [1,1],[2,1],[3,1]
  ]),
  {
    lineWidth: 0,
    color: "rgb(255,140,0)"
  }
));

chart.addSeries(new EJSC.BarSeries(
  new EJSC.ArrayDataHandler([
    [4,1],[5,1],[6,1]
  ]),
  {
    lineWidth: 0,
    color: "rgb(178,34,34)"
  }
));

etc

WastedSpace