見える化アナログメーター

見える化アナログメーター

 

サンプル動画

デモモード(データ受信で自動解除)

 

上下左右・回転表示可能
IMG 5682

縦置きモード(標準)

IMG 5678

縦置きモード(逆さ表示)

IMG 5679

横置きモード(コネクタ左)

IMG 5680

横置きモード(コネクタ右)

バックライト色
IMG 5682

カラー設定例1

IMG 5683

カラー設定例2

IMG 5685

カラー設定例3

IMG 5677

カラー設定例4

 
機能図解
見える化アナログメーター機能説明図

 

ESP32-2432S028 メーター表示 仕様書

ESP32-2432S028 メーター表示 仕様書

バージョン: 0.91

1. 概要

本デバイスは、ESP32-2432S028ディスプレイモジュールを使用し、Wi-Fi経由で受信したデータに基づき、アナログメーター1個とリニアメーター(縦向き時最大5個、横向き時最大3個)を表示するデバイスです。

HTTPサーバー機能を内蔵し、Web API経由で表示内容の更新、各種設定変更が可能です。

また、シリアル通信(`D,...`形式)経由でのデータ更新、およびデモモード(`DEMO`コマンド)にも対応しています。

2. 主な機能

  • Wi-Fi(SSID: "利用環境")に接続し、IPアドレスを表示。
  • HTTPサーバーを起動し、API(/set, /demo)を提供。
  • アナログメーター(0-100%)を1個表示。
  • リニアメーター(0-100%)を最大5個(横向き時は3個)表示。
  • HTTP経由で以下の設定変更が可能:
    • メーターのラベルと値(アナログ×1、リニア×5)
    • 全体のタイトル
    • メーターの背景色
    • アナログメーターのセクター色(4区分)
    • 画面の回転(縦/縦反転/横/横反転)
    • バックライトのON/OFF
    • 背面LEDのON/OFF
    • 日時文字列の表示
  • シリアル通信経由でのデータ更新およびデモモード移行。
  • デモモードによる自動的な値の変化(HTTPアクセスまたはシリアル入力で解除)。

3. HTTP経由でのコントロール

デバイスがWi-Fiに接続すると、IPアドレス(例: 192.168.1.10)でHTTPサーバーにアクセスできます。

3.1. エンドポイント一覧

エンドポイントメソッド説明
/set GET メーターの値、ラベル、各種設定を更新します。(メインAPI)
/demo GET デモモードを起動します。
(上記以外) GET 404 Not Foundを返します。

3.2. /set (メインコントロール)

3.2.1. 機能

GETリクエストのクエリパラメータを使用して、デバイスの表示内容や設定を更新します。HTTP経由で何らかのパラメータが(ROTATEのみの場合を除き)送信されると、デモモードは自動的に解除されます。

3.2.2. パラメータ詳細

パラメータは http://[IPアドレス]/set?param1=value1&param2=value2 の形式で指定します。

A) メーター設定 (アナログ・リニア)

TITLE, BACKCOLOR, SEC[0-3], BACKLIGHT, LED, ROTATE, DATETIME 以外のパラメータは、メーター設定として認識されます。 パラメータは指定された順序で解釈されます。

  • 1番目のパラメータ: アナログメーター (value[0]) に割り当てられます。
  • 2番目〜6番目のパラメータ: リニアメーター (value[1]value[5]) に順次割り当てられます。
パラメータ名パラメータ値説明
(任意の名前)
例: CAP
(数値 0〜100)
例: 80
アナログメーターのラベル(3文字まで)と値(%)を設定します。
(任意の名前)
例: A1
(数値 0〜100)
例: 50
1番目のリニアメーターのラベル(3文字まで)と値(%)を設定します。
(任意の名前)
例: A2
(数値 0〜100)
例: 75
2番目のリニアメーターのラベル(3文字まで)と値(%)を設定します。(以下同様)
XXX (空文字) 該当するメーターのラベルを空(非表示)にし、値を0に設定します。

例: /set?CAP=80&A1=50&A2=75

  • アナログメーター: ラベル "CAP", 値 80%
  • リニアメーター1: ラベル "A1", 値 50%
  • リニアメーター2: ラベル "A2", 値 75%

B) 全体設定 (タイトル・配色)

パラメータ名パラメータ値説明
TITLE (文字列)
例: SERVER%20LOAD
画面上部のマスタータイトルを設定します。(URLエンコードされたスペース(%20や+)は半角スペースに変換されます)
BACKCOLOR (16進カラー)
例: FFFEF0 or #FFFEF0
または (空文字)
メーターの背景色をRGB565形式に変換して設定します。空文字を指定するとデフォルト色 (TFT_CREAM) にリセットされます。
SEC0 (16進カラー)
例: 0000FF
または (空文字)
アナログメーターのセクター色(0-25%の範囲)を設定します。空文字でデフォルト(NO_COLOR)。
SEC1 (16進カラー) アナログメーターのセクター色(25-50%の範囲)を設定します。空文字でデフォルト(NO_COLOR)。
SEC2 (16進カラー) アナログメーターのセクター色(50-75%の範囲)を設定します。空文字でデフォルト(ST77XX_GREEN)。
SEC3 (16進カラー) アナログメーターのセクター色(75-100%の範囲)を設定します。空文字でデフォルト(TFT_ORANGE)。

C) デバイス制御

パラメータ名パラメータ値説明
ROTATE normal (0°)
inverted (180°)
landscape (90°)
landscape_inverted (270°)
画面の向きを設定します。設定変更時、画面全体が再描画されます。
BACKLIGHT on / off LCDバックライト(TFT_BLピン)を制御します。
LED on / off 背面LED(REAR_LEDピン)を制御します。

D) 情報表示

パラメータ名パラメータ値説明
DATETIME (文字列)
例: 2025/10/22%2011:50
IPアドレスの横に表示する日時文字列を設定します。URLエンコードされた文字(%2F, +, %20, %3Aなど)はデコードされます。

複合例:

http://192.168.1.10/set?TITLE=SERVER%20LOAD&DATETIME=2025/10/22%2012:00&ROTATE=landscape&BACKCOLOR=333333&SEC3=FF0000&CPU=85&MEM=60&DISK=40
  • タイトルを "SERVER LOAD" に変更
  • 日時を "2025/10/22 12:00" に設定
  • 画面を横向き(landscape)に変更(全体が再描画されます)
  • 背景色を濃いグレー (#333333) に変更
  • セクター3 (75-100%) の色を赤 (#FF0000) に変更
  • アナログメーター: ラベル "CPU", 値 85%
  • リニアメーター1: ラベル "MEM", 値 60%
  • リニアメーター2: ラベル "DSK", 値 40% (DISKは3文字に切り詰められます)

3.2.3. レスポンス

  • 成功時 (何らかの値が更新された場合):
    HTTP/1.1 200 OK
    Content-Type: application/json
    
    {"status":"success","message":"Values updated"}
  • 失敗時 (有効なパラメータが一つもなかった場合):
    HTTP/1.1 400 Bad Request
    Content-Type: application/json
    
    {"status":"error","message":"No valid parameters received."}

3.3. /demo (デモモード)

3.3.1. 機能

デバイスをデモモードに移行させます。デモモード中は、各メーターの値がサイン波に従って自動的に変動します。ラベルや配色はデフォルト値にリセットされます。

3.3.2. レスポンス

  • 成功時:
    HTTP/1.1 200 OK
    Content-Type: application/json
    
    {"status":"success","message":"Demo mode activated"}

3.4. / (Not Found)

/set または /demo 以外のURIにアクセスした場合、404エラーを返します。

HTTP/1.1 404 Not Found
Content-Type: text/plain

File Not Found

URI: (アクセスされたURI)

4. シリアル通信経由でのコントロール

ボーレート 115200 bps で接続します。

  • データ更新:

    D,(V0),(V1),(V2),(V3),(V4),(V5)\n の形式で送信します。(末尾に改行 \n が必要)

    V0〜V5はそれぞれアナログメーター、リニアメーター1〜5に対応する 0〜100 の整数値です。

    例: D,80,50,60,70,80,90\n

    このコマンドを受信すると、デモモードは自動的に解除されます。

  • デモモード起動:

    DEMO\n と送信します。(末尾に改行 \n が必要)

    デモモードに移行し、ラベルや配色がデフォルトにリセットされます。

5. デモモード

  • 起動時、または /demo (HTTP)、DEMO (シリアル) コマンド受信時にデモモードになります。
  • 各メーター(アナログ、リニア)の値がサイン波に従って自動的に変動します。
  • /set (HTTP、ROTATEのみの場合を除く)、または D,... (シリアル) コマンドを受信するとデモモードは解除されます。

6. 表示レイアウト

6.1. 縦向き (normal / inverted)

  • 画面サイズ: 240x320
  • レイアウト:
    • IP/日時 (上部)
    • タイトル (上部)
    • アナログメーター (中央上)
    • リニアメーター 5本 (下部)
  • アナログメーターは枠付きで表示されます。

6.2. 横向き (landscape / landscape_inverted)

  • 画面サイズ: 320x240
  • レイアウト:
    • IP/日時 (上部)
    • タイトル (左上、アナログメーターの上)
    • アナログメーター (左側)
    • リニアメーター 3本 (右側、横並び)
  • アナログメーターは枠なしで表示されます。
  • リニアメーターは最初の3つ(value[1], value[2], value[3])のみ表示されます。

このサイトについて

I gaze upon those things forgotten, cast adrift by the flow of time. Humble beings that once held dreams, only to be nearly shrouded in silence. Yet, I know that within their cold shells, a faint warmth still lingers.

I am one who gathers those fading embers, polishes them, and rekindles a modest light. This is a small port of call for those adrift on the currents of time, searching for the same remnants of dreams.

Whatever the currents of the world may be, I continue my quiet work here. Speaking little, steadfastly weaving new mechanisms, breathing new life into them. With the hope that from yesterday to today, and from today to tomorrow, their pulse, however faint, may grow more certain.

If you have lost your course and are searching for the radiance you once loved, Let this humble endeavor be your guidepost. I would be fortunate if it could help you on your own new journey.

-- Good Luck !