Google スプレッドシートでセンサデータの可視化
はじめに
ESP32 Wi-Fi Kit2に温湿度センサを取り付けるだけで、環境センサが出来上がります。この環境センサをインターネットに繋げば、スプレッドシートでセンサデータの可視化が簡単に出来ます。
用意するもの
- ESP32 Wi-Fi Kit2
- 以下のいずれかのセンサを使用
- 単4ニッケル⽔素電池x3本
- 開発用パソコン
- Wi-Fiルータ
デモ動画
Google Apps Scriptの設定
Google Apps Scriptを使って、Leafonyにソースコードを書く時に必要なWebアプリの設定を行います。
-
sheets.google.com でスプレッドシートのホーム画面を開き、新しいスプレッドシートを作成をします。
-
スプレッドシートを開き
拡張機能
→Apps Script
をクリックし、以下のソースコードを貼り付けます。spreadsheetId
とsheetName
は、以下を参照し入力します。spreadsheetId
: こちらを参照し入力します。sheetName
:スプレッドシートのシート名を入力します。デフォルトは、シート1
になっています。
function doGet(e) {
let id = 'spreadsheetId'; //Insert spreadsheetId
let sheetName = 'sheetName'; //Insert sheetName
var result;
// e.parameter has received GET parameters, i.e. temperature, humidity, illumination
if (e.parameter == undefined) {
result = 'Parameter undefined';
} else {
var sheet = SpreadsheetApp.openById(id).getSheetByName(sheetName);
var newRow = sheet.getLastRow() + 1; // get row number to be inserted
var rowData = [];
// get current time
rowData[0] = new Date();
rowData[1] = e.parameter.UniqueID;
rowData[2] = e.parameter.temperature;
rowData[3] = e.parameter.humidity;
rowData[4] = e.parameter.illumination;
// 1 x rowData.length cells from (newRow, 1) cell are specified
var newRange = sheet.getRange(newRow, 1, 1, rowData.length);
// insert data to the target cells
newRange.setValues([rowData]);
result = 'Ok';
}
return ContentService.createTextOutput(result);
}
Google Apps Scriptのデプロイ
GASのデプロイ2の手順を説明します。
-
スプレッドシートを開き
拡張機能
→Apps Script
をクリックします。 -
右上の
デプロイ
→新しいデプロイ
をクリックします。 -
新しいデプロイ
の画面が表示されたら、設定
→ウェブアプリ
をクリックします。 -
新しいデプロイ
の詳細設定画面が表示されたら、以下の設定をし、最後に右下のデプロイ
をクリックします。- 説明:特に何も入力せず空欄でOK
- 次のユーザーとして実行:自分
- アクセスできるユーザー:全員
-
データへのアクセスを許可するために、
アクセスを承認
をクリックして下さい。 -
デプロイが完了できたら、デプロイIDとウェブアプリURLが表示されます。
-
デプロイID:ソースコードを書く時に使用します。
-
ウェブアプリURLは、 Google Apps Scriptのテストに使用します。
-
-
デプロイIDとウェブアプリURLをコピーして、
完了
をクリックします。
Leafonyの組み立て
DHT22の場合
ESP32 Wi-Fi Kit2を箱から取出し、DHT22と29pin headerを以下の通りに結線します。
DHT22 | 29pin header |
---|---|
VCC-power supply | 1 |
DAT-signal | 15 |
GND | 27 |
4-Sensorsの場合
ESP32 Wi-Fi Kit2のRTC & microSDを外して、4-Sensorsを取付けます。
ソースコード
開発環境の設定
Arduino IDEか、 PlatformIO IDE の開発環境を設定して下さい。
ソースコードのダウンロード
開発用パソコンに、ソースコードをダウンロードします。
IDE | DHT22 | 4-Sensors |
---|---|---|
Arduino IDE | Arduino_DHT22ソースコード | Arduino_4-Sensorsソースコード |
PlatformIO IDE | PlatformIO_DHT22ソースコード | PlatformIO_4-Sensorsソースコード |
- DHT22は、DHT-sensor-libraryを使用します。
ソースコードの編集
個人や家庭などのWi-Fiルータ(WPA2 Personal 3)は、ソースコードに以下の内容を記述して下さい。
ssid
:Wi-FiルータのSSIDを入力します。password
:Wi-Fiルータのパスワードを入力します。google_scripts_key
:Google Apps ScriptのデプロイIDを入力します。
大学や企業などのWi-Fiルータ(wpa2 Enterprise 4)は、ソースコードに以下の内容を記述して下さい。
//#define ENTERPRISE
のコメント(//
)を外します。identity
: 利用するユーザのIDを入力します。password
:利用するユーザのパスワードを入力します。ssid
:Wi-FiルータのSSIDを入力します。google_scripts_key
:Google Apps ScriptのデプロイIDを入力します。
ソースコードの書き込み
ソースコードの編集が完了したら、パソコンと接続して、書き込みます。
実行結果
- スプレッドシートを開き、1行目にDatetime、UniqueID、Temperature、Humidity、Illumination5ののカラム名を記入します。
- ESP32 MCUのリセットボタンを押してプログラムを実行させると、センサの値がスプレッドシートに書き込まれます。
Tips
Google Apps Scriptのテスト
GASが正しく実行出来るかテストをします。
- ウェブアプリURLの末尾に、
?UniqueID=Leafony_A&temperature=10&humidity=20&illumination=30
を加えてWebにアクセスします。 - スプレッドシートに、Datetime、Leafony_A、10、20、30の値が書き込まれていれば、正しく実行しています。
Google Apps Scriptを編集する場合
- スプレッドシートを開き、
拡張機能
→Apps Script
をクリックします。 - 右上の
デプロイ
→デプロイを管理
をクリックします。 デプロイを管理
が表示されたら、編集
のアイコンをクリックして新バージョン
を選択し、デプロイ
をクリックします。
Grafanaでスプレッドシートをグラフ化
Grafanaは、データベースに保存されたデータに対して、リアルタイムにてデータを表示するマルチプラットフォームのWebアプリケーションです。ここでは、WindowsでGrafanaを起動し、Googleスプレッドシートに保存されているデータをグラフにします。
- Grafanaのダウンロードページ よりWindows版のインストーラをダウンロードし、画面の指示に従ってインストールします。
C:\Program Files\GrafanaLabs\grafana\bin\grafana-server.exe
を実行してブラウザを開き、以下のリンクにアクセスします。- http://localhost:3000/
- 以下でログインして、初期パスワードを変更します。
- Email or username:admin
- Password:admin
- 左上の
Toggle Menue
をクリックし、サイドバーを表示させます。 Administration→Plugins
を開き、Google Sheets
を検索し、インストールして下さい。Administration→Data sources
を開き、Add data source
をクリックし、Google Sheets
を Data Sourceに追加します。Google Sheets Settig
sの画面で以下の項目を入力し、Save & Test
をクリックします。- Auth:API Keyを選択
- API Key:API Keyは画面下の
Generate an API key
に従って発行します。6
Dashboards→New(右側)
をクリックし、New Dashboard
を選択します。Add Visualization
をクリックすると、編集画面が表示されるので、以下の項目を入力します。詳しくは、こちらを参照して下さい。spreadsheetId
: こちらを参照し入力します。Range
:シート1!A:B
のような文字列で、範囲をしてします。- Cache time:デフォルトのキャッシュ時間は 5 分に設定されていますが、キャッシュ時間を 0 に設定すると、キャッシュがバイパスされます。
- Time filter:時間フィルターを
ON
にします。
-
一般的にデプロイとは、ソフトウェアを利用可能にする活動全般を指す用語で、Google Apps Scriptの場合は、ソフトウェアなどを実行できる状態にして、URLを生成することを意味しています。 ↩︎
-
個人や家庭、小規模事業所などためのセキュリティの仕様。端末毎に設定してあるパスワードにより認証を行う。 ↩︎
-
企業など比較的規模の大きいネットワークのためのセキュリティの仕様。利用者毎に登録したIDとパスワードにより認証を行う。 ↩︎
-
Illuminationは、4-Sensorsの場合だけ表示されます。 ↩︎
-
API Keyの設定は、こちらを参照して下さい。また、スプレッドシートを
共有
にしないと、Google Sheets API
が表示されません。適切に共有の設定をして下さい。 ↩︎