Openhab2+Grafana HABdroid Webview

Just installed latest influx/Grafana this weekend.
Slightly different syntax needed in sitemap:

d-solo instead of dashboard-solo. &fullscreen still needs to be removed from URL.

Frame { Webview height=10
    url="http://<IP>:3000/d-solo/54ytDxTmz/movements?panelId=2&orgId=1&theme=light"
}
1 Like

Question, how do you get the graph from outside the LAN?
Exposing port 3000 without any credentials to a dynDNS IP?

1 Like

Personally I’m not opening ports and prefers to use ngrok to establish an https tunnel

I made all these changes to grafana.ini but that still does not work for me from the remote url. I only get blank boxes within the ios app as well as from the browser.
Everything is fine when I am within my LAN: ios app, safari on ios, firefox from my pc.
Does anybody know what I have to change to gain remote access?
EDIT: From remote it is also NOT working via my vpn.
EDIT2: It is working via vpn within my ios browser but not via ios app

I found the solution for my issue here: Grafana charts via webview do not work
Works with a charm for my grafana charts runnung in a docker on my synology nas

After struggling to allow anonymous access to embed graphs in HabPanel (in a frame) and via WebView I just wanted to share my finding, which made it work for me:
I had to also change this setting in grafana.ini:
[security]
allow_embedding=true

5 Likes

Hi,

thats the solution for me too.

KR Rene

For everyone else who might have had issues with displaying the webview within the safari browser:
Configure Grafana to use https and embed the https frames in the webview

Couldn’t find a newer thread- I have the latest version of grafana, OH3, on RPI4, openhabian, installed with the config tool.
I am able to show a chart as a webview in a sitemap but it displays with the toolbar above.
When I change from ‘d’ to ‘d-solo’ it won’t show the chart syaing panel id not found.

Anyone experienced displaying grafana charts with the new versions? Is this still the correct syntax for the sharing link?

Thanks…

Edit:
Just found the solution here:

Need to add ‘&kiosk=1’ to the link.

Thanks.

What does “&kiosk=1” do? I am trying to display different duration of the grafana chart but I am getting this error: error parsing query: invalid duration.

But it works fine when I refresh the page. Can someone please help?

When I used the sharing link in a web frame I got the controls for the dashboard in addition to the chart itself. Adding the “kiosk” flag removes these controls and leaves the frame with only the chart. A more clean look for what I wanted.

What is the syntax you used for the duration? Share the entire link.

item:

String Grafana_Dropdown "Grafana Dropdown" 

sitemap:

Frame label="Grafana selection chart" {
        Switch item=Grafana_Dropdown label="Grafana Dropdown: " icon=chart mappings=[1="2 Hours", 2="4 Hours",3="6 Hours",4="8 Hours"]

        Webview icon=line url="http://192.168.1.3:3000/d-solo/IM_GjMmRk/test-temp-and-humidity?orgId=1&panelId=2&from=now-2h&to=now&refresh=2s" height=14 visibility=[Grafana_Dropdown=="1"]
        Webview icon=line url="http://192.168.1.3:3000/d-solo/IM_GjMmRk/test-temp-and-humidity?orgId=1&panelId=2&from=now-4h&to=now&refresh=2s" height=14 visibility=[Grafana_Dropdown=="2"]
        Webview icon=line url="http://192.168.1.3:3000/d-solo/IM_GjMmRk/test-temp-and-humidity?orgId=1&panelId=2&from=now-6h&to=now&refresh=2s" height=14 visibility=[Grafana_Dropdown=="3"]
        Webview icon=line url="http://192.168.1.3:3000/d-solo/IM_GjMmRk/test-temp-and-humidity?orgId=1&panelId=2&from=now-8h&to=now&refresh=2s" height=14 visibility=[Grafana_Dropdown=="4"]
    }

Well I tried the exact same syntax (other than the d-solo part) and it works for me.

About that d-solo, as I mentioned:

I’m not a grafana expert so I’m not really sure what’s the problem is.
As far as I can tell the syntax is fine and should work.

Pay attention though, that the error appeared in our screenshot is not about duration but about dimensions. Maybe you need to tweak some of the panel configurations?
Or, one last idea, try adding &fullscreen to the url.

Sorry I can’t help much further.

First error is:

error parsing query: invalid duration

As it refreshes (I have it set to refresh every 2s), thats when the error on my screenshot appears.
I have found a workaround using Image instead; even though it takes several seconds to load on click, it works perfectly and will work for now.