2013-07-31 1 views
4

검색 중이었습니다. 그래픽 아래쪽에 Highcharts 데이터 라벨을 고칠 수있는 쉬운 방법을 찾을 수 없습니다. 내가 찾고있는 것은 기둥 형 차트의 경우 다음과 같습니다.Highcharts 데이터 라벨을 하단으로 수정하십시오.

80 - ┌──┐  ┌──┐ ┌──┐ 
40 - | | ┌──┐ | | | | 
    0 -|_|__|_|__|_|_|__|_|__|_| 
     80 40  80 80 
     Cat 1  Cat 2 

도움 주셔서 감사합니다.

답변

3

각 elemetn을 반복 할 수 있으며 SVG 요소를 "이동"할 수있는 translate 함수를 사용할 수 있습니다. 간단한 예제를

var bottom = chart.plotHeight - 20; 

    $.each(chart.series[0].data,function(i,data){ 

     data.dataLabel.attr({ 
      y: bottom 
     }); 
    }); 

를 적어 보면 :

http://jsfiddle.net/wMLg6/39/

+0

고마워,이 완벽하게 작동합니다. 너무 나쁘면 위치를 다시 계산하지 않고도 쉬운 방법이 아닙니다. –

2

다음 코드는 도움이된다고 생각합니다. stacking이 트릭입니다. 차트에 따라 y 값을 변경하십시오.

plotOptions:{ 

    column:{ 
     stacking:'normal', 
    dataLabels:{ 
     enabled:true, 
     verticalAlign:'bottom', 
     y:40 
    } 
    }, 
}, 
+0

이 코드는 확실히 작동하는 것 같다,하지만 난 시리즈 작동하지 않는 경우에만 제대로 작동합니다. 내 경우에는 입력 데이터가 정적이 아니며 스태킹없이 시리즈를 지원해야합니다. 이 위치는 누적되지 않은 버전에만 적용됩니다. 결과가 누적 될 때 기본적으로 올바른 위치에 있습니다. 귀하의 의견을 보내 주셔서 감사합니다. –

관련 문제