Tips on setting up Emporia Vue and how to use iFrame Tiles to show Grafana Panels in your Hubitat Dashboard

🎬 Get Started Tips
#1

Audience: Habitat users trying to get the most out of their Emporia Vue purchase. Users that want to display a Panel from Grafana on their Hubitat Dashboard.

Caveats: I’m a hack… I’m happy to help but always in a learning mode.. so, I won’t be able to answer every question (aka not an expert on anything below) but I’m happy to contribute to Hubitat and its community.

Project:

  1. Install Emporia Vue Energy Monitor for my home (How the Gen 2 Vue Energy Monitor Works).
  2. Set up vuegraf
  3. Display vuegraf panels in Hubitat Dashboard
  4. Send Data to Hubitat (not ready for Prime time…. I have it working but I want to get this integrated into vuegraf - haven't asked yet as an option and clean up the code a little.) If you are interested in this please PM me.

What you need:

  1. Emporia Vue Energy Monitor
  2. Raspberry pi (or some other compute device capable of running Grafana, Influx, and Python 3 code
  3. vuegraf by JJason Ertel and contributors (GitHub - jertel/vuegraf: Populate metrics from your Emporia Vue energy monitoring devices into an InfluxDB)
  4. iFrame Device by @mbarone (GitHub - michaelbarone/hubitat)
  5. My hack (not ready for prime time.. PM me if you want code/drivers/tips… As a hack, I could use the help)

Credits:

NOTE: This is not a supported product from Emporia. They could/may stop access at any time.

Step 1: Installation of Energy Monitor

WARNING: If you don’t understand electricity and/or how it’s delivered to your home, I strongly suggest you hire an electrician to install the Energy Monitor. This is not trivial task and could lead to injury, death, a fire… please be safe.

Here are pictures of my install:

Main Breaker Panel with current sensors

image
image1541×2892 1.1 MB

Emporia device in separate box (no way this would fit in my panel - something to assess/plan before purchase)

image
image2802×2404 1.36 MB

Once installed (per the instructions) you should have something like the following in your iOS or Android Emporia App

image
image1284×2778 390 KB

Step 2: Install vuegraph on your compute device. I used a raspberrypi 3.

Instructions are found here —> GitHub - jertel/vuegraf: Populate metrics from your Emporia Vue energy monitoring devices into an InfluxDB

Notes: I did not use the container install… however, agree that’s preferred if you are comfortable with containers. The standard install worked fine although I did run into issues with python3 not playing nice with python2 libraries. Lots of info on how to fix library PATHs but it can be a hassle.

Log into Grafana and upload your Grafana Dashboard. If you’re using the single Vue device (aka one Vue Energy Monitor), make sure you start with the dashboard-single-panel.json

you should see something like this…

image
image1439×816 183 KB

Step 3: Display vuegraf panels in Hubitat Dashboard

First steps first we need to allow iframe and unauthenticated connections to Grafana.

Make the following changes in grafana.ini (/etc/grafana/grafana.ini)

#This allows iframe calls

[security] <— this section

allow_embedding = true

#This allows viewer access without authentication

[auth.anonymous] <— this section

enabled = true

org_name = Main Org.

org_role = Viewer

Install iFrame.groovy device driver in hubitat —> iFrame.groovy

Follow instructions provided in comments section of driver.

Once the device has been created set the URL as follows:

For a whole panel —> click the down arrow at the top of the panel and select share. Select Link tab and copy the URL. Past that URL info the device in hubitat created from the iFrame.groovy device driver.

For just the Graph on the Panel —> click the down arrow at the top of the panel and select share. Select Embed tab and copy the URL, starting at http://, ending at panelId=X (additionally remove the “from=xxxxxxx and to=xxxxxx” parameters from the URL. Past that URL info the device in hubitat created from the iFrame.groovy device driver.

Add the device to a Dashboard… it should look like this once it’s sized properly. You can add whatever you want with other tiles.

image
image765×559 120 KB

Step 4: Send Data to Hubitat

I will update as soon as I feel comfortable. PM me if you have a Vue and want to give it a try before I release the drivers and Python Code needed. Note: you’ll need everything above to make the push to hubitat work (at least the way I’ve hacked it together).

image
image1241×526 103 KB

That’s it… good luck and I will be adding the push to Hubitat as time permits.

Cheers,

Paul

5 Likes
Emporia Vue home energy monitor
Emporia vue
Show Off Your Dashboards!
Home Energy monitor Breaker box sensors
#2

Great write up! I'm interested in knowing how you're utilizing the child devices in Hubitat. Is it for dashboard purposes or do you base automations off of them? I actually went the other way and pipe the non-Emporia power meter readings (Zigbee outlets, etc) into InfluxDB so that they could be analyzed together.

I couldn't think of any automation opportunities, but that doesn't mean there aren't any! :slight_smile:

#3

I have so many devices (160+) it's just keeps things manageable plus allows for easy delete/update when there is a change. I haven't had any issues with automatons using the child devices. Glad you found it useful.

1 Like
#4

Thanks for sharing your Emporia Vue with flexible transformer setup. Do you have a link to the enclosure you used for housing the Vue?

#5

Here you go —> https://www.homedepot.com/p/Carlon-8-in-x-4-in-PVC-Junction-Box-E989N-CAR/100404099

Best of luck with your install.

#6

great write up! I have installed everything and my Grafana dashboard is up and running. I also made a virtual device for the iFrame. Do I need additional drivers or code to get the actual plots to show in the dashboard iFrame?

#7

Once you get the iframe virtual device created, open it up in habitat (Devices). Under preferences set to your iFrame Url value to something like this (without quotes.. the xxx.xxx.xxx.xxx is your grafana ip address) --> "http://xxx.xxx.xxx.xxx:3000/d-solo/EFFTQFZgk/energy-usage?orgId=1&refresh=5s&var-account=Home&panelId=2"

The URL above is from my Grafana instance. You will need to copy the link from your Grafana instance as described in the end of my original post.

To get it to show up on your dashboard add the iFrame device to a dashboard, then change the "Pick a Template" to Attribute, and then set the "Attribute" to iFrame.

I hope that makes sense.

#8

I just installed the Vue 2 in my house. May look at setting this up. In habitat.
I already have a influx db running in docker. Can I used that or do I need to spin up another one?

#9

Should work with Docker Version.

#10

This was helpful, but I have the following problem:

I can see the plot on my dashboard in Firefox, but when I try to view from Fully Kiosk Browser, it doesn't work:
image

Firefox:
image

I saw something about using a Grafana image renderer plugin, but it required more horsepower than my RPi 4 can manage.

Any suggestions to getting this data onto my dashboard? Maybe I'll need to store the data on the Hubitat rather than in InfluxDB on my RPi.

How to plot from data stored in InfluxDB on dashboard
#11

I was actually working on a new Phython Engine/App/Driver that avoids the use of influxDB and Grafana - It will just send power readings every few seconds to hubitat - then we can use hubigraph or other Apps to show/track... I guess I need to get back on that... :slight_smile:

#12

Where did you get your flexible red current transformers from - it appears Emporia are no longer selling them… was there a known problem or safety issue with them? Only listed from China/eBay now.

#13

Yeah I'm thinking I might need to pull the readings from my Raspberry Pi and store them on the Hubitat. Otherwise I might find another graphing server for the Pi.

#14

I bought them as part of the of my kit --> Emporia Vue Home Energy Monitor with individual appliance meters – Emporia Energy

It says "out of stock"... hmm I would contact support (if you haven't already) it is excellent. If you've already contacted them, is that where you heard about the safety issue?

#15

The new thing I'm building just uses the Raspberry Pi to pull the data from Emporia and pushes it to Hubitat..... Super basic, but should be super stable...:slight_smile: Given that, I will share when I'm done.

1 Like
#16

I hadn't heard anything re safety, support say it's a pure supply/logistics issue and not any product concern. They will come back into stock over time. China lockdown I guess.

#17

Did you make any progress on this? I am getting the system soon and can test the code.

#18

I've made progress. I'll try to focus on getting it done next week. Sorry for the delay.... life is just busy. Thanks for the interest.

#19

Hi @nielsen411 !!

This post was fantastic, after more than two months of trying, today I finally managed to display a graph of Granfana in the HE dashboard, THANK YOU!

However, I am still facing a problem, and I would like to get some help.

When I open the HE dashboard in a browser on a computer on the local network, the graphic is presented without any problem, but if I use the APP on the phone, the same dashboard presents an empty tile, with no graphic.

I imagine that extrapolating the situation, if I am outside the local network, the problem will repeat itself.

Any solution for this situation?

Thanks.

Download the Hubitat app