Andy DixonandCopilot 942a390248 Overhaul battery panel: responsive layout, configurable options, enterprise-level UI
- Responsive layout adapts to any panel size (mobile to widescreen)
  - Auto-switches between column/row layout based on dimensions
  - Gracefully degrades in tiny panels (hides stats, keeps battery)
  - Font sizes scale dynamically to available space

- New configurable options via Grafana panel editor:
  - Colours category: low/mid/high battery colours
  - Thresholds category: configurable low/high % boundaries (was hardcoded 30/70)
  - Appearance category: gradient fill, orientation (vertical/horizontal),
    charging animation, border width
  - Display category: individual show/hide toggles for percentage, rate,
    low/high stats, charging status
  - Data category: decimal places, regression toggle

- Fixed bugs:
  - Gradient ID now unique per panel instance (fixes multi-panel dashboards)
  - Battery fill uses clipPath so it respects rounded corners
  - Proper 'No data' empty state

- Horizontal battery orientation for wide/short panels
- Pulse animation when charging (configurable)
- Status badge with themed colours (charging/discharging/stable)
- Moved options interface to shared types.ts
- Updated stale e2e tests to match current component

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
2026-04-24 13:06:47 +01:00
2025-10-11 18:48:08 +02:00
2025-10-11 17:26:33 +01:00
2025-10-11 18:36:06 +02:00

Grafana Battery Visualisation

I hate writing documentation, and since I will have ADHD brain, I will forget how to do this.

npm install
npm run build
cp -r dist /var/lib/grafana/plugins/andydixon-battery-panel

in /etc/grafana/grsfana.ini add andydixon-battery-panel to allow_loading_unsigned_plugins

S
Description
Grafana battery visualisation
Readme GPL-3.0
276 KiB
Languages
TypeScript 87%
JavaScript 9.5%
Dockerfile 2.8%
Shell 0.7%