CODEWITHSUNDEEP
amcharts
Davio
Davio

Reputation: 41

How to remove space between bars (graphs) in amchart

I am using Amchart. I have three graphs in a single chart and I find small empty space between those graphs.

Could you please some one help me how to remove those empty space between graphs.

Upvotes: 2

Views: 4039

Answers (1)

martynasma
martynasma

Reputation: 8595

To eliminate spacing between columns of different graphs, set columnSpacing to zero.

var chart = AmCharts.makeChart("chartdiv", {
  "type": "serial",
  "theme": "light",
  "dataProvider": [{
    "country": "USA",
    "value1": 2025,
    "value2": 1876
  }, {
    "country": "China",
    "value1": 1882,
    "value2": 800
  }, {
    "country": "Japan",
    "value1": 1809,
    "value2": 2001
  }, {
    "country": "Germany",
    "value1": 1322,
    "value2": 1399
  }, {
    "country": "UK",
    "value1": 1122,
    "value2": 900
  }, {
    "country": "France",
    "value1": 1114,
    "value2": 987
  }, {
    "country": "India",
    "value1": 984,
    "value2": 200
  }],
  "graphs": [{
    "fillAlphas": 0.9,
    "lineAlpha": 0.2,
    "type": "column",
    "valueField": "value1"
  }, {
    "fillAlphas": 0.9,
    "lineAlpha": 0.2,
    "type": "column",
    "valueField": "value2"
  }],
  "categoryField": "country",
  "columnSpacing": 0
});
html, body {
  width: 100%;
  height: 100%;
  margin: 0px;
}

#chartdiv {
	width: 100%;
	height: 100%;
}
<script src="//www.amcharts.com/lib/3/amcharts.js"></script>
<script src="//www.amcharts.com/lib/3/serial.js"></script>
<script src="//www.amcharts.com/lib/3/themes/light.js"></script>

<div id="chartdiv"></div>

If you would also like to eliminate the spacing between categories, you can set columnWidth to zero as well.

Upvotes: 3

Related Questions