Stacked Bar Flot Chart - labels inside each series of Stacked Bar

Question

I am using Flot Stacked Bar and I'm trying to display text on each series of a bar chart so it shold be something like that as you can see in the image:- Please can you have a look at my code.

Many Thanks,

Here is my code:

 <script src="../../js/jquery.flot.js"></script>
  <script src="../../js/jquery.flot.resize.js"></script>
 <script src="../../js/jquery.flot.stack.js"></script>
<div id="placeholder" style="width:600px;height:300px;"></div>
var data = [
    {label: 'foo', color:'red', data:[[1,<?php echo $red; ?>]]},
    {label: 'bar', color:'blue', data:[[1,<?php echo $blue; ?>]]},
    {label: 'baz', color:'green', data:[[1,<?php echo $green; ?>]]},
      ];

       $.plot($("#placeholder"), data, {
         series: {
        stack: 1,
       bars: {
        show: true,
        lineWidth: 1,
        barWidth: 0.8,
        order: 1, 
        fill: true, 
            label: {
            show: true,
            radius:0.7,

            formatter: function(label, series) {
                 var result =[ <?php echo $red; ?> ,<?php echo $blue; ?> ,<?php          
            echo $green; ?>

            ];

              if ( label == "red")
               { 
                 return '<div style="font-size:13px; text-align:center; left:-340px; top:-338px;    
                 position:absolute; color:white;">'+label+'<br/>'+(result[0])+'</div>';
               }
               else if (label == "Blue")
               { 
                 return '<div style="font-size:13px; text-align:center; left:-343px; top:-228px;  
                position:absolute; color:white;">'+label+'<br/>'+(result[1])+'</div>';
               }
               else if (label == "green")
               { 
                 return '<div style="font-size:13px; text-align:center; left:-325px; top:-220px;                       
               position:absolute; color:white;">'+label+'<br/>'+(result[2])+'</div>';
               }



           },
            background: {
                opacity: 0.8,

            }
        }     
    },
    yaxis : {
        min : 0,
        tickLength: 0
    } ,
    xaxis: {
    tickLength: 0,
    axisLabel: "Date",
    axisLabelUseCanvas: true,
    axisLabelFontSizePixels: 12,
    axisLabelFontFamily: 'Arial',
    axisLabelPadding: 3,
    color: "#838383",
    timeformat: "%b/%y"
    }
    }
    });