Веб-осциллограф на Arduino с продвинутым триггером — 6 каналов, настраиваемые параметры

Компоненты и расходные материалы

Arduino UNO	×1
PHPoC Shield для Arduino (WiFi/Ethernet + встроенный веб-сервер)	×1
Перемычки	×1 набор

О проекте

Если вы новичок, узнайте больше о Arduino + WiFi.

Демонстрация

(В оригинале встроено видео/демо)

Возможности

• Поддержка 6 каналов (A0–A5)
• Одиночный и множественный триггер
• Режимы триггера: falling, rising, both (спад, фронт, оба)
• Настраиваемый порог триггера
• Регулировка временной развертки (time/div) веб-ручкой
• Регулировка вольт/деление (V/div) для каждого канала веб-ручкой
• Регулировка смещения (offset) для каждого канала веб-ручкой
• Тап/клик — показать/скрыть панель настроек
• Кроссплатформенность: Windows, Linux, iOS, Android — любой браузер

Интерфейс пользователя

Как это работает

Веб-осциллограф — модификация «Web Serial Monitor» на PHPoC. Сначала объясню, как работает Web Serial Monitor.

PHPoC Shield имеет встроенное веб-приложение «Web Serial Monitor» — аналог Serial Monitor в Arduino IDE. Разница:

• Serial Monitor (IDE): читает данные с TX Arduino через USB.
• Web Serial Monitor (PHPoC): читает данные с TX Arduino через интернет.

Детально: PHPoC общается с Arduino по SPI. Пользователь открывает Web Serial Monitor в браузере. После загрузки страницы устанавливается WebSocket-соединение с PHPoC Shield. PHPoC захватывает данные с TX Arduino и передает их в браузер через WebSocket. Браузер отображает данные.

Это позволяет видеть данные не только на ПК, но и на мобильном или любом устройстве с браузером.

Как работает Web Oscilloscope:

То же самое, но вместо сырых данных — визуализация на графике. Добавлены функции настройки UI и триггера.

О данных, которые шлет Arduino:

Arduino считывает ADC (A0–A5) и таймстамп (микросекунды). ADC преобразует в вольты и шлет в Serial вместе с таймстампом в формате:

• Сначала таймстамп, затем пробел или \t.
• Затем значения напряжений каналов, разделенные пробелом или \t.
• В конце — символ новой строки.

Примечание: Максимум 6 каналов, но можно слать меньше (1, 2, 3…).

Исходный код

Две части:

• Arduino код (WebOscilloscope.ino)
• Веб-приложение (oscilloscope.php) — UI, загружается в PHPoC Shield по инструкции

Как пользоваться

Откройте в браузере (ПК или телефон): https://IP_адрес_шields/oscilloscope.php

Измерение сигнала: два провода — один на GND, второй на любой аналоговый вход (A0–A5). Подключите к точке измерения.

Для 6 каналов нужно 6 проводов GND. У Arduino всего 2 пина GND — расширил так:

Лучший стартовый набор Arduino для новичка

Ищете набор? Смотрите «The Best Arduino Kit for Beginners».

Справочник функций

• Serial.begin()
• Serial.println()
• delay()
• millis()
• for / while / if-else
• loop() / setup()
• String.toInt() / substring() / indexOf() / remove() / equals()

Код

WebOscilloscope.ino (Arduino)

#include <SPI.h>
#include <Phpoc.h>
#define AREF 5.0
#define ADC_MAX 1023.0
float ratio = AREF / ADC_MAX;

void setup() {
  Serial.begin(115200);
  Phpoc.begin();
}

void loop() {
  unsigned long time_a = micros();
  float v0 = analogRead(A0) * ratio;
  float v1 = analogRead(A1) * ratio;
  float v2 = analogRead(A2) * ratio;
  float v3 = analogRead(A3) * ratio;
  float v4 = analogRead(A4) * ratio;
  float v5 = analogRead(A5) * ratio;
  Serial.print(time_a); Serial.print(" ");
  Serial.print(v0); Serial.print(" ");
  Serial.print(v1); Serial.print(" ");
  Serial.print(v2); Serial.print(" ");
  // Serial.print(v3); Serial.print(" "); // канал 3 закомментирован
  Serial.print(v4); Serial.print(" ");
  Serial.println(v5); // последний канал с newline
}

oscilloscope.php (PHP/JS — веб-интерфейс)

Полный код веб-приложения (HTML + CSS + JavaScript) для PHPoC Shield. Реализует Canvas-график, виртуальную ручку (knob) для настроек, WebSocket-прием данных, логику триггеров (AUTO/NORMAL/SINGLE), отображение live/triggered режимов. Код объемный — см. полный листинг в исходнике проекта.

Схемы