Javascript 如何在谷歌图表中轻松创建比例堆叠柱形图？如何组合两个图表？

请帮助我我在谷歌图表脚本非常新。你能给我一个在谷歌图表中没有复杂代码的堆叠比例柱形图的正确脚本吗？以及如何组合两个图表。。。如果你能帮助我，我很高兴。多谢各位

以下是联合收割机图表的示例照片：

下面是用复杂代码编写的堆叠比例柱形图的脚本：

 function drawVisualization() {

 var data = google.visualization.arrayToDataTable([
    ['Year', 'Austria', 'Belgium', 'Czech Republic', 'Finland', 'France', 'Germany'],
    ['2003',  1336060,   3817614,       974066,       1104797,   6651824,  15727003],
    ['2004',  1538156,   3968305,       928875,       1151983,   5940129,  17356071],
    ['2005',  1576579,   4063225,       1063414,      1156441,   5714009,  16716049],
    ['2006',  1600652,   4604684,       940478,       1167979,   6190532,  18542843],
    ['2007',  1968113,   4013653,       1037079,      1207029,   6420270,  19564053],
    ['2008',  1901067,   6792087,       1037327,      1284795,   6240921,  19830493]
  ]);

  var view  = new google.visualization.DataView(data);

  var columns = [0];
  for (var i = 1; i < data.getNumberOfColumns(); i++) {
    // add a column that calculates the proportional value of this column to the total
    columns.push({
        type: 'number',
        label: data.getColumnLabel(i),
        calc: (function (col) {
            return function (dt, row) {
                var val = dt.getValue(row, col);
                var total = 0;
                for (var j = 1; j < dt.getNumberOfColumns(); j++) {
                    total += dt.getValue(row, j);
                }
                return (total == 0) ? null : {v: val / total, f: val.toString()}; 
            };
        })(i)
    });
    // add an annotation column that puts a label on the bar
    columns.push({
        type: 'string',
        role: 'annotation',
        sourceColumn: i,
        calc: 'stringify'
    });
}

view.setColumns(columns);

var options = {
    title:"Yearly Coffee Consumption by Country",
    width:1000, height:400,
    isStacked: true,
    hAxis: {title: "Year"},
    vAxis: {
        format: '#%'
    }
};
var chart = new google.visualization.ColumnChart(document.getElementById('visualization'));
chart.draw(view, options);

 }
google.load('visualization', '1', {packages:['corechart'], callback: drawVisualization});

函数drawVisualization（）{
var data=google.visualization.arrayToDataTable([
[‘年’、‘奥地利’、‘比利时’、‘捷克共和国’、‘芬兰’、‘法国’、‘德国’]，
['2003',  1336060,   3817614,       974066,       1104797,   6651824,  15727003],
['2004',  1538156,   3968305,       928875,       1151983,   5940129,  17356071],
['2005',  1576579,   4063225,       1063414,      1156441,   5714009,  16716049],
['2006',  1600652,   4604684,       940478,       1167979,   6190532,  18542843],
['2007',  1968113,   4013653,       1037079,      1207029,   6420270,  19564053],
['2008',  1901067,   6792087,       1037327,      1284795,   6240921,  19830493]
]);
var view=newgoogle.visualization.DataView（数据）；
var列=[0]；
对于（var i=1；i

列

是一个列定义数组，DataView使用它来设置图表使用的数据。在这种情况下，代码将创建一组计算列，这些列计算特定列表示的每行总和的百分比。此代码：

columns.push({
    type: 'number',
    label: data.getColumnLabel(i),
    calc: (function (col) {
        return function (dt, row) {
            var val = dt.getValue(row, col);
            var total = 0;
            for (var j = 1; j < dt.getNumberOfColumns(); j++) {
                total += dt.getValue(row, j);
            }
            return (total == 0) ? null : {v: val / total, f: val.toString()}; 
        };
    })(i)
});

columns.push({
    type: 'string',
    role: 'annotation',
    sourceColumn: i,
    calc: 'stringify'
});

---

将注释列添加到列数组中，从而为每列添加标签。

该代码有效，而且它恰好是创建比例堆叠柱形图的最直接方法。没有比这更复杂的方法了。我明白了。请你解释一下它是如何工作的。。在“var列”中？感谢您的解释。我有一个问题，如何将其转换为xslt？请帮帮我。我尝试了很多次转换它，但我总是失败，似乎我是xslt的初学者我以前从未使用过xslt，所以我不能帮你。我还有一个问题。。我如何设置百分比轴，我的意思是像0，10%，20%。。。因为当我设置一个百分比轴时，我得到一个很大的百分比，比如0，70%，140%。。。但我的数据中最高的百分比是2.75%。我怎样才能解决这个问题？那么数据和v轴会匹配吗？谢谢您您的百分比是以十进制值还是百分比的形式输入的（即，

'2.75%

是以

2.75

还是

0.0275

的形式输入的）？可视化API希望百分比采用十进制格式（即

0.0275

）。如果数据采用百分比表示法，则需要在格式设置程序中引用

%

符号，因此它被视为要追加的字符串，而不是百分比格式设置程序：

“#”%'”

此函数将条形图的值设置为其占总值的比例，即绘制在轴上的值。如果希望轴上的值是整数值而不是小数，可以将比例乘以100：

return（total==0）？null:{v:100*val/total，f:val.toString（）}。您也可以对变量使用百分比格式：“#%”。