图形代码(通过C#生成)
function drawDashboard() {
var data = google.visualization.arrayToDataTable([
['Group', 'Month', 'Count'],
['A', 1, 9],
['B', 1, 1],
['C', 1, 7],
['A', 2, 25],
['B', 2, 1],
['C', 2, 3]
]);
var dashboard = new google.visualization.Dashboard(document.getElementById('dashboard_div'));
var slider = new google.visualization.ControlWrapper({
'controlType': 'CategoryFilter',
'containerId': 'filter_div',
'options': {
'filterColumnLabel': 'Month',
'ui': {
'labelStacking': 'vertical',
'allowTyping': false,
'allowMultiple': false,
'allowNone': false
}
}
});
var ColumnChart = new google.visualization.ChartWrapper({
'chartType': 'ColumnChart',
'containerId': 'chart_div',
'options': {
'legend': 'right',
// Relevant bit start //
'view': {
'columns': [0,2]
},
// Relevant bit END //
width: '100%',
height: '250',
vAxis: {
minValue: 0
}
}
});
// Rest of the code which executes comes after this
}
在我的option
媒体资源中,我设置view
仅使用群组和计数
'view': {
'columns': [0,2]
},
0 =数组中的第一个值,即组
2 =数组中的第三个值,即Count
在这
['Group', 'Month', 'Count']
但在我的图表中,它也将月数作为一个值。我只想使用Month作为过滤器。我不想将月份显示为图表中的值。
我不希望那里有蓝色的列。只有红色应该在那里。
答案 0 :(得分:1)
view
应定义在同一级别,并与options
不在options
就这样......
var ColumnChart = new google.visualization.ChartWrapper({
'chartType': 'ColumnChart',
'containerId': 'chart_div',
'options': {
'legend': 'right',
'width': '100%',
'height': 250,
'vAxis': {
'minValue': 0
}
},
'view': {
'columns': [0,2]
}
});
请参阅以下工作代码段...
google.charts.load('current', {
'callback': function () {
var data = google.visualization.arrayToDataTable([
['Group', 'Month', 'Count'],
['A', 1, 9],
['B', 1, 1],
['C', 1, 7],
['A', 2, 25],
['B', 2, 1],
['C', 2, 3]
]);
var dashboard = new google.visualization.Dashboard(document.getElementById('dashboard_div'));
var slider = new google.visualization.ControlWrapper({
'controlType': 'CategoryFilter',
'containerId': 'filter_div',
'options': {
'filterColumnLabel': 'Month',
'ui': {
'labelStacking': 'vertical',
'allowTyping': false,
'allowMultiple': false,
'allowNone': false
}
}
});
var ColumnChart = new google.visualization.ChartWrapper({
'chartType': 'ColumnChart',
'containerId': 'chart_div',
'options': {
'legend': 'right',
'width': '100%',
'height': 250,
'vAxis': {
'minValue': 0
}
},
'view': {
'columns': [0,2]
}
});
dashboard.bind(slider, ColumnChart);
dashboard.draw(data);
},
'packages': ['corechart', 'controls']
});

<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="filter_div"></div>
<div id="chart_div"></div>
&#13;