SENSORS/ACTUATORS

INTERNET OF THING (IoT)

ESP32 - 시리얼 플로터 | ESP32 - Serial Plotter

이 튜토리얼은 ESP32에서 Arduino IDE를 사용하여 시리얼 플로터를 사용하는 방법을 안내합니다.

준비물

1	×	ESP-WROOM-32 Dev Module	쿠팡 \| Amazon
1	×	USB Cable Type-C	쿠팡 \| Amazon
1	×	(Optional) DC Power Jack	쿠팡 \| Amazon
1	×	Breadboard	쿠팡 \| Amazon
1	×	Jumper Wires	Amazon
1	×	(Recommended) ESP32 Screw Terminal Adapter	쿠팡 \| Amazon

공개: 이 섹션에서 제공된 링크 중 일부는 제휴 링크입니다. 이 링크를 통해 구매한 경우 추가 비용없이 수수료를 받을 수 있습니다. 지원해 주셔서 감사합니다.

시리얼 플로터에 대하여

시리얼 플로터는 아두이노 IDE에서 ESP32로부터 시리얼을 통해 데이터를 수신하고 그래프에 그려줄 수 있는 도구입니다. 시리얼 플로터는 여러 센서의 데이터를 같은 화면에 표시할 수 있습니다.

ESP32로부터 데이터를 받으려면, ESP32와 PC 사이에 마이크로 USB 케이블을 사용해야 합니다.

Serial Plotter는 두 가지 구성 요소로 구성되어 있습니다.

선택 상자: 시리얼 보드레이트를 선택하는 데 사용됩니다.
그래프: 시각화된 데이터를 보여주는 화면입니다.

X축: 시간을 나타냅니다. 500개의 점이 있습니다. 각 점 사이의 시간은 연속된 Serial.println() 함수 호출 사이의 시간입니다.
Y축: ESP32에서 받은 데이터 값을 나타냅니다. 데이터의 값이 증가하거나 감소할 때 Y축은 자동으로 스케일이 조정됩니다.

시리얼 플로터 여는 방법

아두이노 IDE에서 아래와 같이 시리얼 플로터를 클릭하세요:

그래프에 단일 선을 그리는 방법

그래프에 단일 선을 그리려면, 데이터를 “\r\n” 문자로 종료하여 보내기만 하면 됩니다. Serial.println() 함수를 사용할 수 있습니다.

Serial.println(variable);

※ NOTE THAT:

Serial.println()은 데이터에 자동으로 “\r\n” 문자를 추가합니다.

예제 코드

아래의 ESP32 예제 코드는 아날로그 입력 핀의 값을 읽고 시리얼 플로터로 보냅니다.

사용 방법

ESP32를 처음 사용하는 경우, Arduino IDE에서 ESP32 환경 설정 방법을 참조하세요.
위의 코드를 복사하여 Arduino IDE에 붙여넣으세요.
Arduino IDE에서 Upload 버튼을 클릭하여 ESP32 보드에 코드를 컴파일하고 업로드하세요.
시리얼 플로터를 엽니다.
보레이트 9600을 선택하세요.
시리얼 플로터에서 그래프를 확인하세요.

그래프에 여러 선 그리는 방법

여러 변수를 플롯하려면, 변수들을 “\t” 또는 " " 문자로 서로 분리해야 합니다. 마지막 값은 반드시 “\r\n” 문자로 종료되어야 합니다.

자세히:

첫 번째 변수

Serial.print(variable_first); // 첫 번째 변수 출력

중간 변수들

cpp Serial.print("\t"); // 또는 Serial.print(" ") Serial.print(variable_nth);

마지막 변수

Serial.print("\t"); // 또는 Serial.print(" ") Serial.println(variable_last);

예제 코드

아래의 ESP32 예제 코드는 4개의 아날로그 입력 핀에서 값들을 읽어내어 시리얼 플로터로 보냅니다.

/* * 이 ESP32 코드는 newbiely.kr 에서 개발되었습니다 * 이 ESP32 코드는 어떠한 제한 없이 공개 사용을 위해 제공됩니다. * 상세한 지침 및 연결도에 대해서는 다음을 방문하세요: * https://newbiely.kr/tutorials/esp32/esp32-serial-plotter */ void setup() { Serial.begin(9600); } void loop() { int variable_1 = analogRead(A0); int variable_2 = analogRead(A1); int variable_3 = analogRead(A2); int variable_4 = analogRead(A3); Serial.print(variable_1); Serial.print(" "); // 두 값 사이에 탭 '\t' 또는 공백 ' ' 문자가 출력됩니다. Serial.print(variable_2); Serial.print(" "); // 두 값 사이에 탭 '\t' 또는 공백 ' ' 문자가 출력됩니다. Serial.print(variable_3); Serial.print(" "); // 두 값 사이에 탭 '\t' 또는 공백 ' ' 문자가 출력됩니다. Serial.println(variable_4); // 마지막 값은 캐리지 리턴 및 개행 문자로 종료됩니다. delay(100); }

Serial Monitor의 결과:

3개의 사인 파형 예시

아래 ESP32 예제 코드는 세 가지 사인 파형의 값을 직렬 플로터에 출력합니다.

/* * 이 ESP32 코드는 newbiely.kr 에서 개발되었습니다 * 이 ESP32 코드는 어떠한 제한 없이 공개 사용을 위해 제공됩니다. * 상세한 지침 및 연결도에 대해서는 다음을 방문하세요: * https://newbiely.kr/tutorials/esp32/esp32-serial-plotter */ void setup() { Serial.begin(9600); } void loop() { for (int i = 0; i < 360; i += 5) { float sine_1 = 1 * sin(i * M_PI / 180); float sine_2 = 2 * sin((i + 90) * M_PI / 180); float sine_3 = 5 * sin((i + 180) * M_PI / 180); Serial.print(sine_1); Serial.print("\t"); Serial.print(sine_2); Serial.print("\t"); Serial.println(sine_3); delay(100); } }

Serial Plotter의 결과:

웹에서 이 플로터를 원한다면, ESP32 - 웹 플로터를 확인하세요.

동영상

비디오 제작은 시간이 많이 걸리는 작업입니다. 비디오 튜토리얼이 학습에 도움이 되었다면, YouTube 채널 을 구독하여 알려 주시기 바랍니다. 비디오에 대한 높은 수요가 있다면, 비디오를 만들기 위해 노력하겠습니다.

ESP32 - 시리얼 플로터 | ESP32 - Serial Plotter

준비물

시리얼 플로터에 대하여

시리얼 플로터 여는 방법

그래프에 단일 선을 그리는 방법

예제 코드

사용 방법

그래프에 여러 선 그리는 방법

예제 코드

3개의 사인 파형 예시

동영상

언어 참고자료

관련 튜토리얼