2010-06-23 2 views
0

Google Finance 페이지에서 볼 수있는 것과 비슷한 두 개의 연결된 차트를 하나의 차트 위에 레이아웃하려고합니다.dojox.charting : 두 차트의 plotArea를 정렬하는 법?

차트를 모두 잘 렌더링 할 수 있지만 plotAreas를 정확히 정렬하는 것은 약간의 미스터리입니다. 각 차트의 chart.plotArea.width는 Y 축 레이블의 너비에 따라 달라집니다. 따라서 두 차트는 너비가 같지 않고 다른 값을 가지고 있습니다. chart.getCoord().l.

지금은 수동으로 계산 된 오프셋을 사용하고 있지만 더 좋은 방법이 있어야합니다.

this.chart.render(); // top chart, getCoords().w=800 

// manually set margins for lower chart to match 
this.chartVol.margins.l = this.chart.offsets.l - 59 + 10; 
this.chartVol.margins.r = this.chart.offsets.r - 31 + 10; 

// render bottom chart 
this.chartVol.render(); // bottom chart same width, getCoords().w=800 

답변

0

을 수행하는 두 가지 간단한 방법이 있습니다 :

  1. 사용 maxLabelSizelabelFunc. 전자는 최대 레이블 크기 (픽셀)입니다. 후자는 숫자를 취하고 해당 문자열 레이블을 반환하는 함수입니다.
  2. {value, text} 개체의 배열 인 labels을 사용하고 끝 부분에 하나의 가짜 값을 가진 원하는 크기의 더미 문자열을 포함합니다.

사용자 정의 레이블 없이는 어떻게 작성했는지 기억하지 않으므로 실제로 필요하다고 생각되면 submit an enhancement ticket을 입력하십시오.

+0

레이블에 동일한 더미 문자열을 사용하려고했지만 plotAreas는 여전히 몇 픽셀 정도 떨어져 있습니다. Q : maxLabelSize에 대한 문서는 어디에 있습니까? 어떤 클래스가 속해 있습니까? chart.addAxis ('y', {maxLabelSize : 5})를 시도했지만 아무 것도하지 않는 것 같습니다. – michael

+0

A : 현재 dojox/charting/axis2d/Default.js의 소스 코드에 있습니다. 실패한 시도 : {maxLabelSize : 5}는 5 픽셀입니다. 나는 이것이 그 아이디어라고 생각하지 않는다. 그리고 labelFunc와 함께 사용해야합니다. 위의 내 대답의 시체를 참조하십시오. –