谷歌图表：堆叠柱状图标签化

Question

基于 GoogleAPI 文档: https://developers.google.com/chart/interactive/docs/gallery/columnchart?hl=en 如您在“标记列”部分所见，每个列都带有静态值。我想知道是否可能使用所有值的总和来标记一列。

// Set chart options
     var options = {

         width: 400,
         height: 300,
         calc:????
     };

我应该使用特定的函数来设置这个“calc”字段吗？

JSFIDDLE：总标签列

我无法弄清楚如何自定义每个堆叠列的总和值标签。

- ePascoal

Answer 1

你可以使用getNumberOfRows()、getNumberOfColumns()和getValue()函数来计算总数，并将该值设置为total而不是字符串：

function drawChart() {
    // Create the data table.
    var data = new google.visualization.arrayToDataTable(array);

    for (var i = 0; i < data.getNumberOfRows(); i++) {
        var total = 0;

        for (var j = 1; j < data.getNumberOfColumns() - 2; j++) {
            // console.log(data.getValue(i, j));
            total += data.getValue(i, j);
        }
        data.setValue(i, data.getNumberOfColumns() - 1, '' + total);
    }
...

您需要更改图表的大小或字体的大小，才能使数值正确地显示在列上。标签已经正确地显示。

- Anto Jurković

---

我已经弄清楚了，它与你所做的类似。感谢您的及时回答。 - ePascoal

Answer 2

这是我的答案..我希望它能帮助到遇到相同问题的人。

 function getValueAt(column, dataTable, row) {
     return dataTable.getFormattedValue(row, column);
 }

 function setLabelTotal(dataTable) {
     //dataTable must have role: annotation
     var SumOfRows = 0;   

     for (var row = 0; row < dataTable.getNumberOfRows(); row++) {
         SumOfRows = 0;
         for (var col = 0; col < dataTable.getNumberOfColumns(); col++) {

             if (dataTable.getColumnType(col) == 'number') {
                 SumOfRows += dataTable.getValue(row, col);
             }
             if(dataTable.getColumnRole(col) == 'annotation')
             {dataTable.setValue(row, col, SumOfRows.toString());}
         }
     }
 } 

请注意，您必须在主函数（例如“drawChart”）上调用这些方法。

- ePascoal