CODEWITHSUNDEEP
javascriptamcharts
TomasF
TomasF

Reputation: 13

Amchart: Long label inside bar chart does not show

I'm trying to put a label inside the bars in an AmChart graph. If the label is to long it does not show. Pleas look at the JsFiddle, https://jsfiddle.net/o3518u19/4/, 

var chart = AmCharts.makeChart( "chartdiv", {
  "type": "serial",
  "theme": "light",
  "categoryField": "year",
  "startDuration": 1,
  "categoryAxis": {
    "gridPosition": "start",
    "position": "left"
  },
  "columnSpacing": 0,
  "columnWidth": 0.6,
  "graphs": [ {
    "balloonText": "Income:[[value]]",
    "labelText": "HEJ",
    "labelPosition": "inside",
    "labelRotation": 270,
    "color": "#fff",
    "fillAlphas": 0.8,
    "lineAlpha": 0.2,
    "title": "Income",
    "type": "column",
    "valueField": "income",
    "fixedColumnWidth": 25
  },
  {
    "balloonText": "Income:[[value]]",
    "labelRotation": 270,
    "labelText": "HEJA",
    "labelPosition": "inside",
    "color": "#fff",
    "fillAlphas": 0.8,
    "lineAlpha": 0.2,
    "title": "Income",
    "type": "column",
    "valueField": "income",
    "fixedColumnWidth": 25
  }],
  "valueAxes": [ {
    "stackType": "regular",
    "position": "top",
    "axisAlpha": 0
  } ],
  "dataProvider": [ {
    "year": 2005,
    "income": 23.5,
    "expenses": 18.1
  }, {
    "year": 2006,
    "income": 26.2,
    "expenses": 22.8
  }]
} );

where "HEJ" is shown but not "HEJA". I don't want to make the columns wider than 25.

Upvotes: 1

Views: 2081

Answers (1)

mike_t
mike_t

Reputation: 2691

Use "showAllValueLabels":true, this will show the longer labels and override the checking if they fit.

{
    "balloonText": "Income:[[value]]",
    "labelRotation": 270,
    "labelText": "HEJA",
    "showAllValueLabels":true,   /// add this line
    "labelPosition": "inside",
    "color": "#fff",
    "fillAlphas": 0.8,
    "lineAlpha": 0.2,
    "title": "Income",
    "type": "column",
    "valueField": "income",
    "fixedColumnWidth": 25
}

Additionaly, you can use "labelOffset" to further adjust the position of the label (in your case verticaly)

Upvotes: 2

Related Questions