ankane/vue-chartkick

how to show value in top of Column chart | Highcharts

Closed this issue · 3 comments

ramprakashjagadeesan commented

Hi,

I need to show the value in top of each column chart. I don't know how to set it. can you help me please.

<column-chart lable="Value" height="400px" xtitle="City" :data="series" :library="plotOptions"
    ></column-chart>

data(){
            return{
                plotOptions: {
                    series: {
                        borderWidth: 0,
                        dataLabels: {
                            enabled: true
                        }
                    }
                },
            }
        },

I tried with this. help me to resolve it. My expectation like below image.

image

ankane commented

Hey @ramprakashjagadeesan, unfortunately, I don't have the bandwidth to help with library options. I'd try posting on Stack Overflow.

ramprakashjagadeesan commented

@ankane What was the solution to show the data labels in each bar

hemanthguptha commented

@ramprakashjagadeesan , Try to use dataLabels inside series attribute. see below -

series: [{
name: series_name,
data: data,
dataLabels: {
enabled: true,
rotation: 360,
color: '#FFFFFF',
align: 'center',
y: -10,
x: 0,
style: {
fontSize: '10px',
fontFamily: 'Verdana, sans-serif'
}
}
}]
Hope, this will help.

  • 👍1