html, body, #container {

    width: 100%;

    height: 100%;

    margin: 0;

    padding: 0;

}

anychart.onDocumentReady(function () {

​

//anychart.data.loadCsvFile("https://path_to.csv", function (data) {

​

        data =

        'Accelerate, Onsite, 15250, null, 1284,\n' +

        'CIS Others, Offshore, null, null, 11431,\n' +

        'CIS Others, 3rd Party, 2341, 1434, 1234,\n' +

        'CIS Renew, Offshore, 6451, null, 1435,\n' +

        'CIS Renew, Onsite, 715, 4134, 5344'

​

  // create a data set

 var dataSet = anychart.data.set(data);

​

  // map the data

  var seriesData_1 = dataSet.mapAs({value: 2, 'p2': 1});

  var seriesData_2 = dataSet.mapAs({value: 3});

  var seriesData_3 = dataSet.mapAs({value: 4});

​

  // create a chart

  var chart = anychart.column3d();

  chart.barGroupsPadding(0.2);

​

  // enable the value stacking mode

  chart.yScale().stackMode("value");

  chart.yAxis().labels().format('{%Value}{groupsSeparator:.} €');

​

  // create area series, set the data

  var series1 = chart.column(seriesData_1);

  series1.name("Mysirlakis Fragkiskos")

  series1.labels()          

    .position('center')

    .fontColor('white')

    .enabled(true);

  var series2 = chart.column(seriesData_2);

  series2.name("Maria Vernadoy")

  series2.labels()

    .position('center')

    .fontColor('white')

    .enabled(true);

  var series3 = chart.column(seriesData_3);

  series3.name("John Kennendy")

  series3.labels()

    .position('center')

    .fontColor('white')

    .enabled(true);

​

  chart.labels()

    .enabled(true)

    .format('{%Value}{groupsSeparator:.} €');

  chart.hovered().labels(false);

​

  chart.xScale().names('p2');

  chart.xAxis(0).ticks(false);

​

  chart.legend(true);

  chart.animation(true,1200);

  // set the container id

  chart.container("container").draw();

​

  var names = [];

  var ticks = [];

  var iter = dataSet.mapAs({'p1': 0, 'p2': 1}).getIterator();

  while(iter.advance()) {

    names.push(iter.get('p1'));

    if (names[names.length - 1] != names[names.length - 2]) {

      ticks.push(iter.getIndex());

    }

  }

  var scale2 = anychart.scales.ordinal();

  scale2.values(chart.xScale().values());

  scale2.names(names);

  scale2.ticks(ticks);

  chart.xAxis(1)

    .scale(scale2)

    .stroke('none')

    .ticks(false);

  chart.xAxis(2)

    .scale(scale2)

    .labels(false)

    .stroke('none');

  chart.xAxis(2).ticks()

    .length(87)

    .position('inside');

  // set title

  chart.title("Awesomeness");

​

  // interactivity settings and tooltip position

  chart.interactivity().hoverMode('single');

​

  chart.tooltip()

    .positionMode('')

    .position('center-top')

    .anchor('center-bottom')

    .offsetX(0)

    .offsetY(5)

    .titleFormat('{%SeriesName}')

    .format('Net Value: {%Value}{groupsSeparator:.} €');

​

  // set container id for the chart

  chart.xAxis(0).labels().rotation(90);

 // });

});