在 google 柱形图中的条形上显示类型名称
Displaying type name on bars in google column charts
我正在使用 Google 柱形图。
截至目前,我的图表如下图所示。
在这里,我在每个类别中有两列。我想通过它们的类型(Type-1,Type-2)来区分它们,如下图所示。我该怎么做,有没有可能。
您可以将数据列角色用于 --> 'annotation'
'annotation'
列应该跟在它在数据中表示的每个值之后 table
请参阅以下工作片段...
google.charts.load('current', {
packages: ['corechart']
}).then(function () {
var data = new google.visualization.DataTable();
data.addColumn('string', 'Category Type');
data.addColumn('number', 'Type-1');
data.addColumn({role: 'annotation', type: 'string'});
data.addColumn('number', 'Type-2');
data.addColumn({role: 'annotation', type: 'string'});
data.addRows([
['Pri #1:', 4000, 'Type-1', 5000, 'Type-2'],
['Pri #2:', 6000, 'Type-1', 8000, 'Type-2'],
['Pri #3:', 1500, 'Type-1', 3000, 'Type-2'],
]);
var container = document.getElementById('chart_div');
var chart = new google.visualization.ColumnChart(container);
chart.draw(data, {
annotations: {
alwaysOutside: true
}
});
});
<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div"></div>
我正在使用 Google 柱形图。
截至目前,我的图表如下图所示。
在这里,我在每个类别中有两列。我想通过它们的类型(Type-1,Type-2)来区分它们,如下图所示。我该怎么做,有没有可能。
您可以将数据列角色用于 --> 'annotation'
'annotation'
列应该跟在它在数据中表示的每个值之后 table
请参阅以下工作片段...
google.charts.load('current', {
packages: ['corechart']
}).then(function () {
var data = new google.visualization.DataTable();
data.addColumn('string', 'Category Type');
data.addColumn('number', 'Type-1');
data.addColumn({role: 'annotation', type: 'string'});
data.addColumn('number', 'Type-2');
data.addColumn({role: 'annotation', type: 'string'});
data.addRows([
['Pri #1:', 4000, 'Type-1', 5000, 'Type-2'],
['Pri #2:', 6000, 'Type-1', 8000, 'Type-2'],
['Pri #3:', 1500, 'Type-1', 3000, 'Type-2'],
]);
var container = document.getElementById('chart_div');
var chart = new google.visualization.ColumnChart(container);
chart.draw(data, {
annotations: {
alwaysOutside: true
}
});
});
<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div"></div>