首页 > 解决方案 > 谷歌图表 - 隐藏系列标签太宽

问题描述

使用 Google Apps 脚本,我创建了一个堆积条形图。结果如下: https ://drive.google.com/file/d/1DZ2ZtSu2A81OAMc9ds9A4y-bS0l_oftL/view?usp=sharing

当条形图与可用空间相比太宽时,我想隐藏条形图上的标签。按照我在此地址https://developers.google.com/chart/interactive/docs/reference#DataView_setColumns找到的说明,我尝试在“annotationObj”对象中使用自定义函数而不是“stringify”(参见代码)创建一个长度为零的标签,但是当我尝试创建图表时无法识别我的函数(错误消息:未知函数“getValueAt”)。

这是我的代码:

function CHARTS_002() { //
  var ABCarray = ['A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z','AA','AB','AC','AD','AE','AF','AG','AH','AI','AJ','AK','AL','AM','AN','AO','AP','AQ','AR','AS','AT','AU','AV','AW','AX','AY','AZ','BA','BB','BC','BD','BE','BF','BG','BH','BI','BJ','BK','BL','BM','BN','BO','BP','BQ','BR','BS','BT','BU','BV','BW','BX','BY','BZ','CA','CB','CC','CD','CE','CF','CG','CH','CI','CJ','CK','CL','CM','CN','CO','CP','CQ','CR','CS','CT','CU','CV','CW','CX','CY','CZ'];
  var ssId = '1KA2BnUsC-Lp64UhxjtN5Gtth2dOiHp3-pRwIQjAYOLI';
  var shName = 'TopGrossingFilms'; 
  var aScale = ["Poco d'accordo","Né d’accordo né in disaccordo","Abbastanza d'accordo","Totalmente d'accordo","Media"]; 
  var aRange = [['B',2],['N',12]];
  var sheet = SpreadsheetApp.openById(ssId).getSheetByName(shName);
  var row = aRange[0][1];
  var column = ABCarray.indexOf(aRange[0][0]) + 1;
  var numRows = aRange[1][1] - aRange[0][1];
  var numColumns = ABCarray.indexOf(aRange[1][0]) - ABCarray.indexOf(aRange[0][0]) + 1;
  var sheetV = sheet.getRange(aRange[0][1], ABCarray.indexOf(aRange[0][0]) + 1, numRows, numColumns).getValues();
  var sheetT1D = sheetV[0];
  var aData = [];
  for (var r in sheetV) {
    aData.push(sheetV[r])
  }
  for (var r in aData) {
    for (var c in aData[r]) {
      if (!isNaN(aData[r][c])) {
        aData[r][c] = round(aData[r][c],2);
        if (aData[0][c] == 'Media') {
          aData[r][c] = 13;
        }
      }
    }
  }
  var data = Charts.newDataTable();
  var annotationObj = { calc: "stringify", 
                       //calc: "getValueAt",
                       //calc: "function(data, row) { var ret = data[row][§col§]; if (ret < 7) {return '';} else {return JSON.stringify(ret)} }",
                       sourceColumn: -1,
                       type: "string",
                       role: "annotation"
                      }
  var aAnnotation = [];
  for (var r in aData) {
    if (r < 1) { continue; }
    if (r == 1) { 
      for (var c in aData[r]) {
        aAnnotation.push(c);
        if (isNaN(aData[r][c])) {
          data.addColumn(Charts.ColumnType.STRING, aData[0][c]);
        } else {
          data.addColumn(Charts.ColumnType.NUMBER, aData[0][c]);
          if (aScale.indexOf(aData[0][c]) != -1) {
            var myObj = JSON.parse(JSON.stringify(annotationObj));
            var myCol = Number(c);
            if (aData[0][c] == 'Media') {
              myCol = Number(c) + 1;
            }
            myObj.sourceColumn = myCol;
            myObj.calc = myObj.calc.replace("§col§",myCol)
            aAnnotation.push(myObj);
          }
        }
      }
    }
    data.addRow(aData[r]);
  }
  var dataViewDefinition = Charts.newDataViewDefinition().setColumns(aAnnotation);
  var aTicks = [0, 10, 20, 30, 40, 50, 60, 70, 80, 90, 100];
  var chartBuilder = Charts.newBarChart()
  .setDimensions(1200, 700)
  .setOption("hAxis", { ticks: aTicks})  
  .setOption('legend',{ position:'top', maxLines:3 })
  .setOption('chartArea',{ left:650 })
  .setOption('series',{
    6: {type:'line', color:'00FF00', lineWidth:3, visibleInLegend: false}
  })
  .setDataTable(data)
  .setDataViewDefinition(dataViewDefinition)
  .setOption('bar', { groupWidth: "80%" })
  .setStacked()
  .setColors(['#C10000','#F1C12A','#BFBFBF','#0070C1','#244062','00FF00']);

  var chart = chartBuilder.build();

  var chartImage = chart.getAs('image/png').copyBlob();
  DriveApp.createFile(chartImage).setName('NewBarChart.png');
}

function getValueAt(column, dataTable, row) {
  var value = dataTable(row, column);
  var ret = '';
  if (value > 7) { ret = value.toString()}
  return ret;
}

function round(value, exp) {
  var funcName = 'round';
  if (typeof exp === 'undefined' || +exp === 0)
    return Math.round(value);

  value = +value;
  exp = +exp;

  if (isNaN(value) || !(typeof exp === 'number' && exp % 1 === 0))
  return NaN;

  // Shift
  value = value.toString().split('e');
  value = Math.round(+(value[0] + 'e' + (value[1] ? (+value[1] + exp) : exp)));

  // Shift back
  value = value.toString().split('e');
  return +(value[0] + 'e' + (value[1] ? (+value[1] - exp) : -exp));
}

生成的图表可以在这个公共文件夹中看到:https ://drive.google.com/file/d/1DZ2ZtSu2A81OAMc9ds9A4y-bS0l_oftL/view?usp=sharing

有谁知道如何获得我想要的结果?

提前致谢。

标签: google-apps-scriptchartsgoogle-visualization

解决方案


推荐阅读