Lovelace: Bar Card

Hello, how i remove/hide this frame?

image

Thanks

Not sure how to get ridof those, I think theyā€™re part of the overall lovelace framework. It seems to add them for every individual card that is added. You might be able to disable them in your theme.

Hi,

is there a way to change the line color? i want to change it to white.
because on the left line is invisible.

              - type: custom:vertical-stack-in-card
                title: HP Office Jet 3830
                cards:
                  - type: entities
                    show_header_toggle: false    
                    entities:
                      - entity: sensor.sensor_40
                        icon: mdi:printer
                      - entity: sensor.printer_uptimetest
                        icon: mdi:clock
                        name: UP Time
                      - entity: sensor.pagecount
                        icon: mdi:file-outline
                        name: Pages Printed                    
                  - type: custom:bar-card
                    columns: 3
                    direction: up
                    entities:
                      - color: black
                        entity: sensor.ink_black_level
                      - color: '#a4205c'
                        entity: sensor.ink_color_level
                      # - color: '#a4205c'
                        # entity: sensor.pagecount
                        # entity: sensor.canon_mg5300_black_ink_level
                      # - color: Black
                        # entity: sensor.canon_mg5300_photoblack_ink_level
                    height: 200px
                    max: 100
                    min: 0
                    padding: 2px
                    target: 20
                    title_position: bottom
                    icon_position: inside
                    unit_of_measurement: '%'
                    width: 100%

Thank you,

To be honest Iā€™ve never tested a dark bar before. The easiest solution for now I guess is to make the bar dark gray. Iā€™ll see if I can make the target bar visible for dark bars whenever I find some time to work on it.

1 Like

Hi. I cant get ā€œbar percentage fillingā€ - sensor may show 7 or 21% but color bar is always fully colored. No animation or any changeā€¦

2019-11-22%2002_21_40-Home%20Assistant

`############### Bar Custom ########################################
  - type: custom:auto-entities
    card:
      type: custom:bar-card
      unit_of_measurement: "%"
      title_position: inside
      padding: 2px
      columns: 2
      color: '#40bf40'
      animation: 'on'
    filter:
      include:
        - entity_id: "sensor.bigbosspc_amd_ryzen_5_1600_load_cpu_core*"
        
  - type: custom:bar-card
    title: RYZEN CPU TOTAL
    title_position: inside
    color: '#40bf40'
    animation: 'on'
    entity: sensor.bigbosspc_amd_ryzen_5_1600_load_cpu_total

I donā€™t think a number with a comma is considered a number but a string. Is it possible to output the values with a period instead and see if that works?

Yeahā€¦ You are rightā€¦ it is comma matterā€¦
tried battery period and it is fineā€¦
2019-11-22%2003_22_16-Home%20Assistant
Whats the best way for comma data?

For now the best solution is probably to create a template sensor that replaces the comma with a period. Or see if you are able to get the sensors to output with a period. Iā€™ll see if I can update the card to support commas when I get some time.

Similar to a post a few days ago about a printer I would like to know if it is possible toā€¦
Display four vertical bars of my ink colors (black, cyan, magenta, yellow) in that the background of the bar is the color of the specific ink.
So I would like one bar colored black, one cyan, one magenta, and the last one yellow.
I have looked at the css as well as creating four separate cards.
Any thing like this possible.
Thanks
carltonb

You can use something like:

       - type: custom:bar-card
         columns: 4
         direction: up
         entities:
          - color: black
            entity: sensor.hp_b110_ink_black
            title: black
          - color: '#......'
            entity: sensor.hp_b110_ink_cyan
            title: cyan
          - color: '#.....'
            entity: sensor.hp_b110_ink_magenta
            title: magenta
          - color: '......'
            entity: sensor.hp_b110_ink_yellow            
            title: yellow
         height: 150px
         max: 100
         min: 0
         padding: 2px
         target: 20
         title_position: bottom
         align: center-split
         icon_position: inside
         unit_of_measurement: '%'
         width: 100%
1 Like

Thank you so much. This worked perfectly.
I was almost there but you helped to refine my mess.
Thanks
carltonb

Great card! Maybe, Iā€™m overlooking something very simpleā€¦ Is there any possibility to make ā€œtextā€ as the value?

For example:

 severity:
  - color: '#EF7815"
    value: "Heavy rain"
  - color: '#d9240b'
    value: "Snow"

So it looks for the state at the sensor, but itā€™s not a numberā€¦
Would be great to get this working :slight_smile:

1 Like

Not at this time, but this sounds like a great feature.
Iā€™ll try to add this whenever I find some time next week.

1 Like

I am trying to use tap_action to reset maintenance hours of my xiaomi vacuum cleaner. So far unsuccessfully. What am I doing wrong?

            tap_action: service
            service_options:
              domain: vacuum
              service: send_Command
              data:
                entity_id: vacuum.xiaomi_vacuum_cleaner_my
                command: reset_consumable
                params: side_brush_work_time

The only thing I can see that could be causing your issue is a typo.

service: send_command

instead of:

service: send_Command

Iā€™ve just tested the tap action on my side and it works for turning on and off my vacuum.

This should now be possible in 1.7.0.

1 Like

Sounds great! But for some reason this doesnā€™t seem to work:

severity:
  - color: '#EF7815'
    value: 'Ijzel mogelijk'

Neither does:

severity:
  - color: '#EF7815'
    text: 'Ijzel mogelijk'

Or:

severity:
  - color: '#EF7815'
    state: 'Ijzel mogelijk'

Probably Iā€™m just overlooking something obvious?

Are you sure youā€™re running the latest version? The console should show you which version you have installed.
image

entities:
  - sensor.debug
severity:
  - color: var(--bar-red)
    value: Red
  - color: var(--bar-yellow)
    value: Yellow
  - color: var(--bar-green)
    value: Green
type: 'custom:bar-card'
1 Like

Which console?

F12 when using Chrome will show you DevTools, which includes the console.