두 차트의 Google 차트 마우스 오버

Question

이 질문은 Google Charts 작업과 관련이 있습니다.

저는 한 달 동안 버킷으로 묶인 기여도를 가진 카테고리로 구성된 데이터 세트를 가지고 있습니다. 전체 달을 원형 차트로 나타내고, 막대 그래프로 각 날의 데이터를 나타냅니다. 두 차트 모두 본질적으로 동일한 정보를 기반으로합니다. 두 도표에 올바른 순서로 정보를 제공하면 두 색상 사이에서 색상이 조정됩니다 (즉, 한 카테고리의 각 카테고리는 다른 카테고리의 동일한 카테고리와 동일한 색상을 가짐).

마우스를 파이 조각 위로 가져 가면 강조 표시됩니다. 누적 막 대형 차트의 해당 데이터도 동시에 강조 표시하고 그 반대로하고 싶습니다.

Google 시각화 API로이를 수행하는 가장 좋은 방법은 무엇입니까?

Answer 1

데이터 포인트를 강조 표시하려면 <chart type>#setSelection 메소드를 사용하십시오. 데이터 구조를 올바르게 이해하면 다음과 같이 작동해야합니다.

google.visualization.events.addListener(pieChart, 'select', function() { 
    var selection = pieChart.getSelection(); 
    if (selection.length) { 
     // assumes the row in the PieChart's data corresponds to the data series in the ColumnChart, which is the nth + 1 column 
     columnChart.setSelection([{column: selection[0].row + 1}]); 
    } 
}); 
google.visualization.events.addListener(columnChart, 'select', function() { 
    var selection = columnChart.getSelection(); 
    if (selection.length) { 
     // assumes the data series in the ColumnChart's data corresponds to the row in the PieChart, which is the nth column - 1 
     pieChart.setSelection([{column: selection[0].column - 1}]); 
    } 
});