Skip to content
This repository has been archived by the owner on Nov 16, 2020. It is now read-only.

Sample example to use Dash python framework for IoT Dashboard Design

Notifications You must be signed in to change notification settings

phyunsj/iot-dashboard-design-with-dash

Repository files navigation

IoT Dashboard Design with Dash

📌 The intention of this excericse is to undersatand communications between the front-end generated by Dash framewotk and the back-end. The heavy lifting is done by Dash framework. Any web application serving GET/POST methods can utilize Dash front-end implementaion.

"Dash is a Python framework for building analytical web applications. No JavaScript required. Build on top of Plotly.js, React, and Flask, Dash ties modern UI elements like dropdowns, sliders, and graphs directly to your analytical python code." ...from Dash by plotly

Additional Info on Dash

Example 1. Chart Display

Started with the first example from Dash User Guide, set interval=3000 (3 secs) and defined callbacks.

index.html, _dash-layout, _dash-dependencies are generated by Dash framework. Use it directly on Node-RED template node. For live-update, the back-end responds _dash-update-component request every 3 secs (interval=3000).

Example 2. Wind Speed Monitoring

The original work is done in here(Dash Wind Streaming App). The sample data wind-data.db is also provided.

UPDATE Dash Wind Streaming App : new location & new look.

Install node-red-node-sqlite to access wind-data.db. Manually create DATA for { response: {props: {figure: { data : [DATA], layout : ...}. Node-RED (or any web application) serves two types of POST requests (wind-speed and wind-direction) for this example. The original work has one additional POST request (wind-histogram).

plotly.js-dist can be used instead in function node. See how to use require in Node-RED function node.

Other Consideration

shinydashboard makes it easy to use Shiny to create dashboards

Releases

No releases published

Packages

No packages published

Languages