2014-10-05 3 views
0

하이 챠트의 컬럼 차트가 매우 많으므로 컬럼 수가 매우 적습니다. 괜찮습니다.하지만 확대/축소를하고 싶습니다. 그래서 나는 zoomtype을 사용했습니다 : 'x'그리고 그것은 잘 작동합니다.zoomtype을 사용하여 하이 차트로 글꼴 크기를 업데이트하십시오.

문제는 내가 선택한 xAxis에서 글꼴을 크게 만들고 싶습니다. I 콘솔에게 .options.labels.style.fontSize 20. 로 갱신된다 [0] this.xAxis의 값을 확인하면 I가 누를 때

chart: { 
      type: 'column', 
      zoomType: 'x', 
      events: { 
       redraw: function(event) { 
        if(this.xAxis[0].tickPositions.length>80){ 
         this.xAxis[0].options.labels.style.fontSize = 1; 
        }else{ 
         this.xAxis[0].options.labels.style.fontSize = 20; 
         console.log(this.xAxis[0].options.labels.style.fontSize);     
        } 

       } 

      } 
     } 

이 코드에만 작동 : 난 이렇게 시도 줌 버튼을 재설정하십시오. 제 질문은 이벤트가 트리거되었을 때 어떻게 차트를 업데이트하여 [재설정] 단추를 사용하는 것과 같은 효과를 얻을 수 있습니까?

또는 줌을 만들 때 또는 줌을 재설정 할 때 글꼴을 어떻게 변경할 수 있습니까?

답변

1

베일에 새 스타일이 적용된 afterSetExtremes 이벤트와 axis.update() 이벤트를 잡을 수 있습니다.

events:{ 
      afterSetExtremes:function(){ 
       this.update({ 
        labels:{ 
         style:{ 
          fontSize:20 
         } 
        } 
       }); 
      } 
} 

예 : http://jsfiddle.net/m180dxsu/

+0

그것은 완벽하게 작동합니다! 나는 작동하지 않는 다른 것들을 시도하는데 많은 시간을 허비한다. 고맙습니다. – perseus

관련 문제