ESP32 Smart Radar Using HC-SR04 and SG90 Servo

An ultrasonic sensor can measure how far an object is, but adding a servo motor makes it possible to scan different directions. This project takes that idea a step further by connecting the ESP32 to a live web dashboard.

The ESP32 Smart Radar uses an ESP32 DevKit, HC-SR04 ultrasonic sensor, SG90 servo motor and buzzer. The servo sweeps the ultrasonic sensor from 0° to 180°, while the ESP32 measures the distance at different angles.

The angle and distance readings are sent over a local Wi-Fi network to a browser-based radar dashboard. The dashboard converts these readings into a visual radar display, making it easier to see where an object is located.

The ESP32 and the computer or phone running the dashboard only need to be connected to the same local Wi-Fi network.

How the ESP32 Smart Radar Works

The HC-SR04 is mounted on the SG90 servo motor. As the servo moves, the sensor points in different directions.At each position, the ESP32 reads the distance measured by the ultrasonic sensor.

The system provides the latest reading in this simple format: angle,distance

For example: 90, 20.3

This means the sensor is currently positioned at 90° and has measured an object approximately 20.3 cm away.

Project Architecture

The ESP32 Smart Radar is divided into two main parts: the ESP32 firmware and the web-based radar dashboard.The ESP32 handles the physical part of the system. It controls the SG90 servo, reads the distance from the HC-SR04 ultrasonic sensor, controls the buzzer and makes the latest angle and distance readings available through a local web endpoint.

The radar dashboard runs separately in a web browser. It receives the readings from the ESP32 over the local Wi-Fi network and converts them into a graphical radar display.

The ESP32 does not host the radar dashboard itself. The dashboard files are opened on a computer using VS Code and Live Server, while the ESP32 provides the sensor data through its /data endpoint.

Project Files

The complete source code and dashboard files for the ESP32 Smart Radar are available on GitHub.

GitHub Repository: https://github.com/systechnia-tech/radar-dashboard-arduino

Download or clone the repository. The project contains the ESP32 firmware, web dashboard files and supporting documentation.

The main project structure is:

radar-dashboard-arduino/

│

├── radar_dashboard.ino

│

├── data/

│ ├── index.html

│ ├── style.css

│ └── script.js

│

└── docs/

├── wiring.png

└── flow.png

The radar_dashboard.ino file contains the ESP32 firmware, while the files inside the data folder make up the web dashboard.

Components Required

HC-SR04 ECHO Voltage Divider

The HC-SR04 ECHO output can reach 5V, while the ESP32 GPIO is not 5V tolerant. Therefore, the ECHO signal is reduced using two 10 kΩ resistors before connecting it to GPIO 26.

The connection is:

HC-SR04 ECHO

│

10kΩ

│

├────────── GPIO 26 (ESP32)

│

10kΩ

│

GND

This voltage-divider arrangement reduces the voltage reaching the ESP32 GPIO and provides the required level conversion for the ECHO signal.

Circuit Connections

The following connections are used to interface the ultrasonic sensor, servo motor, and buzzer with the ESP32.

HC-SR04 Ultrasonic Sensor

For the ECHO signal, use the two 10 kΩ resistors as shown above.

SG90 Servo Motor

Buzzer

Uploading the ESP32 Firmware

Open the Firmware

After downloading the project from GitHub, open the project folder and locate:

radar_dashboard.ino

Open this file in Arduino IDE.

The radar_dashboard.ino file contains the ESP32 firmware that handles the sensor, servo, buzzer, Wi-Fi connection and /data endpoint.

Install the ESP32 Board Package

Open Arduino IDE.

Go to:

File → Preferences

Under Additional Boards Manager URLs, add:

https://espressif.github.io/arduino-esp32/package_esp32_index.json

Click OK.

Then go to:

Tools → Board → Boards Manager

Search for: esp32

Install esp32 by Espressif Systems.

Install the ESP32Servo Library

The project uses ESP32Servo to control the SG90 servo motor.

Go to:

Sketch → Include Library → Manage Libraries

Search for: ESP32Servo

Install ESP32Servo.

Enter the Wi-Fi Details

Open radar_dashboard.ino and find:

const char* ssid = "YOUR_WIFI_NAME";

const char* password = "YOUR_WIFI_PASSWORD";

Select the Board and Port

Connect the ESP32 to the computer using a USB data cable.

In Arduino IDE, select:

Tools → Board → esp32 → ESP32 Dev Module

Then select the COM port under:

Tools → Port

If a specific ESP32 model is being used, select the corresponding board instead.

Upload the Firmware

Click the Upload button in Arduino IDE.

Find the ESP32 IP Address

After the upload is complete, open: Serial Monitor

After connecting to Wi-Fi, the Serial Monitor should display something similar to:

Wi-Fi connected

ESP32 IP Address: 192.168.1.42

Web server started

Note down this IP address.

Running the Radar Dashboard

Open the project in VS Code and edit data/script.js:

Find

const ESP32_IP = "192.168.1.42";

Replace the IP with your ESP32’s IP address from the Serial Monitor.

Then:

1. Open data/index.html.
2. Right-click → Open with Live Server.
3. Make sure the ESP32 and computer are on the same Wi-Fi.
4. To test the connection, open:

http://192.168.1.42/data

You should see data such as:

90,23.4

This represents the current angle and distance.