🌈
システム開発
運用中

Google Apps Scriptによるシステム開発

Google Apps Script教職協働

麻布大学「気象データビジュアライザ」開発事例に見る教職協働プロジェクトの実践

はじめに

教育機関におけるデジタル化の推進において、限られた予算と人材でいかに効果的なシステムを構築するかは共通の課題です。麻布大学では、Google Apps Scriptを中核とした開発手法により、高機能なWebアプリケーションを自力で構築しており、教務DXプロジェクトにおいても積極的に開発が進められています。

これまで教務DXプロジェクト開発をてがけてきたもの

・大学HP投稿用HTMLの自動生成ツール

・麻布大学ピンポイント天気（天気予報表示ツール）

・気象データビジュアライザ（本記事で詳細を紹介）

その他、大学内で稼働している事務職員が開発したツールの例

・麻布大学電力モニタ（構内電力モニタリングツール）

・Webスライドショーシステム

・ディプロマポリシーフィードバックシステム

本記事では、教務DXプロジェクトの代表的な成果である「麻布大学気象データビジュアライザ」の開発事例を通じて、Google Apps Scriptを活用した実践的なシステム開発手法と、教職協働プロジェクトの具体的な運営方法について詳しく紹介します。

教職協働による気象データビジュアライザ開発

プロジェクト概要と教職協働体制

麻布大学気象データビジュアライザは、2025年7月に運用を開始した、大学構内の気象データをリアルタイムで可視化するWebアプリケーションです。

プロジェクト開始のきっかけは、本学客員教員である髙田久美子先生が、事務局ホームページ上に掲載されている上述の「麻布大学電力モニタ」や当時（開発中）となっていた「麻布大学ピンポイント天気」を見て、興味を持ったことでした。髙田先生は、早速、同アプリケーションを開発した豊田氏（教務DXプロジェクトリーダー）に声をかけ、麻布大学ピンポイント天気について、「構内に気象データロガーを設置し、リアルタイムにグラフ表示させるのはどうか」を提案しました。それを聞いた豊田氏はすぐに賛同し、自然発生的に教職協働体制が組まれ開発がスタートしたのです。

教職協働におけるそれぞれの役割分担：

髙田久美子 先生（https://researchmap.jp/takata_k）：

  • 測定器の仕様設計と選定
  • 各測定項目および推定値の学術的検証
  • 気象学的知見に基づく計算ロジックの監修
  • 教育・研究活動での活用方法の検討

豊田氏（https://azabu-dx-lab.pages.dev/team/cpphcfig0h/）：

  • データビジュアライゼーションプログラムの開発
  • Google Apps Scriptを用いたシステム設計・実装
  • ユーザーインターフェースの設計・最適化
  • システムの運用・保守体制の構築

観測システムの仕様

その後、気象データログから未来の天気予報を予測して表示するのは、現環境では難しいという判断に至り、麻布大学ピンポイント天気とは別のプロジェクト「気象データビジュアライザ」としてリスタートしたシステムは、以下のような仕様により開発が進められました：

観測地点：ドッグラン脇（ウィンドチャイム前）

測定機器：HOBO RX3000 Remote Monitoring Station

https://www.onsetcomp.com/products/data-loggers/rx3000?srsltid=AfmBOorOqRa0wtfOtHLOsK8oVV2kyT9UkbNRBOX0ZzeTvGPKdl5IbTfZ

測定項目：

  • 気温（高さ2m）
  • 湿度
  • 光合成有効放射量（PAR）
  • 黒球温度

推定値（測定項目から計算）：

  • 暑さ指数（WBGT）
  • 露点温度
  • 湿球温度

Google Apps ScriptによるWebアプリケーション実装

一方、Webアプリケーション実装については、測定器から取得したデータを用い、Google Apps Scriptを中核として開発が進められました。特に以下の3つの技術実装が特徴的です。

湿球温度の高精度算出

乾湿計用湿度表を用いた線形補間アルゴリズムにより、気温と湿度から湿球温度を高精度で算出：

function calculateWetBulbUsingTable(airTemp, humidity) {
  // 湿度テーブル（-10℃～40℃、0.5℃刻み）
  const humidityTable = {
    40: [100,97,94,91,88,85,82,79,76,73,71,68,66,63,60,58,56,53,51,49,47],
    35: [100,97,93,90,87,83,80,77,74,71,68,65,63,60,57,54,52,49,47,44,42],
    // ... 他の温度も同様に定義
  };

  // 温度範囲を特定し、線形補間で精密な値を算出
  const tempDiff = findTempDiff(airTemp, humidity);
  return airTemp - tempDiff;  // 湿球温度 = 気温 - 温度差
}

WBGT（暑さ指数）の算出

湿球温度、黒球温度、乾球温度から暑さ指数を計算：

function calculateWBGT(wetBulbTemp, blackGlobeTemp, dryBulbTemp) {
  return 0.7 * wetBulbTemp + 0.2 * blackGlobeTemp + 0.1 * dryBulbTemp;
}

amCharts 5によるグラフ化

複雑なamCharts 5のAPIを使用して、インタラクティブなグラフを生成：

// チャートルートの初期化
const root = am5.Root.new("chartdiv");
root.setThemes([am5themes_Animated.new(root)]);

// XYチャートの作成
const chart = root.container.children.push(
  am5xy.XYChart.new(root, {
    panX: true,
    panY: true,
    wheelX: "panX",
    wheelY: "zoomX"
  })
);

// 日時軸の設定
const xAxis = chart.xAxes.push(
  am5xy.DateAxis.new(root, {
    baseInterval: { timeUnit: "minute", count: 30 },
    renderer: am5xy.AxisRendererX.new(root, {})
  })
);

// Y軸の設定
const yAxis = chart.yAxes.push(
  am5xy.ValueAxis.new(root, {
    renderer: am5xy.AxisRendererY.new(root, {})
  })
);

// データシリーズの作成
const series = chart.series.push(
  am5xy.LineSeries.new(root, {
    name: config.title,
    xAxis: xAxis,
    yAxis: yAxis,
    valueYField: "value",
    valueXField: "date"
  })
);

// データの設定とアニメーション
series.data.setAll(chartData);
series.appear(1000);
chart.appear(1000, 100);

豊富なグラフ制御機能

また、グラフについてもユーザの利便性を考慮し、細かな機能開発、調整が行われました。

３変数を同時にグラフ化

表示領域のログ出力

WGBT専用のグラフ表示モード

WGBT専用のブログパーツ

他機関への応用可能性

こうして構想から概ね1年で「気象データビジュアライザ」は完成し、2025年7月に学内へ正式にリリースされました。とくに暑さ指数（WGBT）表示機能は好評で、夏季部活動や学内行事の実施に際し参考にされたほか、データの一部は教育研究にも活用されました。

気象データビジュアライザのソフトウェア部分は、以下の技術的要件によるため、基本的に無償で構築されています。

気象データビジュアライザの技術的要件

  • Google Workspace for Educationの基本機能のみ使用
  • 追加ソフトウェア・サーバー不要
  • JavaScript基礎知識があれば導入可能
  • OSSの活用

よって、データソースを変えることにより、施設・環境管理、学生サービス、研究支援、広報・マーケティングなど多様な分野への展開が可能となります。

まとめ

Google Apps Scriptを中核とした高機能Webアプリケーションの自力開発を実現しました。この手法は他の教育機関でも再現可能であり、各機関の特性に応じたシステム開発の新たなモデルを提示しています。教職協働により、限られたリソースでも創意工夫により大きな成果を生み出せることを実証した貴重な事例となります。。

参考情報