はじめに

前回 SenseCAP Indicator D1 に交通情報を表示してみましたが、M5Stack でもいけるのでは？と、いうことでやってみました。

M5Stack はちょっと前の BASIC です。SenseCAP Indicator D1 で使われている ESP32S3 と比較すると、PSRAMもなくリソースに制約があります。

SenseCAP Indicator D1 では画像をメモリ上に取り込みストライプを使っていました、JSON の解析も ArduinoJson ライブラリーを使ってメモリ上で行っていました。M5Stack ではどちらもストリーミングで処理します。png を表示する pngle と JSON の解析を行う json-streaming-parser を使用させていただきました。

ソース

ソースはこちらをご覧ください
https://github.com/fukuen/M5Stack-Traffic

地図

今回は首都高速の道路情報を表示します。M5Stack のディスプレイは 320x240 ですが、都心環状線がぴったり収まります。

一般道の道路情報では国土地理院の地図タイルベースで作成されていましたが、高速道路の地図は独自の規格で作成されているようですが、基本的な考え方は同じようです。

ポリゴン

一般道の道路情報では渋滞などの情報は線で表現されていましたが、高速道路ではポリゴンで表現されています。M5Stack のポリゴン表示ライブラリーをいろいろ探して、送られてくるポリゴン情報が表示されるものを使ってみましたが、一部不要な線が引かれたりまだ少し調整が必要なようです。

おわり

json-streaming-parser はもう7年くらい更新されていないようですが、問題なく使えました。懐かしい XML の SAX Parser みたいですね。