डेटा लेबल नहीं दिखाया गया है हाइचार्ट्स

Question

मैं datalabels दिखाने की कोशिश कर रहा हूं। लेकिन कालाबाल काला बार दिखाया नहीं गया है। क्यूं कर?

http://jsfiddle.net/o4pt855e/

अन्य सलाखों अच्छी तरह से प्रदर्शित होते हैं। मैं यह अवसर पूछने का अवसर देता हूं कि मैं कैसे शर्त लगा सकता हूं? यदि मान 5 से कम है, तो डेटाबेल बाईं ओर दिखाया जाएगा, अन्यथा सही।

$(function() { 
$('#container').highcharts({ 
     chart: { 
      type: 'bar' 
     }, 
     title: { 
      text: 'Mi EPS' 
     }, 
     xAxis: { 
      //categories: ["number1", "number2", "number3", "number4","number5"], 
      title: { 
       text: null 
      }, 
      labels: { 

      // align: 'center', 
       x: -5, 
       y: -20, 
       useHTML: true, 
       format: '<div style="position: absolute; left: 40px"> my labelL is very large ***************************************this in other line! </div> <img style="height: 30px; width: 30px; margin-top: 10px" src="https://cdn2.iconfinder.com/data/icons/free-3d-printer-icon-set/512/Plastic_model.png"></img>' 

      } 

     }, 
     yAxis: { 

      title: { 
       text: 'Resultado', 
       align: 'right' 
      } 

     }, 
     tooltip: { 
      valueSuffix: ' dollars' 
     }, 
     plotOptions: { 
      bar: { 
       dataLabels: { 
        enabled: true, 
        align: 'left', 
        color: '#FFFFFF', 
        inside: true, 
        crop: false, 
        overflow:"none", 
         formatter: function() { 

        return this.series.name+ " "+ this.y; 

        console.log(this.series.name); 
       }, 
        style:{ 
         width:100 
        } 

       } 
      } 
     }, 
     legend: { 
      layout: 'vertical', 
      align: 'center', 
      verticalAlign: 'bottom', 
      x: -40, 
      y:40 , 
      floating: true, 
      borderWidth: 1, 
      backgroundColor: '#FFFFFF', 
      shadow: true 
     }, 
     credits: { 
      enabled: false 
     }, 
     series: [{ 
      name: 'Mejor Eps', 
      data: [1000, 950,920,880,850], 
      color: "#FF0000" 
     }, { 
      name: 'Mi Eps', 
      data: [800,770,750,740,730], 
      color: "#000000" 

     }, { 
      name: 'Peor Eps', 
      data: [600,540,535,500,0], 
      color: "#00FF00" 

     }] 
    }); 
}); 

Answer 1

डिफ़ॉल्ट प्रत्येक डेटलबेल में पैडिंग होती है और जब अन्य लेबल ओवरलैप होता है तो छुपाया जाता है। तो आपको padding 0 और allowOverlap विकल्प के रूप में सेट करने की आवश्यकता है।

plotOptions: { 
      bar: { 
       dataLabels: { 
       padding:0, 
       allowOverlap:true, 
        enabled: true, 
        align: 'left', 
        color: '#FFFFFF', 
        inside: true, 
        crop: false, 
        overflow:"none", 
         formatter: function() { 

        return this.series.name+ " "+ this.y; 

        console.log(this.series.name); 
       }, 
        style:{ 
         width:100 
        } 

       } 
      } 
     }, 

http://jsfiddle.net/vj19ukbc/