열 0이 연도이고 개수가 매년 열 1의 각 항목 수인 다음 그룹화 된 데이터에 대한 차트를 얻을 수없는 것 같습니다.
var aggrData = google.visualization.data.group(
data, [{
'column': 0,
role: 'domain'
},{
'column': 1,
role: 'annotation'
}],
[{
'column': 1,
'aggregation': google.visualization.data.count,
'type': 'number',
'role': 'data',
'label': 'Count'
}]);
여기에 표시된 것처럼 차트를 갖고 싶지만 위와 같이 그룹화 된 데이터가 있습니다. 작동하지 않는 내 스 니펫은 다음과 같습니다.
var dashboard = new google.visualization.Dashboard(document.getElementById('dashboard1_div'));
dashboard.bind([independantFilter1, dependantFilter1], [barChart1]);
dashboard.draw(aggrData);
링크에서 참조 된 차트를 모방하려면
먼저 각 학생에 대한 열이있는 데이터보기를 빌드 한
다음 각 학생 열에서 집계해야합니다.
데이터 테이블에는 메소드가 있습니다-> data.getDistinctValues(1)
이것은 고유 한 학생의 배열을 반환합니다
보기 및 그룹에 대한 열을 작성하는 데 사용할 수 있습니다.
다음 작업 스 니펫 참조 ...
google.charts.load('current', {
callback: drawChart,
packages: ['corechart', 'table']
});
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Year', 'Student'],
['2000', 'Student1'],
['2001', 'Student1'],
['2001', 'Student2'],
['2001', 'Student2'],
['2002', 'Student1'],
['2002', 'Student1'],
['2002', 'Student1'],
['2002', 'Student1'],
['2002', 'Student1'],
['2002', 'Student2'],
['2002', 'Student3'],
['2002', 'Student3'],
['2002', 'Student3'],
['2003', 'Student4']
]);
var dataView = new google.visualization.DataView(data);
var students = data.getDistinctValues(1);
var viewColumns = [0];
students.forEach(function (student, index) {
viewColumns.push({
calc: function (dt, row) {
if (dt.getValue(row, 1) === student) {
return 1;
}
return null;
},
label: student,
type: 'number'
});
});
dataView.setColumns(viewColumns);
var aggColumns = [];
students.forEach(function (student, index) {
aggColumns.push({
aggregation: google.visualization.data.sum,
column: index + 1,
label: dataView.getColumnLabel(index + 1),
type: dataView.getColumnType(index + 1)
});
});
var dataGroup = google.visualization.data.group(dataView, [0], aggColumns);
var chartDiv = document.getElementById('chart_div');
var chart = new google.visualization.ColumnChart(chartDiv);
chart.draw(dataGroup, {
legend: 'bottom'
});
}
<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div"></div>
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다