Raspi4でリビングのCO2濃度を表示するwebアプリを作ってみた

2021年9月16日 18:49

こんにちは、かたさんです。

寝室で使っていたCO2モニターが色々あってお役御免となったので、リビングPCとして使っているRaspberry Pi 4(Raspi4)に繋いでIoTっぽいことをしてみました。

リビングPCについては、こちらの記事にも少し書いているのでもしよければ(宣伝)。

目的

我が家のリビングには、南向きの窓に加えて西向きにガラスタイルもついており(オシャレのつもりかな？)、夕方になると西日を受けてガラスタイル付近がかなり暑くなります。リビングの片隅に妻の作業スペースがあり、テレワーク環境としてどうなのか気になっていました。

そこで、リビングの状態(室温及びCO2濃度)をブラウザ上で見られるようにしてやろうというのが今回の目的となります。
自宅内で見られれば十分なため、外部への公開はせずにLANからのアクセスのみを想定しています。

Chart.jsのようなライブラリを使ってリアルタイム表示するのも面白いかなと一瞬思ったのですが、そこまでリアルタイムで見る必要性もないので、今回はアクセスする度に直近2日のグラフを生成するアプリケーションを作成しました。

用意するもの

・Raspberry Pi4 Model B 4GB (スペック的には3でも全然余裕です)
・Custom CO2-mini (Linuxで叩けるものならOKですが、今回はこれ向け)

また、ルータ上でRaspi4のローカルIPアドレスを固定しておいてください。
(今回は192.168.0.32に設定)

インストール手順

今回作成したソースコード一式は以下に置いています。

rootから以下のパッケージ・ライブラリをインストールします。

apt install -y python3-matplotlib apache2 python3 python3-pip libhidapi-hidraw0
pip3 install git+https://github.com/heinemml/CO2Meter
pip3 install pandas

まず、以下のサイトのようにapache2でPython CGIが動くように設定します。

/etc/apache2/apache2.confに以下を追記。

<IfModule alias_module>
ScriptAlias /cgi-bin/ "/var/www/cgi-bin"
</IfModule>    
<Directory "/var/www/cgi-bin">
   Options +ExecCGI
   AddHandler cgi-script .cgi .py
   AllowOverride None
   Require all granted
</Directory>

また、以下のようにしてCGIを有効化します。

cd /etc/apache2/mods-enabled
a2enmod cgi
systemctl restart apache2

次に、CGI実行のために必要なディレクトリなどを用意します。
cgi-bin/tmpをブラウザ側からアクセス出来るようにしておき(chmod 777)、
cgi-bin/tmpに置いた画像をhtml/内からシンボリックリンク経由で参照する形とします。

mkdir -p /var/www/cgi-bin
mkdir -p /var/www/cgi-bin/tmp
chmod 777 /var/www/cgi-bin/tmp
ln -fns /var/www/cgi-bin/tmp/co2.png /var/www/html/
ln -fns /var/www/cgi-bin/tmp/temp.png /var/www/html/

あとは、リポジトリ内にあるソースコード2つを設置していきます。
ここでは、以下のように置くものとしました。

/root/work/co2_visualize/co2_collect.py (データ取得用、cronで自動実行)
/var/www/cgi-bin/co2.py (webアプリの本体)

co2_collect.pyについて、cronで1分おきに呼び出すように設定しました。

* * * * * /usr/bin/python3 /root/work/co2_visualize

co2.pyには実行権限を与えておく必要があります。

chmod 755 /var/www/cgi-bin/co2.py

あとは、Raspi4と同じLAN内にあるPC/スマホ等から下記にアクセスするだけで使えます。

http://{Raspi4のローカルIPアドレス}/cgi-bin/co2.py
(今回の場合、http://192.168.0.32/cgi-bin/co2.py)

すると、以下のように室温とCO2濃度のグラフが表示されます。

あまり長期間のデータを見る必要もないかなと思っているので、直近48時間のデータを表示する設定としています。

各スクリプトでやっていること

今回書いたスクリプトでやっている処理の内容にも一応簡単に触れておきます。

co2_collect.pyでは、以下の処理を行っています。

1. CO2miniの情報(現在の温度・CO2濃度)を取得してco2.logに追記

CO2miniにどのデバイス名が割り当てられたかについては、dmesgコマンドで確認しておいてください。(私の環境では/dev/hidraw2でした。)

また、co2.pyでは以下の処理を行っています。

1. pandasでco2.logを読み込んでDataFrame化する。
2. matplotlibで温度・CO2濃度を別々にグラフ化し、
それぞれcgi-bin/tmp/以下にpngファイルとして保存。
3. 生成した2つの画像を縦に並べるHTMLを愚直にprintする。

グラフ化にはmatplotlibを使っています。Raspi4でもこの程度の処理なら3秒ほどで完了できるので、たまに見る程度のアプリの性能としては十分かと思います。

私はこれをVivaldiのwebパネルとして登録しています。
CSSで画像サイズが画面の幅を超えないように設定しているので、こういう使い方もアリかなと思います。

おわりに

Raspi4でIoTっぽいことをしてみよう、ということでリビングのCO2濃度/室温を可視化してみました。

Apache2やPython3などの知識が多少必要にはなるものの、割と簡単にこういうWebアプリも作れてしまうのがRaspiの良いところかなと思います。

一家に一台Raspi4、いかがでしょうか？(回し者ではありません)

この記事が気に入ったらサポートをしてみませんか？