그룹화되고 스택 된 바카르트의 하이 차트 크기 막대기

Question

이전 질문에서 Paweł Fus는 그룹 스택 막대 차트 솔루션을 제공하기에 너무 친절했습니다. 여기에서 문맥에 대한 질문과 대답을 찾을 수 있습니다. Grouping a stacked bar chart in Highcharts

저는이 방법을 사용하려고 시도하고 있습니다. 문제가 생겨서 잘 풀리지 않는 것 같습니다. 이전 게시물의 시나리오에서는 간단한 예제로 유지하기 위해 그룹당 2 개의 막대 만있었습니다. 실제로 많은 수의 막대가있을 수 있습니다. Pawel Fus의 대답에 제시된 접근법을 사용하면 세 번째 막대를 추가하는 것만으로도 문제가 해결됩니다. 그 이유는 pointPlacement가 쉬운 수정 인 막대의 수에 따라 다르지만 바가 너비를 고려하여 자동으로 조정되지 않는다는 것을 빨리 알 수 있기 때문입니다. 얘기 메신저 무엇의 간단한 데모이 jsfiddle를 살펴 보자 : JsFiddle

Mandatory random code block to make Stack overflow happy... just ignore this code block. 

을 그래서 내 질문은 :

• 모든이를 방지 할 내 원래의 질문에 더 나은 솔루션이있다?
• 이것이 올바른 접근법이라면, 어떻게 이들 막대의 너비를 계산하고 설정하고 올바른 포인트 배치를 설정해야합니까? 나는 차트 높이를 얻을 수 있지만 Highcharts 개체가 만들어 질 때까지는 찾지 못했고, 프로그램 적으로이 Highcharts 구성을 만들어서 그 지점에서 액세스 할 수 없도록했습니다.

Answer 1

그래서 우리는 시도 많은 것을하지만 Highcharts 그냥 이런 종류의 작업을 수행하는 것은 아닙니다 것을 결정했다. 우리는이 시간에 Highcharts로 구현할 수있는 것에 대한 제한 사항으로 UX 팀에 피드백을 보냈습니다. 그 동안 우리는 레이블을 더 이상 유익하지 않게 만들었습니다. 이것은 레이블을 매우 부피가 커지게 만듭니다.

최종 사용자에게 분명하고 읽기 쉬운 차트를 만들기 위해 차트에 누적 막대를 그룹화하는 것이 의미있는 UX 디자인에 동의합니다. 다른 차트 프레임 워크를 둘러 보았고 이렇게 할 수있는 방법을 제공하는 사람은 없었습니다. 나는 highcharts가 경쟁사보다 뒤떨어지고 있다고 말할 수는 없지만이 기능을 사용하기 쉽도록 구현하면 분명히 차별화 될 수있다.

Answer 2

당신은 다른 접근 방법을 시도하지만, 데이터를 포맷하면 그렇게 명확하지 않다 할 수 http://jsfiddle.net/1ktmb2d2/3/를 (또는이 하나 http://jsfiddle.net/1ktmb2d2/4/) - 이제 각각의 수직 열은 다른 스택이 있고, 그 이름은 중요합니까 (포매터를 정말 스택 변경해야 함).

참고 : 범주 당 다른 수의 열을 표시 할 때 열 수가 가장 낮은 범주에서 항상 간격을 만듭니다.

간체 데이터 :

series: [{ 
     name: 'Happy', 
     id: 'Happy', 
     stack: 'Corolla', 
     color: 'blue', 
     data: [20, 30], 
    }, { 
     id: 'Unhappy', 
     name: 'Unhappy', 
     stack: 'Corolla', 
     color: 'black', 
     data: [10, 30], 
    }, { 
     linkedTo: 'Happy', 
     stack: 'Prius', 
     color: 'blue', 
     data: [30, 30], 
    }, { 
     linkedTo: 'Unhappy', 
     stack: 'Prius', 
     data: [30, 30], 
     color: 'black', 
    }, { 
     linkedTo: 'Happy', 
     stack: 'Highlander', 
     color: 'black', 
     data: [30], 
    }]