* ---------------------------------------
* This demo was created using amCharts 4.
* For more information visit:
* https://www.amcharts.com/
* Documentation is available at:
* https://www.amcharts.com/docs/v4/
* ---------------------------------------
am4core.useTheme(am4themes_animated);
am4core.useTheme(am4themes_dataviz);
var chart = am4core.create("chartdiv", am4charts.XYChart);
var color1 = chart.colors.getIndex(0);
var color2 = chart.colors.getIndex(1);
var categoryAxis = chart.xAxes.push(new am4charts.CategoryAxis());
categoryAxis.dataFields.category = "category";
categoryAxis.renderer.grid.template.location = 0;
categoryAxis.renderer.grid.template.disabled = true;
categoryAxis.renderer.labels.template.disabled = true;
var valueAxis = chart.yAxes.push(new am4charts.ValueAxis());
function createSeries(field, name) {
var series = chart.series.push(new am4charts.ColumnSeries());
series.dataFields.valueY = field;
series.dataFields.categoryX = "category";
series.clustered = false;
createSeries("value1", "Series 1");
createSeries("value2", "Series 2");
function createRange(from, to, label) {
var range = categoryAxis.axisRanges.create();
range.label.text = label;
createRange("1", "2", "Research");
createRange("3", "4", "Marketing");
createRange("5", "6", "Distribution");
chart.legend = new am4charts.Legend();