Get Even More Visitors To Your Blog, Upgrade To A Business Listing >>

Visualizing Real Time Stream Data using Node-RED

Overview

Real-time analytics and visualization of stream data have become more vital to transform live data into actionable and valuable insights and to help users focus on their real data needs. Many modern technologies have emerged to manage volume and velocity of big data.

Node-RED dashboard provides real-time stream data visualization and data streaming analytics. In this blog, let us discuss about visualizing and analyzing random car speed data generated by Node-RED function programming. It is used to monitor the speed of the leading car via Node-RED dashboard data analytics.

Let us learn about creating random data generation for multiple objects, using multiple charts, sharing the results via social medias such as Twitter, and providing notification for speed ranges based on random data generated.

Pre-requisites

Download the following from the provided links:

  • Node.js: https://nodejs.org/en/
  • NPM: https://www.npmjs.com/
  • Node-RED: https://nodered.org/

Getting Started with Node-RED

To start Node-RED, perform the following:

  • Open your command prompt.
  • Start the Node-RED by using below command:
node-red

Note: For more details about installing Node-RED, refer our previous blog – Node-RED on Windows.

  • Browse your Node-RED local host IP with port number to view Node-RED workspace panel as shown in the below diagram:

Creating Node-RED Flow

To create a Node-RED flow, perform the following steps:

  • From the left panel, drag the required nodes from node palate and drop it into the workspace.
  • Connect all the nodes one by one as shown in the below diagram:

In this use case, the following nodes are used:

    • Inject node (time stamp) – To set time intervals
    • Function node – To pass each message
    • Debug node (Message payload) – To display payload of the message or entire message
    • Chart node – To create different type of charts
    • Notification node – To notify leading speed of the car
    • Twitter node – To tweet speed of a particular car in Twitter

Note: Drag and drop multiple chart nodes as this use case involves multiple charts.

  • Open inject node (timestamp) to set time intervals as shown in the below diagram:
    For example: If the time interval is set as 5 seconds, new data required for visualization and other processes will be uploaded every 5 seconds.

  • Open the main function node to create simple random data generator code as shown in the below diagram:

  • Open the chart nodes and create different chart types for different nodes as shown in the below diagram:

  • Click the notification node and set the time interval to notify current leading cars and its speed ranges as shown below:

Deploying Flow and Debugging

On successfully creating the flow, deploy the flow by clicking on Deploy on the top right corner.

On successfully deploying the flow, debug the flow as shown in the below diagram:

Viewing Results in Twitter

On successfully completing deploy and debug, speed range of that particular car will be tweeted in Twitter as shown in the below diagram:

Similarly, the results can be shared via Email and social networks on using the respective nodes.

Performing Data Stream Analytics

The speed ranges of the cars can be monitored in Node-RED dashboard. Multiple charts and multiple values can be displayed in the dashboard as shown in the below diagram for performing data analytics:

Conclusion

In this blog, we have discussed about random data generator function programming, multiple chart creation, dashboard analytics, notification, and posting results on Twitter. In our next blog, let us discuss some complex use cases with real time data stream analytics. To create IoT applications on Bluemix with Node-RED, refer our blog on IBM Bluemix with Node-RED IoT.

References

  • Getting Started with Node-RED on Raspberry Pi:
    https://randomnerdtutorials.com/getting-started-with-node-red-on-raspberry-pi/
  • Getting started with Node-RED:
    https://opensource.com/life/16/5/getting-started-node-red


This post first appeared on Front-end Code Review & Validation Tools | Treselle Systems, please read the originial post: here

Share the post

Visualizing Real Time Stream Data using Node-RED

×

Subscribe to Front-end Code Review & Validation Tools | Treselle Systems

Get updates delivered right to your inbox!

Thank you for your subscription

×