GrDF Gazpar meter lovelace card for Home Assistant.
This card has been inspired from the great Linky Card.
I reuse the same layout.
It requires the HA integration Gazpar at least from version 1.3.0.
Trend ratio (% in the table) must be interpreted differently depending on the frequency:
-
Daily trend ratio is between two days with a week apart (for example, we compare two consecutive Sunday).
-
Monthly trend ratio is between two months with a year apart (for example, we compare Feb21 with Feb22).
Follow the steps described below to add GrDF Gazpar integration with HACS:
-
From HACS (Home Assistant Community Store), open the upper left menu and select
Custom repositoriesoption to add the new repo. -
Add the address https://github.com/ssenart/lovelace-gazpar-card with the category
Lovelace Plugins, and clickADD. The new corresponding repo appears in the repo list. -
Select this repo (this integration description is displayed in a window) and click on
INSTALL THIS REPOSITORYbutton on the lower right of this window. -
Keep the last version and click the button
INSTALLon the lower right. -
Do click on
RELOADbutton for completion! The integration is now ready. It remains the configuration.
-
Copy the content of the dist directory in HA config/www/gazpar-card directory.
-
Add the file path /local/gazpar-card/gazpar-card.js as a new Dashboard ressource (Module JavaScript).
In the configuration panel, play with the toggles and see how it affects the card layout.
Alternatively, you can configure your card manually with the following code:
type: custom:gazpar-card
entity: sensor.gazpar
title: Données GrDF
pricePerKWh: '0.06072'
showIcon: true
showTitle: true
showMainBar: true
showCost: true
showDailyHistory: true
showMonthlyHistory: true
showHistoryHeader: true
showEnergyHistory: true
showVolumeHistory: true
showTrendRatioHistory: true
showCostHistory: true
showDailyCostHistoryChart: false
showDailyEnergyHistoryChart: false
showWeeklyEnergyHistoryChart: false
showWeeklyCostHistoryChart: false
showMonthlyEnergyHistoryChart: false
showMonthlyCostHistoryChart: false
showYearlyEnergyHistoryChart: false
showYearlyCostHistoryChart: false
showError: true
showVersion: true
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent