(Another) ESP32CAM Multi-Client Streaming Display

Share Your Projects
1

This is just a simple, no frills, multi-camera/client dashboard display of my three ESP32CAM boards (AI_Thinker).

Each is currently in a test position and has a different cam/lens component, from left to right, Normal, Wide Angle IR Sensitive, and Fisheye.

image
image1918Ă—676 71 KB

The key factor to making these meaningful for my needs was this multi-client streaming firmware. I am using the rtos variant.

The install procedure can be a bit confusing... at least to me it was... but I also had posted an "issue" topic about that, and that topic has some clarifying details you might want to read.

And although it is very simple, here is the flow.

[{"id":"1f25a30f35ee2aab","type":"comment","z":"a64adde9.d2f4e","name":"ESP32 CAM Surveillance System","info":"","x":330,"y":220,"wires":[]},{"id":"0b80df98cb437bf8","type":"ui_template","z":"a64adde9.d2f4e","group":"8c0164eb.bb0d58","name":"","order":1,"width":10,"height":7,"format":"<!DOCTYPE html>\n<html>\n<style>\n    img {\n        border: 10px solid #000;\n        border-radius: 8px;\n        padding: 2px;\n        width: 400px;\n    }\n</style>\n\n<center>\n    <table>\n        <tr>\n            <!-- Row 1 -->\n            <td style=\"text-align: center\"><img src=\"data:image/jpg;base64,{{msg.payload}}\" /></td>\n        </tr>\n    </table>\n</center>\n</html>\n","storeOutMessages":false,"fwdInMessages":false,"resendOnRefresh":false,"templateScope":"local","x":820,"y":300,"wires":[[]]},{"id":"9aa0349346ecc9c3","type":"ui_template","z":"a64adde9.d2f4e","group":"5ff8146b.937ccc","name":"","order":1,"width":10,"height":7,"format":"<!DOCTYPE html>\n<html>\n<style>\n    .img {\n        border: 10px solid #000;\n        border-radius: 8px;\n        padding: 2px;\n        width: 400px;\n    }\n</style>\n\n<center>\n    <table>\n        <tr>\n            <!-- Row 1 -->\n            <td style=\"text-align: center\"><img src=\"data:image/jpg;base64,{{msg.payload}}\" class=img /></td>\n        </tr>\n    </table>\n</center>\n</html>\n","storeOutMessages":false,"fwdInMessages":false,"resendOnRefresh":false,"templateScope":"local","x":820,"y":260,"wires":[[]]},{"id":"8c6c05ee.777618","type":"base64","z":"a64adde9.d2f4e","name":"Encode","x":660,"y":300,"wires":[["0b80df98cb437bf8"]]},{"id":"c6f7e63c.ae32e8","type":"multipart-decoder","z":"a64adde9.d2f4e","name":"","ret":"bin","url":"http://10.10.3.185/mjpeg/1","tls":"","delay":0,"maximum":"10000000","blockSize":"1","x":470,"y":300,"wires":[["8c6c05ee.777618"]]},{"id":"ca446394.5fb1f","type":"multipart-decoder","z":"a64adde9.d2f4e","name":"","ret":"bin","url":"http://10.10.3.123/mjpeg/1","tls":"","delay":0,"maximum":"10000000","blockSize":"1","x":470,"y":260,"wires":[["afb3033f.6195"]]},{"id":"afb3033f.6195","type":"base64","z":"a64adde9.d2f4e","name":"Encode","x":660,"y":260,"wires":[["9aa0349346ecc9c3"]]},{"id":"327e228.322b0de","type":"ui_template","z":"a64adde9.d2f4e","group":"fc50ae98.16d65","name":"","order":1,"width":10,"height":7,"format":"<!DOCTYPE html>\n<html>\n<style>\n    img {\n        border: 10px solid #000;\n        border-radius: 8px;\n        padding: 2px;\n        width: 400px;\n    }\n</style>\n\n<center>\n    <table>\n        <tr>\n            <!-- Row 1 -->\n            <td style=\"text-align: center\"><img src=\"data:image/jpg;base64,{{msg.payload}}\" /></td>\n        </tr>\n    </table>\n</center>\n</html>\n","storeOutMessages":false,"fwdInMessages":false,"resendOnRefresh":false,"templateScope":"local","x":820,"y":340,"wires":[[]]},{"id":"63f146b1.5c72c8","type":"base64","z":"a64adde9.d2f4e","name":"Encode","x":660,"y":340,"wires":[["327e228.322b0de"]]},{"id":"48765e51.f91f","type":"multipart-decoder","z":"a64adde9.d2f4e","name":"","ret":"bin","url":"http://10.10.3.191/mjpeg/1","tls":"","delay":0,"maximum":"10000000","blockSize":"1","x":470,"y":340,"wires":[["63f146b1.5c72c8"]]},{"id":"6184c3f7a1b135ac","type":"ui_ui_control","z":"a64adde9.d2f4e","name":"","events":"all","x":260,"y":300,"wires":[["ca446394.5fb1f","c6f7e63c.ae32e8","48765e51.f91f"]]},{"id":"8c0164eb.bb0d58","type":"ui_group","name":"ESP Cam 2","tab":"73890071.f55b","order":2,"disp":true,"width":10,"collapse":false},{"id":"5ff8146b.937ccc","type":"ui_group","name":"ESP Cam 1","tab":"73890071.f55b","order":1,"disp":true,"width":10,"collapse":false},{"id":"fc50ae98.16d65","type":"ui_group","name":"ESP Cam 3","tab":"73890071.f55b","order":3,"disp":true,"width":10,"collapse":false},{"id":"73890071.f55b","type":"ui_tab","name":"ESP32CAM Surveillance System","icon":"camera","order":2,"disabled":false,"hidden":false}]

image
image745Ă—221 15.3 KB

Enjoy :slight_smile:

4 Likes
2

I didn't see anything that looks like a fish-eye camera image, as there are only 3 images not four in your message.

I found some fish-eye "de-warping" code at https://github.com/daisukelab/fisheye_window

And modified it to make one overhead 5 Mpixel fish-eye in my garage act as four "virtual cameras" for my AI system

A sample video is here: https://youtu.be/UJJPmdTFQfo

I use his modified Python code in the AI and his modified C++ code to do the interactive viewing to set the virtual PTZ view parameters. The nested loops to calculate the view mappings take multiple seconds in Python and milliseconds in C++, Python, especially Python3 really falls apart with nested loops.

You can pull my modified Python and C++ code from my GitHub ( https://github.com/wb666greene/AI-Person-Detector ) if you are interested. Post an issue if you need help and I'll get back to you as quickly as I can. I think this is good stuff as one overhead mounted fish-eye camera can do the job of four or more regular cameras, especially when monitoring interior spaces.

3

The window mesh it was set behind (for testing) did make it harder to tell, but the fisheye was the third (right) one. In its final (unobstructed) position, the view is perfect for catching the entire side of my place.

Note the coma placment :stuck_out_tongue: The middle cam is both a Wide Angle (wider than normal and great for my entrance window) and IR sensitive.

My little RPi 3+ is already begging for mercy under the current workload I force upon it :hammer_and_wrench: :fire: ... not sure it could handle any AI work. But I will look at what you have done, perhaps for future camera projects. Thanks.

4

Is that one of those 180 degree fish-eye cameras? They are pretty mild.

180 degree fish-eye:

fisheye_4mp_180deg
fisheye_4mp_180deg1600Ă—900 275 KB

360 degree fish-eye:

fish_eye_360_barn
fish_eye_360_barn1500Ă—1013 254 KB

5

Yes, but it is only about 1 cubed centimeter in size, and that is both the camera and lens combo, so not to bad :wink: No comparison with any proper sized/quality camera/lens.

image

6

I added in some of my proper "home security" IP camera feeds and a weather panel, to run on a larger tablet in my front room. And a smaller setup specificly fitted for my ancient Samsung Tab 8 on my workbench. For that one, I just used link nodes to send the procesed image to the tablet's dashboard templates so my RPi didn't need to process each camera feed twice.

2021-07-23 19.01.15
2021-07-23 19.01.151920Ă—1080 188 KB

3 Likes
7

I have tied the above flow and also tried the sample Github code for the ESP32

Can anyone tell me why I am getting the following error

Error: connect ETIMEDOUT 192.168.X.XXX:80 : http://192.168.X.XXX/mjpeg/1. I am also getting Error: socket hang up, can anyone help?...:wink: