OpenAIのwhisperで、処理した音声認識テキストを表示するアプリ

https://github.com/gh6141/QtMp3Srt.git 

OpenAIのwhisperで音声認識処理すると.srtというファイルができますが。これと音声ファイル（mp3)を一緒のフォルダに置いて使えるようにしてみました。ちょうど、映画の字幕のような感じで表示できます。-smallのオプションで、処理したものだと、たまに認識が間違って、若干ずれることもありますが、日本語以外等でいろいろ使えそうです。

灯油残量 WIFI OLEDで表示

 ewp32-c3を表示用に使ってみた、センサーからのデータを蓄積しているraspiからWIFIで読み出すようにした。

#include <Wire.h> #include <Adafruit_SSD1306.h> #include <WiFi.h> #include <HTTPClient.h> #include <ArduinoJson.h> // ← これがJSON用 #include <U8g2_for_Adafruit_GFX.h> // 文字・描画 #include <Adafruit_GFX.h> U8G2_FOR_ADAFRUIT_GFX u8g2; Adafruit_SSD1306 display(128, 64, &Wire, -1); const char* ssid = "*******"; const char* password = "*******"; const char* url = "http://192.168.1.103:8888/py/cap?cap=list28"; const int GX = 0; const int GY = 14; // ← 上に詰める const int GW = 128; const int GH = 50; // ← 縦を大きく void setup() { Wire.begin(4, 5); display.begin(SSD1306_SWITCHCAPVCC, 0x3C); u8g2.begin(display); // ←重要 //display.println("WiFi connecting..."); WiFi.begin(ssid, password); while (WiFi.status() != WL_CONNECTED) { delay(500); // display.print("."); } //display.println("WiFi connected"); // display.println(WiFi.localIP()); // HTTPアクセス HTTPClient http; http.begin(url); int httpCode = http.GET(); if (httpCode > 0) { String payload = http.getString(); StaticJsonDocument<4096> doc; if (deserializeJson(doc, payload)) { display.clearDisplay(); u8g2.setFont(u8g2_font_6x10_tf); u8g2.drawStr(0,10,"JSON error"); display.display(); return; } JsonArray arr = doc.as<JsonArray>(); int n = arr.size(); if (n == 0) return; JsonObject latest = arr[n - 1]; String datetime = latest["datetime"]; float cap = latest["cap"]; float cap2 = latest["cap2"]; float temp=latest["temp"]; int hpa=latest["hpa"]; //float oil_cm = 23169.0 / cap - ( -0.115739 * (cap2 - 1129) + 2.32821 ); float oil_cm=cap2cmConv(cap,cap2); display.clearDisplay(); u8g2.setFont(u8g2_font_7x14_tf); char line[32]; String mdhm = datetime.substring(5, 7) + "/" + datetime.substring(8, 10) + " " + datetime.substring(11, 16); sprintf(line, "%s %.1fcm", mdhm.c_str(), oil_cm); u8g2.drawStr(0, 14, line); u8g2.setFont(u8g2_font_6x10_tf); char line2[32]; sprintf(line2, "%.1fC %dhPa", temp, (int)(hpa + 0.5)); u8g2.drawStr(0, 26, line2); for (int i = 1; i < n; i++) { JsonObject p0 = arr[i-1]; JsonObject p1 = arr[i]; int x1 = map(i-1, 0, n-1, GX, GX+GW); int x2 = map(i, 0, n-1, GX, GX+GW); /* // temp drawLineStyled( x1, yMap(p0["temp"].as<float>(), 0, 20), x2, yMap(p1["temp"].as<float>(), 0, 20), 1 ); */ // hpa-950 drawLineStyled( x1, yMap(p0["hpa"].as<float>()-950, 50, 100), x2, yMap(p1["hpa"].as<float>()-950, 50, 100), 0 ); } display.display(); } else { display.clearDisplay(); u8g2.setFont(u8g2_font_6x10_tf); u8g2.drawStr(0, 14, "HTTP request failed"); display.display(); return; } http.end(); } void loop(){} int yMap(float v, float minV, float maxV) { if (v < minV) v = minV; if (v > maxV) v = maxV; return GY + GH - (v - minV) * GH / (maxV - minV); } void drawLineStyled( int x1, int y1, int x2, int y2, uint8_t style ) { if (style == 0) { display.drawLine(x1, y1, x2, y2, SSD1306_WHITE); // 実線 } else if (style == 1) { for (int i = 0; i < 6; i++) { // 点線 display.drawPixel( x1 + (x2 - x1) * i / 6, y1 + (y2 - y1) * i / 6, SSD1306_WHITE ); } } else if (style == 2) { for (int i = 0; i < 6; i += 2) { // 破線 display.drawLine( x1 + (x2 - x1) * i / 6, y1 + (y2 - y1) * i / 6, x1 + (x2 - x1) * (i + 1) / 6, y1 + (y2 - y1) * (i + 1) / 6, SSD1306_WHITE ); } } } float cap2cmConv(int cap,int cap2){ return 23169.0 / cap - ( -0.115739 * (cap2 - 1129) + 2.32821 ); }

　とりあえず、補正計算（最小二乗法で近似していますが、はたしてこの式が正しいかどうかはまだ様子見る必要ありますが。）した残量に加えて、気温・気圧表示し、気圧変化のグラフも表示させてみた。スイッチオンで手軽に見ることができて便利。

　DC-DCコンバータが容量大きすぎて（今時は、小型の小容量のものもあるけれど、未使用でしまっていたので有効活用しようかと）、ケースの場所をふさいでしまった。たまたま、９V積層電池が余っていたので、コンバータを使うことにしたため、このようなアンバランスな組み合わせになってしまった。（OLEDの写真画像が一部かけて写っていた。たぶん、シャッター速度が速かったため？）

pic16f628AによるDFplayer改良

 EPROMで、どの番号まで再生したか、不揮発メモリに記録できるようにした。フォルダは01のみとした。以前のフォルダ番号用スイッチを制御用（1回タッチで番号を進める、２回タッチで番号を減らす）とし、ファイル番号用スイッチは、１回目の連続タッチで１０の位、２回目の連続タッチで１の位を指定して入力できるようにした。（ただし、１０未満は、１回目のタッチを１０回タッチすると０になるようにした。）

dfPlayer、しかもPIC利用だとやはり、かなり制限があって、コーディングも難しかった。

#define _XTAL_FREQ 4000000 #pragma config FOSC = INTOSCCLK // Oscillator Selection bits (INTOSC oscillator: CLKOUT function on RA6/OSC2/CLKOUT pin, I/O function on RA7/OSC1/CLKIN) #pragma config WDTE = OFF #pragma config PWRTE = OFF #pragma config MCLRE = OFF #pragma config BOREN = ON #pragma config LVP = ON #pragma config CPD = OFF #pragma config CP = OFF #include <xc.h> #include <stdio.h> #include <stdlib.h> #include <string.h> void dfply(char, unsigned char); void dfply_(char, unsigned char,unsigned char) ; void convertToMorse(unsigned char,char * ) ; void playMorse(char* ) ; void dash(); void dot(); void play(unsigned char ,unsigned char); int dfply_qry(char, unsigned char, unsigned char ); unsigned char flg=0; unsigned char cnum=0; unsigned char cnumA=0; unsigned char cketa=2; unsigned char cfnum=0; //command unsigned char shokaif=1; int main(int argc, char** argv) { TRISA = 0b00011000; // RA3,4 input Ok TRISB = 0b00000010 ; // RB1(RX)はINPUT　RB2(TX)とその他は全てOUTPUT PORTA = 0b00000000; PCON = 0b00001000 ;//4MHz 内部クロックは４ＭＨｚとする CMCON = 0b00000111 ; // コンパレータは使用しない(RA0-RA4はデジタルピンで使用) VRCON = 0b00000000 ; // RA2はデジタルピンで使用する TXSTA = 0b00100100; // 高速ボーレート、送信有効 RCSTA = 0b10010000; // 受信有効、シリアルポート有効 SPBRG=25; //クロック数4Mhzなら：25、8Mhz：51、16:Mhz：103、32Mhz:207 __delay_ms(2000); dfply(0x06, 0x14); // vol 20 __delay_ms(1000); cnumA = eeprom_read(0x00); if (cnumA == 0xFF) { cnumA = 1; eeprom_write(0x00, 1); cketa=0; } while (1) { //RA2 LED if(flg==0 ){ //最初のみ点滅 RA2=1; __delay_ms(1); RA2=0; __delay_ms(1000); } while (RA3==1 && RA4==0 ){ //長押し　command cfnum++; dash(); __delay_ms(200); if(cfnum==1){ cnumA++; }else if(cfnum==2){ cnumA=cnumA-cfnum; } cketa=2; } while (RA3 == 0 && RA4==1){ //長押し　ファイルカウント 1の位 cnum++; dot(); flg=1; __delay_ms(200); if(cnum==10){cnum=0;} //十の位が０にしたいとき if(cketa==0&&cnumA>0){cnumA=0;} //dotにふれたら、cnumAは初期化　ただし、累積中はそのまま } if(flg){ flg=0; __delay_ms(500); cnumA=cnumA*10+cnum; cketa++; cnum=0; } if(cketa==2||shokaif==1){ cketa=0; cfnum=0; __delay_ms(500); char morseCode[15]; convertToMorse(cnumA,morseCode); playMorse(morseCode); __delay_ms(100); if(shokaif==0){ //立ち上げ時は、再生しないように play(1,cnumA); __delay_ms(100); eeprom_write(0x00, cnumA); __delay_ms(100); } shokaif=0; } __delay_ms(300); } return (EXIT_SUCCESS); } void play(unsigned char cfnum_,unsigned char cnum_){ dfply_(0x0f, cnum_, cfnum_); // 初期化再生 dfply(0x0d, 0); // 再生コマンド } void dfply(char cmd, unsigned char parameter){ dfply_(cmd,parameter,0); } void dfply_(char cmd, unsigned char file, unsigned char folder) { while (!TXIF); TXREG = 0x7E; while (!TRMT); while (!TXIF); TXREG = 0xFF; while (!TRMT); while (!TXIF); TXREG = 0x06; while (!TRMT); while (!TXIF); TXREG = cmd; while (!TRMT); while (!TXIF); TXREG = 0x00; // Param MSB while (!TRMT); while (!TXIF); TXREG = folder; // フォルダ while (!TRMT); while (!TXIF); TXREG = file; // ファイル while (!TRMT); while (!TXIF); TXREG = 0xEF; while (!TRMT); } void dot() { RA2=1; __delay_ms(100); RA2=0; __delay_ms(100); } void dash() { RA2=1; __delay_ms(300); RA2=0; __delay_ms(100); } void playMorse(char* morseCode) { int i = 0; // ループカウンタを初期化 while (morseCode[i] != '\0') { // 終端文字である '\0' をチェック if (morseCode[i] == '.') { dot(); // 点を表す関数を呼び出し } else if (morseCode[i] == '-') { dash(); // 線を表す関数を呼び出し } else if (morseCode[i] == ' ') { __delay_ms(300); // スペースの場合は遅延 } i++; // 次の文字へ進む } } void convertToMorse(unsigned char num, char* result) { // Morse code for numbers 0-9 char* morseNumbers[] = { "-----", // 0 ".----", // 1 "..---", // 2 "...--", // 3 "....-", // 4 ".....", // 5 "-....", // 6 "--...", // 7 "---..", // 8 "----." // 9 }; char temp[20] = ""; // 一時的な結果を保存する配列 result[0] = '\0'; // 結果を初期化 // 処理対象の数字が 0 の場合は特別扱い if (num == 0) { strcpy(result, morseNumbers[0]); return; } while (num > 0) { int digit = num % 10; // 現在の桁を取得 strcpy(temp, morseNumbers[digit]); // 桁のモールスコードを取得 strcat(temp, " "); // 桁ごとにスペースを追加 strcat(temp, result); // 既存の結果に連結 strcpy(result, temp); // 結果を更新 num /= 10; // 次の桁へ } }

OpenAIのWhisperがローカル実行でかなりの認識率

 最近は、音声認識が、無料でしかもローカル実行で正確に認識できるのには驚きました。コマンドラインで実行できるので、アプリの中で活用できてとても便利だと思います。

バッチファイルです。途中のパスを通すところは、ffmpegのあるパスです。

radio2text.bat

@echo off setlocal REM ===== 設定 ===== set WHISPER_MODEL=small set LANG=en REM ===== 引数チェック ===== if "%~1"=="" ( echo Usage: radio2text.bat input_audio exit /b 1 ) set INPUT=%~1 set BASE=%~n1 REM ===== 音声変換 ===== set PATH=D:\video;%PATH% ffmpeg -y -i "%INPUT%" -ac 1 -ar 16000 "%BASE%.wav" REM ===== 文字起こし ===== whisper "%BASE%.wav" ^ --language %LANG% ^ --model %WHISPER_MODEL% ^ --output_format txt echo Done: %BASE%.txt endlocal

.m4aなど、いったん.wavに変換してから処理しています。

LANGはenが英語、jaが日本語　--languageないとどちらも出します

--output_format srt で時間付き字幕

Qt使えば

if (line.contains(QRegularExpression("[ぁ-んァ-ン一-龯]"))) {

    // 日本語

} else {

    // 英語

}

のように分けたりもできそうです。

※なお、準備としては ffmpeg以外に、python3.9以上で

pip install -U openai-whisper

をインストールするだけで動くようです。

ESP32灯油残量センサー 実験

まだ、測定値が安定しないので、新たに容量カウント補正用のセンサ（タンク入口までの短い線）を追加して、しばらくデータをとってみることにした。追加PINはGPIO15。esp32から外に出ている線がぬれるだけで、測定値に影響するので、補正できないか試す予定。 *******esp32 #include <WiFi.h> #include <WiFiClient.h> #include "esp_sleep.h" #include <Wire.h> #include "SparkFunBME280.h" #define TOUCH_PIN 12 #define TOUCH_PIN2 15 #define LED_PIN 2 #define SLEEP_SECONDS 21600 // 6時間 #define SERIAL_EN 0 // 1=debug, 0=off #if SERIAL_EN #define S_BEGIN(...) Serial.begin(__VA_ARGS__) #define S_PRINT(...) Serial.print(__VA_ARGS__) #define S_PRINTLN(...) Serial.println(__VA_ARGS__) #define S_PRINTF(...) Serial.printf(__VA_ARGS__) #define S_END(...) Serial.end() #else #define S_BEGIN(...) #define S_PRINT(...) #define S_PRINTLN(...) #define S_PRINTF(...) #define S_END(...) #endif const char* ssid = "***"; const char* password = "********"; const char* host = "*.*.*.*"; // Raspberry Pi IP const int port = 8888; const char* path = "/py/cap"; String url; String cprint; BME280 bme; void setup() { S_BEGIN(115200); delay(100); uint16_t capValue= readTouchStable(TOUCH_PIN); delay(300); uint16_t capValue2= readTouchStable(TOUCH_PIN2); delay(100); Wire.begin(21, 22); // SDA=21, SCL=22(SCKは間違い) bme.setI2CAddress(0x76); if (bme.beginI2C() == false) { S_PRINTLN("BME280 not detected!"); } else { S_PRINTLN("BME280 connected."); } WiFi.begin(ssid, password); S_PRINTLN("Connecting to WiFi"); while (WiFi.status() != WL_CONNECTED) { delay(500); S_PRINTLN("."); } S_PRINTLN("\nWiFi connected"); // uint16_t capValue = touchRead(TOUCH_PIN); S_PRINTF("Touch value: %d\n", capValue); S_PRINTF("Touch2 value: %d\n", capValue2); float tempC = bme.readTempC(); float humidity = bme.readFloatHumidity(); float pressure_hPa = bme.readFloatPressure() / 100.0; S_PRINTF("Temp: %.2f C, Humidity: %.2f %%, Pressure: %.2f hPa\n", tempC, humidity, pressure_hPa); url = String(path) + "?cap=" + String(capValue) + "&t=" + String(tempC, 1) + "&h=" + String(humidity, 1) + "&p=" + String(pressure_hPa, 1) + "&cap2=" + String(capValue2); cprint = String("GET ") + url + " HTTP/1.1\r\n" + "Host: " + host + "\r\n" + "Connection: close\r\n\r\n"; WiFiClient client; if (client.connect(host, port)) { S_PRINTLN("Connected to server"); client.print(cprint); while (client.connected() || client.available()) { if (client.available()) { String line = client.readStringUntil('\n'); S_PRINTLN(line); } } client.stop(); } else { S_PRINTLN("Connection failed url=" + url); } S_PRINTLN("Going to sleep..."); delay(100); WiFi.disconnect(true); WiFi.mode(WIFI_OFF); digitalWrite(LED_PIN, LOW); S_END(); esp_sleep_enable_timer_wakeup(SLEEP_SECONDS * 1000000ULL); esp_deep_sleep_start(); } void loop() { } int readTouchStable(int pin) { // チャネル切替直後の捨て読み (void)touchRead(pin); delay(5); int sum = 0; for (int i = 0; i < 8; i++) { sum += touchRead(pin); delay(5); // ほんの少し間隔 } return sum / 8; } *******bottle latest_cap = None LOG_FILE = "cap_log.txt" MAX_LINES = 200 def read_log(): if not os.path.exists(LOG_FILE): return [] with open(LOG_FILE, "r") as f: return f.readlines() def write_log(lines): with open(LOG_FILE, "w") as f: f.writelines(lines) latest_cap = None LOG_FILE = "cap_log.txt" MAX_LINES = 200 def read_log(): if not os.path.exists(LOG_FILE): return [] with open(LOG_FILE, "r") as f: return f.readlines() def write_log(lines): with open(LOG_FILE, "w") as f: f.writelines(lines) @app.route('/py/cap') def cap_handler(): cap_value = request.query.cap # ?cap=123 または ?cap=list10 list10だと最新の１０個データ表示 if cap_value: if cap_value.startswith("list"): # ?cap=listN の場合 try: n = int(cap_value[4:]) lines = read_log() start = max(0, len(lines) - n) latest_lines = lines[start:] response.content_type = 'application/json' # JSON形式で返す result = [] for line in latest_lines: dt_str,value_str,value_t,value_p,value_h,value_str2 = line.strip().split(',', 5) result.append({ "datetime": dt_str, "cap": int(value_str), "temp": float(value_t), "hpa": float(value_p), "hum": float(value_h), "cap2":int(value_str2) }) return json.dumps(result) except ValueError: response.status = 400 return "Invalid list parameter" else: # 数値の場合 try: t_value= request.query.t p_value= request.query.p h_value= request.query.h cap2_value= request.query.cap2 latest_cap = int(cap_value) latest_t=float(t_value) latest_p=float(p_value) latest_h=float(h_value) #latest_cap2=int(cap2_value) latest_cap2 = int(cap2_value) if cap2_value else 0 now_str = datetime.now().strftime("%Y-%m-%d %H:%M:%S") line = f"{now_str},{latest_cap},{latest_t},{latest_p},{latest_h},{latest_cap2}\n" # ログを読み込んで追記 lines = read_log() lines.append(line) # 最大行数を維持 if len(lines) > MAX_LINES: lines = lines[-MAX_LINES:] write_log(lines) return f"Cap value {latest_cap} saved.\n" except ValueError: response.status = 400 return "Invalid value" else: # パラメータなし → 最新値返す if latest_cap is not None: response.content_type = 'application/json' return json.dumps({"latest_cap": latest_cap}) else: response.status = 404 return "No data yet" @app.route('/py/captable') def captable(): return """ <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- 重要 --> <title>灯油タンク残量概算</title> <style> body { font-family: sans-serif; margin: 1em; } /* 入力エリア */ .controls { display: flex; flex-wrap: wrap; gap: 0.5em; align-items: center; } .controls label, .controls button { font-size: 1em; } /* テーブル */ table { border-collapse: collapse; width: 100%; margin-top: 1em; font-size: 0.95em; } th, td { border: 1px solid #999; padding: 0.5em; text-align: center; } /* スマホ向け：フォント少し小さく、テーブル横スクロール可 */ @media (max-width: 600px) { body { font-size: 0.9em; } .controls { flex-direction: column; align-items: flex-start; } table { display: block; overflow-x: auto; white-space: nowrap; } th, td { padding: 0.4em 0.6em; } } </style> </head> <body> <h3>残量データ一覧</h3> <div class="controls"> <label>a: <input type="number" id="a" value="-1.3013" step="0.01"></label> <label>b: <input type="number" id="b" value="592.123" step="0.01"></label> <button id="reload">再計算</button> </div> <table id="capTable"> <thead> <tr><th>日時</th><th>cap</th><th>残量cm</th><th>気温</th><th>気圧</th><th>湿度</th><th>cap2</th></tr> </thead> <tbody></tbody> </table> <script> function capToLevel(cap) { if (cap !== 0) { return 23169.0 / cap; } else { return 0.0; } } async function loadData() { const res = await fetch('/py/cap?cap=list15'); const data = await res.json(); const tbody = document.querySelector('#capTable tbody'); tbody.innerHTML = ''; const a = parseFloat(document.querySelector('#a').value); const b = parseFloat(document.querySelector('#b').value); // 最新を上に data.slice().reverse().forEach(item => { const tr = document.createElement('tr'); const conv = capToLevel(item.cap); tr.innerHTML = ` <td>${item.datetime}</td> <td>${item.cap}</td> <td>${conv.toFixed(2)}</td> <td>${item.temp}</td> <td>${item.hpa}</td> <td>${item.hum}</td> <td>${item.cap2}</td> `; tbody.appendChild(tr); }); } document.querySelector('#reload').addEventListener('click', loadData); loadData(); </script> </body> </html> """ @app.route('/py/dashboard2') def dashboard2(): return """ <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>Dashboard</title> <style> body { font-family: sans-serif; margin: 10px; } .framebox { display: flex; flex-direction: column; /* ← iframe を縦方向に並べたい場合 */ align-items: center; /* ← 横方向の中央に配置 */ } /* 画面幅に応じて伸縮し、横スクロールが出ないようにする */ .framebox iframe { width: 90%; aspect-ratio: 16 / 9; /* ← 高さ400pxの代わりにコレ！ */ border: 1px solid #ccc; } </style> </head> <body> <h2>Dashboard</h2> <div class="framebox" > <iframe src="/py/capgraph"></iframe> <iframe src="/py/captable"></iframe> </div> </body> </html> """ @app.route('/py/capgraph') def capgraph(): return """ <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>残量グラフ</title> <!-- Chart.js v3 を CDN で読み込む --> <script src="https://cdn.jsdelivr.net/npm/chart.js@3.9.1/dist/chart.min.js"></script> <style> body { font-family: sans-serif; margin: 1em; } canvas { max-width: 100%; } </style> </head> <body> <h3>残量 / 温度 / 気圧 / 湿度 グラフ</h3> <canvas id="capChart"></canvas> <script> function capToLevel(cap) { if (cap !== 0) { return 23169.0 / cap; } else { return 0.0; } } function capToLevel2(cap) { if (cap !== 0) { return 56450.0 / cap; } else { return 0.0; } } let capChart = null; // ← グラフを保持する変数を作る（重要） async function loadGraphData() { const res = await fetch('/py/cap?cap=list30'); // 最新15件取得 const data = await res.json(); // x軸ラベル const labels = data.map(d => d.datetime.slice(5, 16)); // "12-06 15:22" const capData = data.map(d => capToLevel(d.cap)); const tempData = data.map(d => d.temp * 2); const hpaData = data.map(d => d.hpa - 950); const humData = data.map(d => d.hum); const cap2Data = data.map(d => capToLevel2(d.cap2)); if (capChart) { capChart.destroy(); } new Chart(document.getElementById('capChart'), { type: 'line', data: { labels: labels, datasets: [ { label: '残量cm', data: capData, borderColor: 'red', borderWidth: 2, fill: false }, { label: '気温/2', data: tempData, borderColor: 'blue', borderWidth: 2, fill: false }, { label: '気圧-950', data: hpaData, borderColor: 'green', borderWidth: 2, fill: false }, { label: '湿度', data: humData, borderColor: 'orange', borderWidth: 2, fill: false }, { label: '5万/Cap2', data: cap2Data, borderColor: 'gray', borderWidth: 2, fill: false }, ] }, options: { responsive: true, plugins: { legend: { position: 'top' } }, scales: { x: { title: { display: true, text: '日時' }, ticks: { autoSkip: true, maxTicksLimit: 30, maxRotation: 45, minRotation: 45 } }, y: { beginAtZero: false, title: { display: true, text: '値' } } } } }); } loadGraphData(); </script> </body> </html> """

Qtで最下行へスクロールする方法について

 Qtでは、行数が多くなると最下行へのスクロールが難しい仕様？のようです。

　実際のWigetの行サイズとかもあり、すべてを反映して正確なスクロール量を割り出すのが難しいという問題もある？ちょうど、エクセルなどで印刷イメージと編集画面で微妙にずれたりするのと同じ困難さかもしれませんが。

　こういうときは、泥臭い方法で、実際に繰り返し試しながらスクロール量を割り出すしかないのかもしれません。その旨、ChatGPTに伝えたところ、以下のコードを作ってくれました。なんとか、うまくいきました。

void KakeiboTable::scrollDown(){
    QScrollBar* bar = view->verticalScrollBar();
    if (!bar) return;
    int lastMax = -1;
    QTimer* timer = new QTimer(this);
    connect(timer, &QTimer::timeout, this, [=]() mutable {
        int curMax = bar->maximum();
        bar->setValue(curMax);
        if (curMax == lastMax) {
            timer->stop();
            timer->deleteLater();
        }
        lastMax = curMax;
    });
    timer->start(0);
}

Unityで縦列駐車シミュレーションをつくってみた

 WebGLで縦列駐車のシミュレーションできるようにしてみた。実車の運転前に、シミュレーションでコツをつかんでおくと役立つかもしれません。

https://github.com/gh6141/Parking.git(source code)

https://gh6141.github.io/WebGL-Parking/(シミュレーション)

上下左右の矢印で操作し、Spaceでブレーキです

ホンダのサイトで縦列駐車の方法が出ていました

※Github PageでWebGLを使うには、zip圧縮はしないほうがいいようです。パフォーマンスレベルはできるだけLow側にするとうまく動作するようです。

釣り竿アンテナの接触不良対策

 釣り竿アンテナ(カーボン）に銅箔テープを貼ったものをアンテナとして使っていましたが、接続部がどうしても接触不良起こしやすく、SWRも安定しにくくなってきたので、試しに金属クリップを使ったら比較的調子がよくなり５９＋レポートもらえるようになりました。境目よりなるべくぎりぎり上のほうをはさむとうまくいくようです。

関数解析（宮寺功著）

 文庫本で関数解析が読めるということで購入してみました。早速、壁にぶつかりましたが。

P40　定理２．２で、(x,y)=||(x+y)/2||^2-||(x-y)/2||^2+i||(x+iy)/2||^2-i||(x-iy)/2||^2の定義で(x,y)=(y,x)の共役　が言えるのかどうか？　||x+y||^2+||x-y||^2=2||x||^2+2||y||^2を使うとうまくできるようです。

注意が必要なのは、(x,y)=||(x+y)/2||^2-||(x-y)/2||^2+i||(x+iy)/2||^2-i||(x-iy)/2||^2の共役をとるとき、|| ||のなかにあるiの符号は変えてはいけないということ？うっかりけてしまいそうですが、外側のiは符号変えてもいいですが、ここがたぶん注意点？

Unityを久しぶり少し使ってみました

基本的なことを忘れていて思い出すの時間はかかりましたが、以前作りかけていたものを少しだけ手を加えてみました。文字式の計算を動物キャラクタで、できないか、試しに作ってみたものです。導入等に使えないかと。 使う機会もないので、まだ中途半端の状態ですが。同類項＝同じ種類の動物を重ねて計算します。＋ーゼロだと爆発して消えるようにしています。

https://github.com/gh6141/WebGL_MathBoxSrc2.git(code)

https://gh6141.github.io/WebGL_mathBox/(WebGL)

こういうゲームでも誰か作ってくれれば、文字式や方程式の抽象概念も多少は理解促進の助けになるのでないかと思っていますが。

ESP32＋BME280 bottleコードの調整

 ESP32からのデータをbottleで表示するコードを少し調整。スマホでの表示が見ずらいので少し調整してみたのがこちら

latest_cap = None LOG_FILE = "cap_log.txt" MAX_LINES = 200 def read_log(): if not os.path.exists(LOG_FILE): return [] with open(LOG_FILE, "r") as f: return f.readlines() def write_log(lines): with open(LOG_FILE, "w") as f: f.writelines(lines) latest_cap = None LOG_FILE = "cap_log.txt" MAX_LINES = 200 def read_log(): if not os.path.exists(LOG_FILE): return [] with open(LOG_FILE, "r") as f: return f.readlines() def write_log(lines): with open(LOG_FILE, "w") as f: f.writelines(lines) @app.route('/py/cap') def cap_handler(): global latest_cap,latest_t,latest_p,latest_h latest_cap = None latest_t = None latest_p = None latest_h = None cap_value = request.query.cap # ?cap=123 または ?cap=list10 list10だと最新の１０個データ表示 t_value= request.query.t p_value= request.query.p h_value= request.query.h if cap_value: if cap_value.startswith("list"): # ?cap=listN の場合 try: n = int(cap_value[4:]) lines = read_log() #latest_lines = lines[-n:] if n > 0 else [] start = max(0, len(lines) - n) latest_lines = lines[start:] response.content_type = 'application/json' # JSON形式で返す result = [] for line in latest_lines: dt_str, value_str,value_t,value_p,value_h = line.strip().split(',', 4) result.append({ "datetime": dt_str, "cap": int(value_str), "temp": float(value_t), "hpa": float(value_p), "hum": float(value_h) }) return json.dumps(result) except ValueError: response.status = 400 return "Invalid list parameter" else: # 数値の場合 try: latest_cap = int(cap_value) latest_t=float(t_value) latest_p=float(p_value) latest_h=float(h_value) now_str = datetime.now().strftime("%Y-%m-%d %H:%M:%S") line = f"{now_str},{latest_cap},{latest_t},{latest_p},{latest_h}\n" # ログを読み込んで追記 lines = read_log() lines.append(line) # 最大行数を維持 if len(lines) > MAX_LINES: lines = lines[-MAX_LINES:] write_log(lines) return f"Cap value {latest_cap} saved.\n" except ValueError: response.status = 400 return "Invalid value" else: # パラメータなし → 最新値返す if latest_cap is not None: response.content_type = 'application/json' return json.dumps({"latest_cap": latest_cap}) else: response.status = 404 return "No data yet" @app.route('/py/captable') def captable(): return """ <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- 重要 --> <title>灯油タンク残量概算</title> <style> body { font-family: sans-serif; margin: 1em; } /* 入力エリア */ .controls { display: flex; flex-wrap: wrap; gap: 0.5em; align-items: center; } .controls label, .controls button { font-size: 1em; } /* テーブル */ table { border-collapse: collapse; width: 100%; margin-top: 1em; font-size: 0.95em; } th, td { border: 1px solid #999; padding: 0.5em; text-align: center; } /* スマホ向け：フォント少し小さく、テーブル横スクロール可 */ @media (max-width: 600px) { body { font-size: 0.9em; } .controls { flex-direction: column; align-items: flex-start; } table { display: block; overflow-x: auto; white-space: nowrap; } th, td { padding: 0.4em 0.6em; } } </style> </head> <body> <h3>残量データ一覧</h3> <div class="controls"> <label>a: <input type="number" id="a" value="-1.3013" step="0.01"></label> <label>b: <input type="number" id="b" value="592.123" step="0.01"></label> <button id="reload">再計算</button> </div> <table id="capTable"> <thead> <tr><th>日時</th><th>cap</th><th>残量%</th><th>気温</th><th>気圧</th><th>湿度</th></tr> </thead> <tbody></tbody> </table> <script> async function loadData() { const res = await fetch('/py/cap?cap=list15'); const data = await res.json(); const tbody = document.querySelector('#capTable tbody'); tbody.innerHTML = ''; const a = parseFloat(document.querySelector('#a').value); const b = parseFloat(document.querySelector('#b').value); // 最新を上に data.slice().reverse().forEach(item => { const tr = document.createElement('tr'); const conv = a * item.cap + b; tr.innerHTML = ` <td>${item.datetime}</td> <td>${item.cap}</td> <td>${conv.toFixed(2)}</td> <td>${item.temp}</td> <td>${item.hpa}</td> <td>${item.hum}</td> `; tbody.appendChild(tr); }); } document.querySelector('#reload').addEventListener('click', loadData); loadData(); </script> </body> </html> """ @app.route('/py/dashboard2') def dashboard2(): return """ <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>Dashboard</title> <style> body { font-family: sans-serif; margin: 10px; } .framebox { display: flex; flex-direction: column; /* ← iframe を縦方向に並べたい場合 */ align-items: center; /* ← 横方向の中央に配置 */ } /* 画面幅に応じて伸縮し、横スクロールが出ないようにする */ .framebox iframe { width: 90%; aspect-ratio: 16 / 9; /* ← 高さ400pxの代わりにコレ！ */ border: 1px solid #ccc; } </style> </head> <body> <h2>Dashboard</h2> <div class="framebox" > <iframe src="/py/capgraph"></iframe> <iframe src="/py/captable"></iframe> </div> </body> </html> """ @app.route('/py/capgraph') def capgraph(): return """ <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>残量グラフ</title> <!-- Chart.js v3 を CDN で読み込む --> <script src="https://cdn.jsdelivr.net/npm/chart.js@3.9.1/dist/chart.min.js"></script> <style> body { font-family: sans-serif; margin: 1em; } canvas { max-width: 100%; } </style> </head> <body> <h3>残量 / 温度 / 気圧 / 湿度 グラフ</h3> <canvas id="capChart"></canvas> <script> let capChart = null; // ← グラフを保持する変数を作る（重要） async function loadGraphData() { const res = await fetch('/py/cap?cap=list15'); // 最新15件取得 const data = await res.json(); // x軸ラベル const labels = data.map(d => d.datetime.slice(5, 16)); // "12-06 15:22" const capData = data.map(d => -1.3013 * d.cap + 592.123); const tempData = data.map(d => d.temp * 2); const hpaData = data.map(d => d.hpa - 950); const humData = data.map(d => d.hum); if (capChart) { capChart.destroy(); } new Chart(document.getElementById('capChart'), { type: 'line', data: { labels: labels, datasets: [ { label: '残量%', data: capData, borderColor: 'red', borderWidth: 2, fill: false }, { label: '気温/2', data: tempData, borderColor: 'blue', borderWidth: 2, fill: false }, { label: '気圧-950', data: hpaData, borderColor: 'green', borderWidth: 2, fill: false }, { label: '湿度', data: humData, borderColor: 'orange', borderWidth: 2, fill: false } ] }, options: { responsive: true, plugins: { legend: { position: 'top' } }, scales: { x: { title: { display: true, text: '日時' }, ticks: { autoSkip: true, maxTicksLimit: 5, maxRotation: 45, minRotation: 45 } }, y: { beginAtZero: false, title: { display: true, text: '値' } } } } }); } loadGraphData(); </script> </body> </html> """

ESP32にBME280追加

 キャパシティのカウントに、温度影響などあれば、補正の可能性もあるかと思い、温度等もロギングすることにしてみた。ついでも、気圧、湿度も計測できるセンサが安く入手できたのでつないでみた。ロギングはbottleサーバで行い、PCから確認できるようにした。esp32のコードもそれに合わせて書き換えた。

補足：容量カウントのピンはGPIO4からノイズが少なめのGPIO12に変更した。また、容量カウントは、WIFIやBME280の起動前に行い、ノイズの影響を除くようにコードを修正。シリアル通信も同様の理由で削除(2025.12.5)(ChatGPTのよると、GPIO12,GPIO33,GPIO32,GPIO13,GPIO15の順でノイズが少ないらしい）

SparkFunBME280というライブラリを追加する必要があります。 # esp32 Code #include <WiFi.h> #include <WiFiClient.h> #include "esp_sleep.h" #include <Wire.h> #include "SparkFunBME280.h" #define TOUCH_PIN 12 #define LED_PIN 2 #define SLEEP_SECONDS 21600 // 6時間 const char* ssid = "****" const char* password = "********" const char* host = "*.*.*.*"//Raspberry Pi IP const int port = 8888; const char* path = "/py/cap"; String url; String cprint; BME280 bme; void setup() { // Serial.begin(115200); delay(100); uint16_t capValue= readTouchStable(TOUCH_PIN); delay(100); Wire.begin(21, 22); // SDA=21, SCL=22(SCKは間違い) bme.setI2CAddress(0x76); if (bme.beginI2C() == false) { // Serial.println("BME280 not detected!"); } else { // Serial.println("BME280 connected."); } WiFi.begin(ssid, password); // Serial.print("Connecting to WiFi"); while (WiFi.status() != WL_CONNECTED) { delay(500); // Serial.print("."); } // Serial.println("\nWiFi connected"); // uint16_t capValue = touchRead(TOUCH_PIN); // Serial.printf("Touch value: %d\n", capValue); float tempC = bme.readTempC(); float humidity = bme.readFloatHumidity(); float pressure_hPa = bme.readFloatPressure() / 100.0; // Serial.printf("Temp: %.2f C, Humidity: %.2f %%, Pressure: %.2f hPa\n", tempC, humidity, pressure_hPa); url = String(path) + "?cap=" + String(capValue) + "&t=" + String(tempC, 1) + "&h=" + String(humidity, 1) + "&p=" + String(pressure_hPa, 1); cprint = String("GET ") + url + " HTTP/1.1\r\n" + "Host: " + host + "\r\n" + "Connection: close\r\n\r\n"; WiFiClient client; if (client.connect(host, port)) { Serial.println("Connected to server"); client.print(cprint); while (client.connected() || client.available()) { if (client.available()) { String line = client.readStringUntil('\n'); // Serial.println(line); } } client.stop(); } else { // Serial.println("Connection failed url=" + url); } // Serial.println("Going to sleep..."); delay(100); WiFi.disconnect(true); WiFi.mode(WIFI_OFF); digitalWrite(LED_PIN, LOW); // Serial.end(); esp_sleep_enable_timer_wakeup(SLEEP_SECONDS * 1000000ULL); esp_deep_sleep_start(); } void loop() { } int readTouchStable(int pin) { int sum = 0; for (int i = 0; i < 8; i++) { sum += touchRead(pin); delay(5); // ほんの少し間隔 } return sum / 8; } ************以下は、bottleのコード************* latest_cap = None LOG_FILE = "cap_log.txt" MAX_LINES = 200 def read_log(): if not os.path.exists(LOG_FILE): return [] with open(LOG_FILE, "r") as f: return f.readlines() def write_log(lines): with open(LOG_FILE, "w") as f: f.writelines(lines) latest_cap = None LOG_FILE = "cap_log.txt" MAX_LINES = 200 def read_log(): if not os.path.exists(LOG_FILE): return [] with open(LOG_FILE, "r") as f: return f.readlines() def write_log(lines): with open(LOG_FILE, "w") as f: f.writelines(lines) @app.route('/py/cap') def cap_handler(): global latest_cap,latest_t,latest_p,latest_h latest_cap = None latest_t = None latest_p = None latest_h = None cap_value = request.query.cap # ?cap=123 または ?cap=list10 list10だと最新の１０個データ表示 t_value= request.query.t p_value= request.query.p h_value= request.query.h if cap_value: if cap_value.startswith("list"): # ?cap=listN の場合 try: n = int(cap_value[4:]) lines = read_log() latest_lines = lines[-n:] if n > 0 else [] response.content_type = 'application/json' # JSON形式で返す result = [] for line in latest_lines: dt_str, value_str,value_t,value_p,value_h = line.strip().split(',', 4) result.append({ "datetime": dt_str, "cap": int(value_str), "temp": float(value_t), "hpa": float(value_p), "hum": float(value_h) }) return json.dumps(result) except ValueError: response.status = 400 return "Invalid list parameter" else: # 数値の場合 try: latest_cap = int(cap_value) latest_t=float(t_value) latest_p=float(p_value) latest_h=float(h_value) now_str = datetime.now().strftime("%Y-%m-%d %H:%M:%S") line = f"{now_str},{latest_cap},{latest_t},{latest_p},{latest_h}\n" # ログを読み込んで追記 lines = read_log() lines.append(line) # 最大行数を維持 if len(lines) > MAX_LINES: lines = lines[-MAX_LINES:] write_log(lines) return f"Cap value {latest_cap} saved.\n" except ValueError: response.status = 400 return "Invalid value" else: # パラメータなし → 最新値返す if latest_cap is not None: response.content_type = 'application/json' return json.dumps({"latest_cap": latest_cap}) else: response.status = 404 return "No data yet" @app.route('/py/captable') def captable(): return """ <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- 重要 --> <title>灯油タンク残量概算</title> <style> body { font-family: sans-serif; margin: 1em; } /* 入力エリア */ .controls { display: flex; flex-wrap: wrap; gap: 0.5em; align-items: center; } .controls label, .controls button { font-size: 1em; } /* テーブル */ table { border-collapse: collapse; width: 100%; margin-top: 1em; font-size: 0.95em; } th, td { border: 1px solid #999; padding: 0.5em; text-align: center; } /* スマホ向け：フォント少し小さく、テーブル横スクロール可 */ @media (max-width: 600px) { body { font-size: 0.9em; } .controls { flex-direction: column; align-items: flex-start; } table { display: block; overflow-x: auto; white-space: nowrap; } th, td { padding: 0.4em 0.6em; } } </style> </head> <body> <h3>残量データ一覧</h3> <div class="controls"> <label>a: <input type="number" id="a" value="-1.3013" step="0.01"></label> <label>b: <input type="number" id="b" value="592.123" step="0.01"></label> <button id="reload">再計算</button> </div> <table id="capTable"> <thead> <tr><th>日時</th><th>cap</th><th>残量%</th><th>気温</th><th>気圧</th><th>湿度</th></tr> </thead> <tbody></tbody> </table> <script> async function loadData() { const res = await fetch('/py/cap?cap=list5'); const data = await res.json(); const tbody = document.querySelector('#capTable tbody'); tbody.innerHTML = ''; const a = parseFloat(document.querySelector('#a').value); const b = parseFloat(document.querySelector('#b').value); // 最新を上に data.slice().reverse().forEach(item => { const tr = document.createElement('tr'); const conv = a * item.cap + b; tr.innerHTML = ` <td>${item.datetime}</td> <td>${item.cap}</td> <td>${conv.toFixed(2)}</td> <td>${item.temp}</td> <td>${item.hpa}</td> <td>${item.hum}</td> `; tbody.appendChild(tr); }); } document.querySelector('#reload').addEventListener('click', loadData); loadData(); </script> </body> </html> """ @app.route('/py/dashboard2') def dashboard2(): return """ <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>複数 iframe</title> <style> .framebox { display: flex; gap: 10px; } iframe { flex: 1; height: 500px; border: 1px solid #555; } </style> </head> <body> <h2>残量推移 ダッシュボード</h2> <div class="framebox"> <iframe src="/py/captable"></iframe> <iframe src="/py/capgraph"></iframe> </div> </body> </html> """ @app.route('/py/capgraph') def capgraph(): return """ <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>残量グラフ</title> <!-- Chart.js v3 を CDN で読み込む --> <script src="https://cdn.jsdelivr.net/npm/chart.js@3.9.1/dist/chart.min.js"></script> <style> body { font-family: sans-serif; margin: 1em; } canvas { max-width: 100%; } </style> </head> <body> <h3>残量 / 温度 / 気圧 / 湿度 グラフ</h3> <canvas id="capChart"></canvas> <script> async function loadGraphData() { const res = await fetch('/py/cap?cap=list10'); // 最新10件取得 const data = await res.json(); // x軸は文字列ラベルとしてそのまま使用 const labels = data.map(d => d.datetime); const capData = data.map(d => -1.3013 * d.cap + 592.123); const tempData = data.map(d => d.temp*2); const hpaData = data.map(d => d.hpa - 950); // 0-100に正規化 const humData = data.map(d => d.hum); new Chart(document.getElementById('capChart'), { type: 'line', data: { labels: labels, datasets: [ { label: '残量%', data: capData, borderColor: 'red', borderWidth: 2, fill: false }, { label: '気温/2', data: tempData, borderColor: 'blue', borderWidth: 2, fill: false }, { label: '気圧-950', data: hpaData, borderColor: 'green', borderWidth: 2, fill: false }, { label: '湿度', data: humData, borderColor: 'orange',borderWidth: 2, fill: false } ] }, options: { responsive: true, plugins: { legend: { position: 'top' } }, scales: { x: { title: { display: true, text: '日時' } }, y: { beginAtZero: false, title: { display: true, text: '値' } } } } }); } loadGraphData(); </script> </body> </html> """

BME280のI2C接続図

　アクリルだと、紫外線で脆くなるだろうと考え、塩ビパイプをヒートガンで平面にしたものを加工して作ってみた。

Web確認すると推移グラフもチェックできるようにした(2025.12.6)

(12/7)湿度が容量に影響しているような様子も見られ、もう少し分析が必要と思われる。

(12/8)湿度との相関もはっきりしないところもある。タンク内と外では湿度が同じでないことも影響しているかもしれないので、補正も難しさがありそう。