amcharts showing value inside bar

Question

I'm using amCharts, and i want to show values inside bar

This is how it looks at the moment:

and I want it to be like this:

This is my code to display chart:

AmCharts.ready(function() {

    generateWidgetData('week');
    // SERIAL CHART
    chart = new AmCharts.AmSerialChart();
    chart.dataProvider = graphData;
    chart.categoryField = 'date';
    chart.startDuration = 1;
    chart.columnWidth = 0.60;
    chart.dataDateFormat = 'YYYY-MM-DD';
    chart.startEffect = 'easeInSine';
     chart.stackType =  'regular';
    // AXES
    // category
    var categoryAxis = chart.categoryAxis;
    categoryAxis.parseDates = true;
    categoryAxis.minPeriod = 'DD';
    categoryAxis.plotAreaBorderAlpha = 0.01;
    categoryAxis.labelRotation = 90;
    categoryAxis.axisThickness = 0;
     categoryAxis.stackType =  'regular';
    categoryAxis.gridThickness = 0;

    categoryAxis.inside = false;
    //categoryAxis.gridPosition = 'start';
    //categoryAxis.startDate = '2014-05-08';


    // value
    // in case you don't want to change default settings of value axis,
    // you don't need to create it, as one value axis is created automatically.

    // GRAPH
    var graph = new AmCharts.AmGraph();
    graph.maxColumns = 1;
    graph.valueField = 'Self-entered';
    graph.balloonText = '[[category]]: <b>[[value]]</b>';
    graph.type = 'column';
    graph.lineAlpha = 0;
    graph.labelText =  '[[value]]';     
    graph.fillAlphas = 0.8;
    graph.stackType = 'regular';                    
    chart.addGraph(graph);
    graph.cornerRadiusTop = 8;

    // CURSOR
    var chartCursor = new AmCharts.ChartCursor();
    chartCursor.cursorAlpha = 0;
    chartCursor.zoomable = false;
    chartCursor.categoryBalloonEnabled = false;
    chart.addChartCursor(chartCursor);

    chart.creditsPosition = 'top-right';

    chart.write('stepschart');
});

Thanks in advance.

Solution

I fixed this so i will post answer, maybe it will help to someone

its really simple all you need to do is to add 2 lines of code:

graph.labelText = '[[value]]'; // this will insert values in labels
graph.labelPosition = 'inside'; // and with this we put our label inside bar

Hope this will help to someone who also need to do same thing

Comments

[wang.aurora]

i use this solution in a bar graph. however label text that is logger than the bar is not visible. Do you know how to solve it?

[Sagar R]

@wang.aurora : you can use "labelRotation": 270 property.

[Muzaffar Mahmood]

I am trying to show values inside columns for 3D Column chart(am4charts.XYChart3D) but not successful yet. I am implementing this chart amcharts.com/demos/3d-column-chart . Thanks in advance for help.

[Muzaffar Mahmood]

Even show tooltip Always not working as mentioned here amcharts.com/docs/v4/reference/tooltip/#showTooltipOn_proper‌​ty.