Google 图表 - 更改条形图中条形的方向
我正在尝试创建包含两个数据系列的条形图。我希望将一个系列绘制在右侧，将一个系列绘制在左侧。
如果我为奥地利输入负值，那么它会将这些值引向左翼。有什么方法可以让奥地利的数据系列指向左侧，保加利亚的数据系列指向右侧，而不使值变为负数？
我正在使用 Google 的 Vizualization API 中的示例之一，这就是我想到的（将下面的代码粘贴到 http://code.google.com/apis/ajax/playground/?type=visualization#bar_chart)：
function drawVisualization() {
// Create and populate the data table.
var data = new google.visualization.DataTable();
var raw_data = [['Austria', -1336060, -1538156, -1576579, -1600652, -1968113, 1901067],
['Bulgaria', 400361, 366849, 440514, 434552, 393032, 517206],
//['Denmark', 1001582, 1119450, 993360, 1004163, 979198, 916965],
//['Greece', 997974, 941795, 930593, 897127, 1080887, 1056036]
];
var years = [2003, 2004, 2005, 2006, 2007, 2008];
data.addColumn('string', 'Year');
for (var i = 0; i < raw_data.length; ++i) {
data.addColumn('number', raw_data[i][0]);
}
data.addRows(years.length);
for (var j = 0; j < years.length; ++j) {
data.setValue(j, 0, years[j].toString());
}
for (var i = 0; i < raw_data.length; ++i) {
for (var j = 1; j < raw_data[i].length; ++j) {
data.setValue(j-1, i+1, raw_data[i][j]);
}
}
// Create and draw the visualization.
new google.visualization.BarChart(document.getElementById('visualization')).
draw(data,
{title:"Yearly Coffee Consumption by Country",
width:600, height:400,
isStacked: 'true',
vAxis: {title: "Year"},
hAxis: {title: "Cups"}}
);
}
非常感谢，让我知道我是否可以澄清任何事情。
I'm trying to create a bar chart with two series of data. I want one series to be drawn to the right, and one series to be drawn to the left.
If I put negative values in for Austria, then it will draw those values oriented towards the left. Is there any way that I can have the data series for Austria oriented towards the left, and the data series for Bulgaria pointed towards the right, without making values negative?
I was playing with one of the examples from Google's Vizualization API, and here's what I came up with (It's probably easiest to paste the code below into http://code.google.com/apis/ajax/playground/?type=visualization#bar_chart):
function drawVisualization() {
// Create and populate the data table.
var data = new google.visualization.DataTable();
var raw_data = [['Austria', -1336060, -1538156, -1576579, -1600652, -1968113, 1901067],
['Bulgaria', 400361, 366849, 440514, 434552, 393032, 517206],
//['Denmark', 1001582, 1119450, 993360, 1004163, 979198, 916965],
//['Greece', 997974, 941795, 930593, 897127, 1080887, 1056036]
];
var years = [2003, 2004, 2005, 2006, 2007, 2008];
data.addColumn('string', 'Year');
for (var i = 0; i < raw_data.length; ++i) {
data.addColumn('number', raw_data[i][0]);
}
data.addRows(years.length);
for (var j = 0; j < years.length; ++j) {
data.setValue(j, 0, years[j].toString());
}
for (var i = 0; i < raw_data.length; ++i) {
for (var j = 1; j < raw_data[i].length; ++j) {
data.setValue(j-1, i+1, raw_data[i][j]);
}
}
// Create and draw the visualization.
new google.visualization.BarChart(document.getElementById('visualization')).
draw(data,
{title:"Yearly Coffee Consumption by Country",
width:600, height:400,
isStacked: 'true',
vAxis: {title: "Year"},
hAxis: {title: "Cups"}}
);
}
Thanks a bunch, let me know if I can clarify anything.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
使用
series选项为图表定义两个单独的水平轴。将第二个水平轴上的direction选项设置为 -1 以使值从图表的右侧延伸。系列：{1：{targetAxisIndex：1}}，hAxes：{1：{direction：-1}}Use the
seriesoption to define two separate horizontal axes for the chart. Set thedirectionoption on the second horizontal axis to -1 to make the values extend from the right side of the chart.series:{1:{targetAxisIndex:1}}, hAxes:{1:{direction:-1}}您可以使用柱形图代替条形图，它们看起来彼此相似。
https://developers.google.com/chart/interactive/docs/gallery/columnchart
You can use Column Chart instead of Bar Chart, they seems to resemble each other.
https://developers.google.com/chart/interactive/docs/gallery/columnchart