HAEO forecast card¶

The HAEO forecast card is a custom Lovelace card that renders HAEO forecast attributes as a fast interactive SVG chart. It is designed for fixed-horizon data and uses a MobX state model so hover and timeline updates stay responsive.

What the card shows¶

The card reads forecast attributes from HAEO output sensors. It automatically groups series into lanes (power, price, soc, shadow, other). Power and price series are drawn with step-post semantics. State-of-charge series are drawn as continuous lines.

Prerequisites¶

You must already have the HAEO integration installed and running. At least one HAEO output sensor must expose a forecast attribute.

Add the card resource¶

The integration serves the card bundle at:

/haeo-static/haeo-forecast-card.min.js

Add this as a Lovelace resource:

1. Open Settings -> Dashboards -> Resources.
2. Add a new resource URL: /haeo-static/haeo-forecast-card.min.js.
3. Set resource type to JavaScript module.

Basic card config¶

type: custom:haeo-forecast-card
title: HAEO forecast
hub_entry_id: <your_haeo_hub_config_entry_id>

Use the visual card editor to select a HAEO hub. Forecast entities for that hub are discovered automatically at runtime.

Configuration options¶

• type: Must be custom:haeo-forecast-card.
• title: Optional card title.
• hub_entry_id: Required HAEO hub config entry ID (chosen via the visual editor).
• entities: Optional list of forecast sensor entities. When omitted, the card discovers forecast sensors for the selected hub.
• height: Optional chart height in pixels.
• power_display_mode: opposed or overlay. Default is opposed.
• default_horizon: Initial horizon slider value. One of full, 15m, 30m, 1h, 2h, 4h, 8h, 12h, 1d, 2d, or 3d. Default is full. Shorter values are used automatically when the forecast horizon is shorter than the configured value.
• tooltip_visible: Whether the information panel below the chart is shown initially. Default is true.

Interaction features¶

• Hover crosshair with nearest-point value snapping.
• Tooltip with per-series values and per-lane totals.
• Legend hover highlighting.
• Automatic scaling based on card dimensions.
• Chart updates when forecast data changes from Home Assistant.

Network topology card¶

The integration also registers custom:haeo-topology-card as a separate frontend resource. It reads the topology attribute from a HAEO optimization status sensor and renders the LP network as an interactive SVG graph.

Basic topology card config¶

type: custom:haeo-topology-card
title: HAEO network topology
hub_entry_id: <your_haeo_hub_config_entry_id>

Use the visual card editor to select a HAEO hub. The card resolves the hub's optimization status sensor at runtime.

Topology card options¶

• type: Must be custom:haeo-topology-card.
• title: Optional card title.
• hub_entry_id: Required HAEO hub config entry ID (chosen via the visual editor).

Troubleshooting¶

If the card shows an empty state:

• Configure a HAEO hub: Open the card editor and select a hub.
• The selected HAEO hub no longer exists: Your hub was removed or recreated. Open the card editor and choose the current hub again.
• No forecast data yet / No optimization status sensor: HAEO is still starting up or has not finished its first optimization run.

For forecast data issues, also confirm:

• Each forecast entity has a populated forecast attribute.
• The Lovelace resource URL is exactly /haeo-static/haeo-forecast-card.min.js.

Next steps¶