Skip to content

Standings Card

David edited this page Feb 26, 2023 · 5 revisions

Once you have a REST sensor set up to return league standings, you can use the flex-table-card to display them on your dashboard. Because each API returns a different set of stats for each league, you must inspect the JSON returned by the API to determine the indices of the stats you want to display in the table.

Sample Cards

image

image

Working Example - EPL Standings Card

type: custom:flex-table-card
title: EPL Standings
sort_by: place
entities:
  include: sensor.epl_standings
columns:
  - name: '#'
    id: place
    data: entries
    modify: x.stats[10].value
    align: center
  - name: Logo
    data: entries
    modify: '''<img src="'' + x.team.logos[0].href + ''"style="width: 100%">'''
    align: center
  - name: Team
    data: entries
    modify: x.team.name
  - name: G
    data: entries
    modify: x.stats[0].value
    align: center
  - name: W
    data: entries
    modify: x.stats[6].value
    align: center
  - name: L
    data: entries
    modify: x.stats[1].value
    align: center
  - name: T
    data: entries
    modify: x.stats[5].value
    align: Pts
  - name: Pts
    data: entries
    modify: x.stats[2].value
    align: center
css:
  tbody tr td:nth-child(2): 'width: 10%;'

Working Example - NHL Metro Div Standings Card

type: custom:flex-table-card
title: NHL Metro Div Standings
sort_by: place
entities:
  include: sensor.nhl_standings
columns:
  - name: Logo
    data: entries
    modify: '''<img src="'' + x.team.logos[0].href + ''"style="width: 100%">'''
    align: center
  - name: Team
    data: entries
    modify: x.team.name
  - name: GP
    data: entries
    modify: x.stats[3].value
    align: center
  - name: W
    data: entries
    modify: x.stats[10].value
    align: center
  - name: L
    data: entries
    modify: x.stats[4].value
    align: center
  - name: OTL
    data: entries
    modify: x.stats[0].value
    align: center
  - name: Pts
    data: entries
    modify: x.stats[6].value
    align: center
css:
  tbody tr td:nth-child(1): 'width: 10%;'