Canvas Guage Card Value from Binary Sensor

Configuration Frontend
1

Dear Experts,

I would like to customize the canvas gauge card, if my light entity is on i need to display in the gauge to 1 else 0. below is the posted code for your further analysis and suggestion

type: custom:canvas-gauge-card
square: false
entity: light.esp_relay_2
gauge:
  type: linear-gauge
  title: Water Tank Level
  borderShadowWidth: 0
  borderOuterWidth: 0
  borderMiddleWidth: 0
  borderInnerWidth: 0
  minValue: 1
  maxValue: 1
  startAngle: 120
  ticksAngle: 300
  valueBox: false
  majorTicks:
    - '0'
    - '1'
  minorTicks: 5
  strokeTicks: true
  tickTextSize: 5px
  highlights:
    - from: 0
      to: 0.5
      color: rgba(200, 50, 50, 0.5)
    - from: 0.5
      to: 1
      color: rgba(0, 128, 0, 0.5)
  borders: false
  animationDuration: 1500
  animationRule: linear
  backgroundColor: transparent
  colorPlate: transparent
  colorNeedle: red
  colorMajorTicks: black
  colorStrokeTicks: black
  value: '{{ 0 if is_state(''light.esp_relay_2'', ''off'') else 1 }}'
  colorTitle: black
  colorBarProgress: rgba(200, 50, 50, 0.5)
2

Probably not wise to invest time in this custom component. It will fail sooner or later.

image

If you talk about something else than GitHub - custom-cards/canvas-gauge-card: The card makes it possible to use gauges from https://canvas-gauges.com/, tell us.

Oh, and don’t expect much help if you don’t make your code readable bt formatting it.

Code_format

3

@koying thanks for your reply, I updated the post. Time, being I need to use canvas gauge card.