This article isn't really a proper article, sorry! It's just a home for a bit of YAML code that you can use to create a power graph card in Home Assistant that is a lookalike of the official power graphs in the GivEnergy app. Watch the video for more information if you're interested, otherwise, the config is below. Don't forget to replace the entity IDs containing xxxxxxxxxx with your actual entity IDs or it won't work...

type: custom:apexcharts-card
section_mode: true
experimental:
  color_threshold: true
header:
  show: true
  floating: false
  title: Power over last 24h
graph_span: 24h
show:
  last_updated: false
  loading: true
apex_config:
  chart:
    zoom:
      type: x
      enabled: true
      autoScaleYaxis: false
    toolbar:
      show: true
      autoSelected: zoom
    xaxis.type: datetime
series:
  - entity: sensor.givtcp_xxxxxxxxxx_grid_power
    type: area
    name: Grid Power
    yaxis_id: power
    color: e95a52
    opacity: 0.2
    group_by:
      func: last
      duration: 5m
    stroke_width: 1
    extend_to: now
    show:
      extremas: false
      header_color_threshold: true
  - entity: sensor.givtcp_xxxxxxxxxx_pv_power
    type: area
    name: PV Power
    yaxis_id: power
    group_by:
      func: last
      duration: 5m
    color: f4e391
    opacity: 0.2
    stroke_width: 1
    extend_to: now
  - entity: sensor.givtcp_xxxxxxxxxx_load_power
    type: area
    name: Load
    yaxis_id: power
    group_by:
      func: last
      duration: 5m
    color: 48a394
    opacity: 0.2
    stroke_width: 1
    extend_to: now
  - entity: sensor.givtcp_xxxxxxxxxx_invertor_power
    type: area
    name: Inverter Power(AC)
    yaxis_id: power
    group_by:
      func: last
      duration: 5m
    color: 99bbde
    opacity: 0.2
    stroke_width: 1
    extend_to: now
  - entity: sensor.givtcp_xxxxxxxxxx_soc
    type: line
    name: SoC
    yaxis_id: soc
    color: 90b6cb
    group_by:
      func: last
      duration: 5m
    stroke_width: 1
    extend_to: now
    show:
      extremas: false
      header_color_threshold: true
yaxis:
  - id: power
    align_to: 750
  - id: soc
    min: 0
    max: 100
    decimals: 0
    opposite: true