2014-10-07 2 views
0

Highstock.js를 사용하여 스크롤 막대가있는 막대 차트를 그렸습니다. 아래는 제 코드입니다.HighStock y 축 레이블이 수평 스크롤 이동시 자체적으로 변경됨

$(function() { 
    chartOptions = new Highcharts.Chart({ 
     chart: { 
      renderTo: 'container', 
      type: 'column' 
     }, 
     title: { 
      text: chartName, 
      x: -20 
     }, 

     xAxis: { 
      categories: color, 
      pointWidth: 28, 
      min: 1, 
      max: 10, 
      labels: { 
       rotation: -60, 
       align: 'right', 
       useHTML: true, 
       style: { 
        fontSize: '10px', 
        fontFamily: 'proxima-nova,helvetica,arial,sans-seri', 
        whiteSpace: 'nowrap', 
        paddingLeft: '10px', 
        paddingRight: '10px', 
        paddingTop: '10px', 
        paddingBottom: '10px' 


       } 
      }, 
      title: { 
       text: parent_id 
      } 

     }, 
     yAxis: { 
      allowDecimals: false, 
      min: 0, 

      title: { 
       text: child_id 
      } 
     }, 
     tooltip: { 
      headerFormat: '<span style="font-size:10px">{point.key}</span><table>', 
      pointFormat: '<tr><td style="color:{series.color};padding:0">{series.name}: </td>' + 
      '<td style="padding:0"><b>{point.y:.1f}</b></td></tr>', 
      footerFormat: '</table>', 
      shared: true, 
      useHTML: true 
     }, 
     plotOptions: { 
      column: { 
       pointPadding: 0.2, 
       borderWidth: 0 

      }, 

     }, 
     scrollbar: { 
      enabled: true 
     }, 

     series: [{ 
      name: 'OrderList', 
      data: OrderList 
     }, 
     { 
      name: 'Historical', 
      data: History 
     }, 
     { 
      name: 'Inventory', 
      data: Inventory 
     }] 

    }); 
    if ($('#hdnOverRide').text() != "adHoc") { 
     chartOptions.addSeries({ 
      name: 'AllocationPool', 
      data: Pool 
     }) 
    } 
}); 

내 문제는 스크롤 할 때 y 축 레이블이 변경되는 것입니다. 처음으로 0,10,20, ---- 75와 같을 때 막대의 높이에 따라 변경된 내용을 스크롤합니다. 클라이언트 요구 사항은 Y 축 레이블을 전혀 변경하지 않으려는 것입니다. 상수로 사용하십시오. Y 축에 최대 속성을 지정하지 않고 Y 축 레이블을 고정하는 방법 나는 최대의 가치가 무엇인지 전혀 모른다.

모든 의견을 환영합니다.

감사

+0

jsfiddle 수 있습니까? 그것을 보지 않고도 시각화하기가 어렵습니다. – Balder

+0

"bootstrap"태그를 사용하지 마십시오. "twitter-bootstrap"은 다른 것을 의미하기 때문에 사용하십시오. –

답변

0

왜 y 축에 대한 최대 몰라? 물론 알 수 있습니다.

데이터 배열에서 최대 y 값을 얻고 해당 옵션을 yAxis.max으로 설정하십시오. 그런 다음 데이터를 탐색 할 때 yAxis가 변경되지 않습니다.

관련 문제