@lll9824

Are you sure you want to delete the question?

If your question is resolved, you may close it.

Leaving a resolved question undeleted may help others!

We hope you find it useful!

gasでのコンボチャート作成が不安定なので改善したいです

解決したいこと

現在月次レポート作成用のグラフを自動作成できるように作業をしております。
元々はその月の対象期間をタイトルにしていたのでそれを自動更新できるようにしていたのですが、
複合グラフではGASでのグラフの変更ができなかったので新規作成にて対処しました。

しかし実際に何度か動かしてみると縦軸(右)の設定が反映されていたりされていなかったりと不安定です。
解決方法を教えて下さい。

発生している問題

縦軸(右)にはフォントサイズと最大値を設定しています。
両方反映される事もあれば、どちらか片方のみ反映されたりどちらも反映されない事もあります。
以下現在のコードです

function onEdit(e) {
  const editedCell = e.range;

  let spreadsheet = SpreadsheetApp.getActiveSpreadsheet();

  let sheet = spreadsheet.getSheets()[0];
  let chart = sheet.getCharts()[2];
  // グラフを削除
  sheet.removeChart(chart)

  // A6セルが編集された場合
  if (editedCell.getA1Notation() === 'A6') {
    Utilities.sleep(500);
    
    // myFunctionを呼び出し
    myFunction();
  }
}

function myFunction() {
  const cell = 'G2'; // タイトル取得元セル
  const index = 1; // 変更するグラフのインデックス
  const ss = SpreadsheetApp.getActiveSpreadsheet();
  const sheet1 = ss.getSheetByName('sheet'); 
  
  // タイトル取得
  const title = sheet.getRange(cell).getValue();
  
  // グラフの取得
  const charts = sheet.getCharts();
  
  // 指定インデックスのグラフが存在するか確認
  if (charts.length > index) {
    try {
      // 対象のグラフ取得
      let chart = charts[index];
      
      // タイトルを変更して更新
      chart = chart.modify()
        .setOption('title',`固定文言(${title})`) // 新しいタイトルを設定
        .setOption('vAxes', { 
          0: { 
            // 左軸(縦軸)を非表示にする設定
            textPosition: 'none'  //なぜか縦軸が二つになることがあったので
          }
        .setOption('vAxes', {
          0: { textStyle: { fontSize: 16 } }
        })  
        })
        .build();
        
      sheet1.updateChart(chart);
      console.log(`Chart title updated successfully: ${title}`);
      
    } catch (error) {
      console.error(`Error updating chart title: ${error.message}`);
    }
  } else {
    console.warn("Specified chart index does not exist.");
  }

  borderReBuild();
}

function borderReBuild() {
  const ss = SpreadsheetApp.getActiveSpreadsheet();
  const sheet = ss.getSheetByName('sheet'); 
  const tableStart = 118;
  let tableEnd = 148;

  const table = sheet.getRange(`AP${tableStart}:AQ${tableEnd}`);
  table.setBorder(false,false,false,false,false,false); //一度枠線をクリア

  const rows = table.getValues();
  const days = rows.filter(row => row[0] !== '').length; //日数を取得
  
  tableEnd = tableStart + days - 1;
  const newTableRange = `AP${tableStart}:AQ${tableEnd}`;
  console.log(newTableRange);

  const newTable = sheet.getRange(newTableRange);
  newTable.setBorder(true,true,true,true,null,null,'#000000',SpreadsheetApp.BorderStyle.SOLID_MEDIUM )
  .setBorder(null,null,null,null,true,true,'#000000',SpreadsheetApp.BorderStyle.SOLID);

  createCompositeChart();
}

function createCompositeChart() {
  const cell = ['J2', 'L2'];
  const ss = SpreadsheetApp.getActiveSpreadsheet();
  const sheet = ss.getSheetByName("sheet");

  const title = sheet.getRange(cell[0]).getValue();
  const maxValue = sheet.getRange(cell[1]).getValue();

  // データ範囲の定義(個別の行・列で指定)
  const xAxisRange = sheet.getRange("A173:A221");     // X軸
  const seriesRange1 = sheet.getRange("B173:B221");   // 系列1(縦棒グラフに使用)
  const seriesRange2 = sheet.getRange("C173:C221");   // 系列2(折れ線グラフに使用)

  // グラフ作成
  const chart = sheet.newChart()
    .setChartType(Charts.ChartType.COMBO)
    .setPosition(118, 15, 17, -3) 
    .setOption('title', `固定文言(${title})`)
    .setOption('width', 1336)
    .setOption('height', 907)

    .setOption('titleTextStyle', {
      fontSize: 34,
      bold: true,
      color: '#000000'
    })
    
    // 各データセットに異なる系列を設定
    .addRange(xAxisRange)
    .addRange(seriesRange1)
    .addRange(seriesRange2)
    
    .setOption('series', {
      0: { type: 'bars', targetAxisIndex: 0, color: '#ff9900'},
      1: { 
      type: 'line', 
      targetAxisIndex: 1, 
      color: '#4a86e8', 
      lineWidth: 4, 
      pointSize: 10 
      }         // 系列2 を右のY軸で折れ線グラフ
    })
    
    .setNumHeaders(1)  // 1行目をヘッダー行として設定
    
    // 凡例の位置設定
    .setOption('legend', { 
      position: 'auto',
      textStyle: {fontSize: 24}
      })

    .setOption('hAxis', {
      textStyle: { fontSize: 16 } 
    })

    .setOption('vAxes', {
      0: { textStyle: { fontSize: 16 } },
      1: { textStyle: { fontSize: 16 }, viewWindow: { max: maxValue } } // 右のY軸フォントと最大値
    })
    .build();

  sheet.insertChart(chart);
}


自分で試したこと

元々はonEdit内で各関数を呼び出していたのですが、処理が重なっているせいで動作が安定しないのかなと思い
各関数の最後に次の関数を呼び出すようにしました。(CahtGPTによるとGASではawait等は使えないみたいなので)
setOpsionの記載方法も以下のように分けてみたりもしたのですが改善はなかったです。

.setOption('vAxes.0.textStyle', { fontSize: 16 }) // 左のY軸フォント
.setOption('vAxes.1.textStyle', { fontSize: 16 }) // 右のY軸フォント
.setOption('vAxes.1.viewWindow', { max: maxValue }) // 右のY軸最大値
.build();

原因がわかる方いらっしゃいましたらご教示いただきたいです。
よろしくお願いいたします。

0 likes

No Answers yet.

Your answer might help someone💌