【JavaScript】Google Chartでグラフの描写後に処理を行う

JavaScriptにて、Google Chartの描写処理が終わった後で何か処理を行いたい場合（コールバック）はaddListenerという関数を使用する。

google.visualization.events.addListener(chart, 'ready', function () {});

使用例:

google.charts.load('current', {packages: ['corechart']});
google.charts.setOnLoadCallback(function () {
  var chart = new google.visualization.ColumnChart(document.getElementById('target'));
  google.visualization.events.addListener(chart, "ready", function () {
     
     /** グラフ描写後の処理 **/

  });

  var data = new google.visualization.DataTable();
  data.addColumn("string", "商品名");
  data.addColumn("number", "注文数");
  data.addRows([
    ["アメリカンコーヒー", 80],
    ["エスプレッソ", 120],
    ["カプチーノ", 70],
    ["カフェラテ", 60]
  ]);

  var options = {}
  options["title"] = "販売数";

  chart.draw(data, options);
});

グラフの描写によってレイアウトが崩れるようなHTMlで活用できる。