2017-12-05 20 views
1

c3.js를 사용하여 누적 막 대형 차트를 작성하려고합니다.누적 막대 차트 막대 치수가 Y 축에 산호 화되지 않았습니다.

내가 가진 문제는 생성 된 막대가 Y 축에 산호 화되지 않았기 때문입니다.

이것은 내가 지금까지 무엇을 가지고 : https://codepen.io/anon/pen/dZLMoY?editors=1010

을 그리고 이것은 코드입니다 :

c3.generate({ 
    bindto:'#chart', 
    data: { 
     type: 'bar', 
     columns: [ 
      ['Column 1', 2, 10, 22, 34, 9, 60], 
      ['Column 2', 6, 15, 43, 36, 45, 75], 
      ['Column 3', 10, 20, 79, 39, 50, 97], 
      ['Column 4', 12, 27, 87, 76, 55, 150] 
     ], 
     groups: [ 
      ['Column 1', 'Column 2', 'Column 3', 'Column 4'] 
     ], 
     }, 
     bar: { 
     width: 15, 
     }, 
     axis: { 
     x: { 
      show: true 
     }, 
     y: { 
      show: true, 
      padding: { 
      top: 0, 
      bottom: 0 
      }, 
      tick: { 
      //count: 6 
      }, 
      min: 0, 
      max: 150 
     } 
     }, 
     grid: { 
     x: { 
      show: true 
     }, 
     y: { 
      show: true 
     } 
     } 
}); 

당신이 막대 차트가 생성되지만이 제대로 생성되지 볼 수 있듯이. 제공되는 값이 없더라도 마지막 4 개의 막대는 모두 동일합니다.

Y 축이 최대 값이 다음 2, 3, 4 바 5 줄 내가 잘못 뭐하는 거지

와 같은 높이를 ocupy 안 (150)에 설정 한 고려하면?

답변

1

축 .y.max 값이 누적 합계보다 작으므로 차트가 맨 위에 잘립니다.

이 시도 :

c3.generate({ 
    ... 
     axis: { 
     ... 
     y: { 
      ... 
      min: 0, 
      max: 500 
     } 
     } 
    } 

또는 see it in action합니다.