CODEWITHSUNDEEP
jqueryflot
Lorenzo
Lorenzo

Reputation: 1049

Flot: show numbers on stacked chart

I'm using Plot to display different charts, and the plugin flot-barnumbers-enhanced to display values on them.

The problem is with the stacked charts, the output is like this:

enter image description here

The first problem is regarding the position on the labels, and the second is that I need the value of the single portion, not the sum as it is currently happening.

My formatter is:

formatter: function (value) {
     return value.toFixed(2) + '%';
}

Upvotes: 0

Views: 2289

Answers (1)

mechenbier
mechenbier

Reputation: 3067

I built a fiddle with sample data to illustrate how to use the barnumbers and stacked plugins together. The options below place the bar number in the middle of the stacked bar section:

var options = {
    series: {
        bars: {
            show: true,
            barWidth: .9,
            align: "center",
            numbers: {
                show: true,
                formatter: function (value) {
                    return value.toFixed(2) + '%';
                },
                xAlign: function(x){
                    return x;
                },
                //xOffset: 15,
                //yOffset: 20
            }
        }
        stack: true
    }
};

The xAlign function returns the x value, which is the horizontal center of the bar. You can use xOffset or yOffset options to specify a pixel offset of the bar number labels.

I wasn't able to reproduce the fiddle using the sum of bars like you mentioned.

Upvotes: 2

Related Questions