Google Apps Script EmbeddedComboChartBuilder does not allow changing orientation

问题

I am trying to build a vertical combo chart programmatically. This can be done by setting the "orientation" option of a ComboChart to "vertical" (according to https://developers.google.com/chart/interactive/docs/gallery/combochart)

This works fine if you open the JSFiddle below the first image on the page linked above and add the option "orientation: 'vertical',"

    var options = {
      title : 'Monthly Coffee Production by Country',
      orientation: 'vertical',
      vAxis: {title: 'Cups'},
      hAxis: {title: 'Month'},
      seriesType: 'bars',
      series: {5: {type: 'line'}}        };

However, when creating an EmbeddedComboChart in Google Apps Script, setting the same option does not change anything (resulting chart is in standard horizontal orientation).

function createEmbeddedComboChart() {
  var sheet = SpreadsheetApp.getActiveSheet();
  var chartDataRange = sheet.getRange(
    'Tabellenblatt1!B10:D12');

  var comboChartBuilder = sheet.newChart().asComboChart();
  var chart = comboChartBuilder
    .addRange(chartDataRange)
    .setOption("orientation", "vertical")
    .setPosition(5, 8, 0, 0)
    .build();

  sheet.insertChart(chart);  
}

Am I missing something or is this option simply not available when embedding the chart in google sheets?

回答1:

The reason why you cannot set the option `"orientation", "vertical"` for the embedded Spreadsheet chart builder is that there is no such option in the Google Sheets UI

In other words, using Google Sheets you cannot create vertical Combo Charts.

If it is important for your to embed such a chart, you would need to use a workaround.

E.g. embed the chart as and image or inside a Modal dialog.

Sample for a modal dialog:

Code.gs

function onOpen() {
  SpreadsheetApp.getUi()
  .createMenu('Custom Menu')
  .addItem('Show chart', 'openDialog')
  .addToUi();
}
function getData() {
  var sheet = SpreadsheetApp.getActiveSheet();
  var chartDataRange = sheet.getRange('Sheet1!B10:D12').getValues();
  var data = chartDataRange;
  Logger.log("data: " + data);
  return JSON.stringify(data);
}

function openDialog() {
  var html = HtmlService.createHtmlOutputFromFile('index').setHeight(600).setWidth(900);//.createHtmlOutputFromFile('index'); 
  SpreadsheetApp.getUi().showModalDialog(html, 'This is the chart');
}

index.html


<html>
  <head>
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script type="text/javascript">
      google.charts.load('current', {'packages':['corechart']});
      google.charts.setOnLoadCallback(drawVisualization);
      function drawVisualization() {
         google.script.run.withSuccessHandler(onSuccess).getData();
      }
      function onSuccess(data){
        data = google.visualization.arrayToDataTable(JSON.parse(data));
        var options = {
          title : 'Monthly Coffee Production by Country',
          orientation: 'vertical',
          vAxis: {title: 'Cups'},
          hAxis: {title: 'Month'},
          seriesType: 'bars',
          series: {1: {type: 'line'}}        };

        var chart = new google.visualization.ComboChart(document.getElementById('chart_div'));
        chart.draw(data, options);
        }
    </script>
  </head>
  <body>
    <div id="chart_div" style="width: 900px; height: 500px;"></div>
  </body>
</html>

来源：https://stackoverflow.com/questions/61870439/google-apps-script-embeddedcombochartbuilder-does-not-allow-changing-orientation

标签

google-apps-script

charts

google-visualization

orientation

Google Apps Script EmbeddedComboChartBuilder does not allow changing orientation

问题

回答1:

The reason why you cannot set the option "orientation", "vertical" for the embedded Spreadsheet chart builder is that there is no such option in the Google Sheets UI

The reason why you cannot set the option `"orientation", "vertical"` for the embedded Spreadsheet chart builder is that there is no such option in the Google Sheets UI