하이 차트 - 툴팁 내에 요소를 동적으로 배치합니다.

Question

하이 차트에서 툴팁 내에 요소를 동적으로 배치하려고합니다. 무슨 뜻인지를 표시하려면, 여기에 같은 툴팁 상상 : 내가하고 싶은 무엇

http://jsfiddle.net/gn9zm/1/

는 툴팁의 각 레이블이 해당 지점에 정렬해야합니다. 포맷터 옵션을 살펴 보았지만 포인트의 픽셀 위치를 제공하지는 않습니다. 주위를 검색 할 때 사람들이 toPixels 메서드를 어딘가에서 참조하는 것을 보았지만이를 찾을 수는 없지만/포맷터 내의 범위에서 액세스 할 수는 없습니다.

formatter: function() { 
    return '<div style="position: absolute; top: ' 
      + toPixels(this.point.plotY) + 'px">' + p.y + '</div>'; 

은 물론이 코드는 공유 툴팁를 수용해야하지만 잘하면 당신은 아이디어를 얻을 : 이상적으로는 다음과 같이 보일 것입니다 내 포매터를 생각하고 있어요. 내가하려는 일을 성취 할 수있는 방법이 있습니까?

Answer 1

포맷터에서 각 포인트 (폼 포인트 배열)에 대해 루프를 사용하고 올바른 값을 반환해야합니다. 점 개체에서는 plotX/plotY 매개 변수를 사용하여 픽셀 단위로 값에 액세스 할 수 있으므로 toPixels 함수를 호출 할 필요가 없습니다.

http://jsfiddle.net/gn9zm/6/

formatter:function(){ 
     var points = this.points, 
      txt = ''; 

     $.each(points,function(i,p){ 
      txt += ' value: ' + p.point.y + ' pixels: ' + p.point.plotY + '<br/>'; 
     }); 

     return txt; 
    },