2013-03-26 3 views
3

Highcharts의 막 대형 차트 내에 레이블을 넣으려고합니다. 당신은 여기에서 볼 수있는 각 줄 위에 내 경우 :HighCharts의 각 막대 위에 레이블을 추가하는 방법

$(function() { 
    var chart; 
    $(document).ready(function() { 
    chart = new Highcharts.Chart({ 

     chart: { 
      renderTo: 'container', 
      type: 'column' 
     }, 

     title: { 
      text: 'Indicator per Sex' 
     }, 

     xAxis: { 
      categories: [ 
       'Jan', 
       'Fev', 
       'Mar', 
       'Apr', 
       'May', 
       'Jun', 
       'Jul', 
       'Aug', 
       'Sep', 
       'Oct', 
       'Nov', 
       'Dez' 
      ] 
     }, 

     yAxis: { 
      allowDecimals: false, 
      min: 0, 
      title: { 
       text: 'Consults' 
      } 
     }, 

     tooltip: { 
      formatter: function() { 
       return '<b>'+ this.x +'</b><br/>'+ 
        this.series.name +': '+ this.y +'<br/>'+ 
        'Total: '+ this.point.stackTotal; 
      } 
     }, 

     plotOptions: { 
      column: { 
       stacking: 'normal' 
      } 
     }, 

     series: [ 
     { 
     data: [29.9, 71.5, 106.4, 129.2, 144.0, 29.9, 71.5, 106.4, 129.2, 144.0, 10, 20], 
     color: '#FF0011', 
     stack: 0 
    }, { 
     data: [30, 176.0, 135.6, 148.5, 216.4, 29.9, 71.5, 106.4, 129.2, 144.0, 10, 20], 
     color: '#3333FF', 
     stack: 0 
    }, { 
     data: [29.9, 71.5, 106.4, 129.2, 144.0, 29.9, 71.5, 106.4, 129.2, 144.0, 10, 20], 
     color: '#FF0011', 
     stack: 1 
    }, { 
     data: [30, 176.0, 135.6, 148.5, 216.4, 29.9, 71.5, 106.4, 129.2, 144.0, 10, 20], 
     color: '#3333FF', 
     stack: 1 
    }, { 
     data: [29.9, 71.5, 106.4, 129.2, 144.0, 29.9, 71.5, 106.4, 129.2, 144.0, 10, 20], 
     color: '#FF0011', 
     stack: 2 
    }, { 
     data: [30, 176.0, 135.6, 148.5, 216.4, 29.9, 71.5, 106.4, 129.2, 144.0, 10, 20], 
     color: '#3333FF', 
     stack: 2 
    }] 
    }); 
    }); 
});` 

내가했지만 내가 추가 할 때 라벨을 하나 개의 레이블 각 막대를 나타납니다. 그래서, 어떻게?!

+0

레이블로 시도한 것을 보여주십시오. – SteveP

답변

9

당신의 시리즈에 이것을 추가 :

물론
dataLabels: { 
    enabled: true, 
    rotation: 0, 
    color: '#000000', 
    backgroundColor: '#FFFFFF', 
    align: 'center', 
    x: 4, 
    y: 0, 
    style: { 
     fontSize: '10px', 
     fontFamily: 'Verdana, sans-serif' 
    } 

조정 필요 .. 당신이 그것을 필요로하는 경우에 당신은 또한 많은 수를 위해 $ 기호와 쉼표를 추가 할 formatter을 추가 할 수 있습니다 ..

편집 :

plotOptions: { 
    bar: { 
     dataLabels: { 
      enabled: true 
     } 
    } 
}, 
:

당신이 당신의 플롯 옵션이 추가해야합니다 ..이 막대 차트이었다 보았다

chart demo 체크 아웃뿐만 아니라 api documentation

+1

이 방법이 효과가 있는지 알려주세요. – kingkode

+0

좋아, 각 바에 제목을 추가 할 수있었습니다. 고마워요 !! 언제든지 – PradoComp

+0

! 그게 우리가 여기있는 이유입니다. upvote 또는 선택한 답변을 주시면 감사하겠습니다. – kingkode

관련 문제