# How can i live stream on my dashboard?

**URL:** <https://discourse.nodered.org/t/how-can-i-live-stream-on-my-dashboard/27044>\
**Category:** General\
**Created:** [21 May 2020 16:49 UTC](https://discourse.nodered.org/t/how-can-i-live-stream-on-my-dashboard/27044 "2020-05-21T16:49:15Z")\
**Posts on this page:** 14\
**Page:** 1

<div class="post-metadata">

**Author:** ![carrero](https://avatars.discourse-cdn.com/v4/letter/c/e19adc/32.png) [@carrero](https://discourse.nodered.org/u/carrero)\
**Post date:** [21 May 2020 16:49 UTC](https://discourse.nodered.org/t/how-can-i-live-stream-on-my-dashboard/27044/1 "2020-05-21T16:49:16Z")

</div>

Hi guys, what kind of nodes or new modules should i use? . I want to stream from a pi camera connected in my rpi. Im working with node red in my personal computer w10, and i want to send the images to my node red using mqtt or other stuff. What should i do?

---

<div class="post-metadata">

**Author:** ![BartButenaers](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/bartbutenaers/32/10476_2.png) [@BartButenaers](https://discourse.nodered.org/u/BartButenaers)\
**Post date:** [21 May 2020 18:00 UTC](https://discourse.nodered.org/t/how-can-i-live-stream-on-my-dashboard/27044/2 "2020-05-21T18:00:01Z")

</div>

Hi Pablo,  
You might have a look at [this](https://discourse.nodered.org/t/faq-video-in-dashboard-decision-tree/23373). I 'think' you need option 4.  
Bart

---

<div class="post-metadata">

**Author:** ![carrero](https://avatars.discourse-cdn.com/v4/letter/c/e19adc/32.png) [@carrero](https://discourse.nodered.org/u/carrero)\
**Post date:** [22 May 2020 00:35 UTC](https://discourse.nodered.org/t/how-can-i-live-stream-on-my-dashboard/27044/3 "2020-05-22T00:35:25Z")

</div>

Hi Bard, i have just send images from my script in python using mqtt, i converted the captured image into an array and sent it to the topic. But now, how can i show the image on the dashboard?

---

<div class="post-metadata">

**Author:** ![thebaldgeek](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/thebaldgeek/32/93523_2.png) [@thebaldgeek](https://discourse.nodered.org/u/thebaldgeek)\
**Post date:** [22 May 2020 01:06 UTC](https://discourse.nodered.org/t/how-can-i-live-stream-on-my-dashboard/27044/4 "2020-05-22T01:06:53Z")

</div>

Here is the flow I use to display MQTT images on my Node-RED dashboard.  
This is what it looks like;

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/c/f/cf568d1a52b9af798d89b551ed1998c31efc6cf7.png)

Here is the flow;

```auto
[{"id":"ec36a139.98c918","type":"mqtt in","z":"a5dc5c12.f1a1a","name":"","topic":"RainRadar","qos":"2","datatype":"auto","broker":"","x":870,"y":520,"wires":[["936e58e7.0e1a7"]]},{"id":"936e58e7.0e1a7","type":"base64","z":"a5dc5c12.f1a1a","name":"","action":"","property":"payload","x":1040,"y":520,"wires":[["f221d617.4c46a"]]},{"id":"f221d617.4c46a","type":"template","z":"a5dc5c12.f1a1a","name":"Image in","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"<img src=\"data:image/png;base64,{{payload}}\"style=\"width=\"569\" height=\"197\"\"/>","output":"str","x":1200,"y":520,"wires":[["b2f83f0e.fcdb08"]]},{"id":"b2f83f0e.fcdb08","type":"ui_template","z":"a5dc5c12.f1a1a","group":"d9e398d4.2dc738","name":"Rain Radar Image","order":8,"width":"15","height":"15","format":"<div ng-bind-html=\"msg.payload\"></div>","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":false,"templateScope":"local","x":1410,"y":520,"wires":[[]]},{"id":"d9e398d4.2dc738","type":"ui_group","z":"","name":"groov RIO","tab":"539bd85f.f4a988","order":1,"disp":true,"width":"26","collapse":false},{"id":"539bd85f.f4a988","type":"ui_tab","z":"","name":"Home","icon":"dashboard","disabled":false,"hidden":false}]

```

Option 4 for the win.

---

<div class="post-metadata">

**Author:** ![carrero](https://avatars.discourse-cdn.com/v4/letter/c/e19adc/32.png) [@carrero](https://discourse.nodered.org/u/carrero)\
**Post date:** [22 May 2020 08:37 UTC](https://discourse.nodered.org/t/how-can-i-live-stream-on-my-dashboard/27044/5 "2020-05-22T08:37:49Z")

</div>

Ok, i have just copied it. How do you send the array using python to the mqtt?. What i do is capture an image and processed it to an array.

---

<div class="post-metadata">

**Author:** ![thebaldgeek](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/thebaldgeek/32/93523_2.png) [@thebaldgeek](https://discourse.nodered.org/u/thebaldgeek)\
**Post date:** [22 May 2020 14:04 UTC](https://discourse.nodered.org/t/how-can-i-live-stream-on-my-dashboard/27044/6 "2020-05-22T14:04:33Z")

</div>

This is a Node-RED forum, not a Python forum. Use Google to find out how to write the Python code to send data to MQTT.  
Once you have your data sent to your topic, use the code listed above to put the array back to a string or perhaps a buffer. Look at using the built in 'Join' node to do that. Feed the output of that into the flow.

---

<div class="post-metadata">

**Author:** ![carrero](https://avatars.discourse-cdn.com/v4/letter/c/e19adc/32.png) [@carrero](https://discourse.nodered.org/u/carrero)\
**Post date:** [22 May 2020 14:10 UTC](https://discourse.nodered.org/t/how-can-i-live-stream-on-my-dashboard/27044/7 "2020-05-22T14:10:14Z")

</div>

Hi sir, i wrote the code and it is working, but the refresh is low.

---

<div class="post-metadata">

**Author:** ![Steve-Mcl](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/steve-mcl/32/4826_2.png) [@Steve-Mcl](https://discourse.nodered.org/u/Steve-Mcl)\
**Post date:** [22 May 2020 14:28 UTC](https://discourse.nodered.org/t/how-can-i-live-stream-on-my-dashboard/27044/8 "2020-05-22T14:28:44Z")

</div>

what size is the image you are sending?

You are unlikely to get 25fps. the pi is not super fast, sending an image over MQTT will introduce delays then there is the a websocket -\> dashobard!

If you need high refresh, then use something like ffmpeg for vlc to generate a stream that is html5 compatible & have your dashboard template point at your stream. (or use something like jwplayer.js)

PS, it may also be your stream is slow - use VLC on the Pc to check the framerate of the stream.

---

<div class="post-metadata">

**Author:** ![carrero](https://avatars.discourse-cdn.com/v4/letter/c/e19adc/32.png) [@carrero](https://discourse.nodered.org/u/carrero)\
**Post date:** [22 May 2020 14:31 UTC](https://discourse.nodered.org/t/how-can-i-live-stream-on-my-dashboard/27044/9 "2020-05-22T14:31:49Z")

</div>

Uf i wish but i dont know what ffmpeg is and dont know how to stream in vlc + template to my stream to appear on my dashboard ;(

---

<div class="post-metadata">

**Author:** ![Steve-Mcl](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/steve-mcl/32/4826_2.png) [@Steve-Mcl](https://discourse.nodered.org/u/Steve-Mcl)\
**Post date:** [22 May 2020 14:35 UTC](https://discourse.nodered.org/t/how-can-i-live-stream-on-my-dashboard/27044/10 "2020-05-22T14:35:48Z")

</div>

[https://www.raspberrypi.org/forums/viewtopic.php?t=184515](https://www.raspberrypi.org/forums/viewtopic.php?t=184515)

[https://raspberry-projects.com/pi/pi-hardware/raspberry-pi-camera/streaming-video-using-vlc-player](https://raspberry-projects.com/pi/pi-hardware/raspberry-pi-camera/streaming-video-using-vlc-player)

tonnes and tonnes of threads on the internet on these topics.

If you can get streaming working, displaying a compatible stream in dashboard will be relatively simple. eg [https://ipcamtalk.com/threads/how-to-use-vlc-to-transcode-ip-video-to-an-html5-compatible-format.1371/](https://ipcamtalk.com/threads/how-to-use-vlc-to-transcode-ip-video-to-an-html5-compatible-format.1371/)

---

<div class="post-metadata">

**Author:** ![Colin](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/colin/32/17040_2.png) [@Colin](https://discourse.nodered.org/u/Colin)\
**Post date:** [22 May 2020 15:19 UTC](https://discourse.nodered.org/t/how-can-i-live-stream-on-my-dashboard/27044/11 "2020-05-22T15:19:17Z")

</div>

I would use `mjpg-streamer` on the Pi to stream it from the Pi. Then you can look at in a browser, or in an iframe in the dashboard for example.

---

<div class="post-metadata">

**Author:** ![carrero](https://avatars.discourse-cdn.com/v4/letter/c/e19adc/32.png) [@carrero](https://discourse.nodered.org/u/carrero)\
**Post date:** [22 May 2020 15:20 UTC](https://discourse.nodered.org/t/how-can-i-live-stream-on-my-dashboard/27044/12 "2020-05-22T15:20:58Z")

</div>

Where can i find how to install and use mjpg?

---

<div class="post-metadata">

**Author:** ![Colin](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/colin/32/17040_2.png) [@Colin](https://discourse.nodered.org/u/Colin)\
**Post date:** [22 May 2020 15:26 UTC](https://discourse.nodered.org/t/how-can-i-live-stream-on-my-dashboard/27044/13 "2020-05-22T15:26:42Z")

</div>

Assuming you mean mjpg-streamer then I suggest try your favourite search engine. It is either that or I spend time looking in my notes to find it, which actually I wouldn't do if I wanted it again myself. I would search for it. I imagine if you google for something like  
streaming with mjpg-streamer on a pi  
then it will find useful stuff.

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/d073cd938eafa2e558d7c2cd59003b3ef4963033.png) [@system](https://discourse.nodered.org/u/system)\
**Post date:** [21 July 2020 15:26 UTC](https://discourse.nodered.org/t/how-can-i-live-stream-on-my-dashboard/27044/14 "2020-07-21T15:26:50Z")

</div>

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.