This project is a sample demonstrating the use of Azure Percept data acquisition and rendering to a web page.
The Web application is executing an Angular 14 SPA hosted by an Azure IoT Edge module executed directly on the Azure Percept device. The IoT Edge module streams the Percept predictions from the Edge Hub to the Angular application via WebSockets.
The Angular application displays the Eye video stream from WebStream module (from Motion Jpeg stream) to the Web page.
To use the module, you need to deploy the following Azure IoT Edge module:
"AzurePerceptDemo": {
"restartPolicy": "always",
"settings": {
"image": "ghcr.io/kbeaugrand-org/azureperceptdemo:latest",
"createOptions": "{\"ExposedPorts\":{\"8080/tcp\":{},\"8081/tcp\":{}},\"HostConfig\":{\"PortBindings\":{\"8080/tcp\":[{\"HostPort\":\"8080\"}],\"8081/tcp\":[{\"HostPort\":\"8081\"}]}}}"
},
"status": "running",
"type": "docker"
} "routes": {
"AzureEyeModuleToIoTHub": "FROM /messages/modules/azureeyemodule/outputs/* INTO $upstream",
"AzureEyeModuleToPerceptDemo": "FROM /messages/modules/azureeyemodule/outputs/* INTO BrokeredEndpoint(\"/modules/AzurePerceptDemo/inputs/inputMessage\")"
},Once connected, you can go to http://your.new.device:8080 to access to the Web page.
This project is licensed under the MIT License, see LICENSE.md for more details.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent