This How-to is a continuation of IIoT: Use ctrlX CORE as a monitoring platform using InfluxDB and Grafana and is intended to show how the Grafana dashboard can be integrated into the visualisation of SmartHMI (WebIQ).
Prerequisites
Node-Red (V02.06)
Grafana (IoT Dashboard) (V02.06)
InfluxDB (V02.06)
WebIQ (V2.15.7)
The other how-to must be carried out beforehand.
Step-by-Step Guide
Step 1: Prepare Grafana
In order for a Grafana dashboard to be integrated, a few settings must be made first. Therefore go on the ctrlX Landing Page to the path Manage app data > IoT Dashboard > Grafana.ini
In Grafana V02.06 go to Row 342 or search for "allow_embedding" uncomment it and set it to true. Grafana.ini Part 1 Additional go to Row 559 or search for "enabled anonymous access" uncomment it and set it to true. Grafana.ini Part 2 Then Restart the Grafana App. Hint: Set the Update interval in your Grafana Dashboard before you embed it.
Step 2: Grafana
Click on your Dashboard, which you want to share. Click on the dots in the top right corner and select > Share > Embed
Grafana Dashboard
Share Grafana Dashboard Switch off the Slider as shown in the picture to get relative time range. And here just copy the source link (not the complete link which is displayed in the image), e.g.:https://192.168.1.1/grafana........&refresh=auto&panelId=1
Step 3: WebIQ
Go to WebIQ and start a new project there. Insert the iFrame object.
WebIQ (SmartHMI)
Then insert the copied Source URL
iFrame settings
And then trust the certificate.
Trust Certificates in WebIQ
After that you can publish the dashboard.
And the final result is that you can reach the IoT Dashboard over the WebIQ Visualization.
Embed IoT Dashboard in the WebIQ HMI
Video of complete setup
This video shows the complete setup of the InfluxDB, IoT Dashboard and also the embedding of the Dashboard into the WebIQ HMI.
... View more
