数据标签未显示为Highcharts

5 javascript css jquery charts highcharts

我正在尝试显示数据标签.但DATALABEL黑色条没有显示.为什么?

http://jsfiddle.net/o4pt855e/

其他酒吧显示得很好.我借此机会问我怎样才能提出一个条件?如果该值小于5,则DATALABEL显示在左侧,否则显示在右侧.

$(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"

      }]
    });
});
Run Code Online (Sandbox Code Playgroud)

Seb*_*han 5

Defaulty每个数据标签都有一个填充,当重叠其他标签时,则隐藏.因此,您需要将填充设置为0并将allowOverlap选项设置为true.

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
                    }

                }
            }
        },
Run Code Online (Sandbox Code Playgroud)

http://jsfiddle.net/vj19ukbc/