バックエンドでGoogle chartsを動かす際、コマンドライン引数を反映させたい

Question

前提・実現したいこと

バックエンドでGoogle chartsを動かす際、コマンドライン引数を反映させたい。

発生している問題

コマンドライン引数をグローバル変数に格納してnpmで使えるgoogle-charts-nodeに読み込ませたいがエラーが発生してしまう。
具体的にはグラフタイトルの'Population_of_Largest_U.S._Cities' をコマンドライン引数で渡し、nodeで受け取り、グローバル変数に格納して
google-charts-nodeに読ませたいが、グローバル変数が見つからない旨のエラーが発生してしまうが、どのように修正すればよいでしょうか？

動作環境

さくらVPS
LINUX
CentOS8
Node.js
nodebrew
npm
Javascript
google-charts-node ⇒ https://github.com/typpo/google-charts-node

該当のソースコード

◆node実行指示
node sample.js 'Population_of_Largest_U.S._Cities'

◆エラー表示
Page error: Error: ReferenceError: title_input is not defined
    at drawChart (about:blank:22:14)
    at drawChartFn (about:blank:37:11)
    at about:blank:44:24

◆sample.js

const GoogleChartsNode = require('/root/node_modules/google-charts-node');
const fs = require('fs');

var title_input  =process.argv[2]; //コマンドライン引数を受け取り、グローバル変数に格納

// Define your chart drawing function
function drawChart() {
    const data = google.visualization.arrayToDataTable([
      ['City', '2010 Population',],
      ['New York City, NY', 8175000],
      ['Los Angeles, CA', 3792000]
    ]);

    const options = {
      title: title_input,　//グローバル変数を適用させたい
      chartArea: {width: '50%'},
      hAxis: {
        title: 'Total Population',
        minValue: 0
      },
      vAxis: {
        title: 'City'
      }
    };

    const chart = new google.visualization.BarChart(container);
    chart.draw(data, options);
}

// Render the chart to image
(async () => {
  const image = await GoogleChartsNode.render(drawChart, {
    width: 400,
    height: 300
  });
  fs.writeFileSync('/var/www/html/google-chart1.png', image);
})();

Answer 1

下記のようにsample.js側で関数の内容を文字列として組み立てる必要があります。

◆sample.js
（略）
const title_input  = process.argv[2]; //コマンドライン引数を受け取り、グローバル変数に格納

const drawChartFunc = ` 
function drawChart() {
  const data = google.visualization.arrayToDataTable([
      ['City', '2010 Population',],
      ['New York City, NY', 8175000],
      ['Los Angeles, CA', 3792000],
      ['Chicago, IL', 2695000],
      ['Houston, TX', 2099000],
      ['Philadelphia, PA', 1526000]
    ]);

    const options = {
      title: '${title_input}',
      chartArea: {width: '50%'},
      hAxis: {
        title: 'Total Population',
        minValue: 0
      },
      vAxis: {
        title: 'City'
      }
    };

    const chart = new google.visualization.BarChart(container);
    chart.draw(data, options);
}
`;

// Render the chart to image
(async () => {
const image = await GoogleChartsNode.render(drawChartFunc, {
    width: 400,
    height: 300
});
fs.writeFileSync('./google-chart-variable-titled.png', image);
})()

---

［元のコードでエラーが生じる理由］
GoogleChartsNode.render()関数の第一引数に関数を指定した場合、
指定された関数はそのまま文字列に変換され（※）、
puppeteerが起動するヘッドレスブラウザ内でパースされます。
※の部分で、関数内の式や変数等は展開されません。

したがって、あらかじめ式や変数等を展開した後の文字列を組み立てておいてから、render関数に渡す必要があります。

Comments

[m.s.2000]

今回も回答ありがとうございます。
アドバイス通り修正したら無事実行出来ました。
ありがとうございました！