Lesson 15 ESP32 Accelerometer and Gyroscope on The Web

In this lesson I will show you how to build a web server with the ESP32 to display sensor readings from the MPU-6050 accelerometer and gyroscope sensor. We’ll also create a 3D representation of the sensor orientation on the web browser. The readings are updated automatically using Server-Sent Events and the 3D representation is handled using a JavaScript library called three.js. The ESP32 board will be programmed using the Arduino core.

Important Libraries To Install

• Filesystem Uploader Plugin (refer to previous lesson)
• Arduino_JASON
• Adafruit Unified Sensor
• ESPAsyncWebServer
• AsyncTCP

The web server displays the gyroscope values of the X, Y an Z axis;
The gyroscope values are updated on the web server every 10 milliseconds;
It displays the accelerometer values (X, Y, Z). These values are updated every 200 milliseconds;
The MPU-6050 sensor module also measures temperature, so we’ll also display the temperature value. The temperature is updated every second (1000 milliseconds);
All the readings are updated using Server-Sent Events;
There is a 3D representation of the sensor. The orientation of the 3D object changes accordingly to the sensor orientation. The current position of the sensor is calculated using the gyroscope values;
The 3D object is created using a JavaScript library called three.js;
There are four buttons to adjust the position of the 3D object:

Project Source Codes : https://github.com/AnbuKumar-maker
Contact us for more projects: [email protected]
WhatsApp Support: +91-99725-77735
About us: https://www.codingscientist.com
Hackster Community: https://www.hackster.io/anbu-kumar
LinkedIn: https://www.linkedin.com/in/codingscientist/
Facebook: https://www.facebook.com/coding.scientist
Twitter: https://twitter.com/robo_thoughts
Download This Video

(Visited 7 times, 1 visits today)
Author: treehoster

Share This Post
Have your say!