Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Barchart bars are not the same width.

See original GitHub issue

Installed: BAR-CARD Version 3.1.6

Bildschirmfoto 2020-05-03 um 15 08 22

type: "custom:vertical-stack-in-card"
title: Verbrauch Erdgeschoss
cards:

  - type: "custom:bar-card"
    columns: 7
    stack: horizontal
    direction: up
    entities:
      - entity: sensor.verbrauch_buro
        name: 'Büroraum'
      - entity: sensor.verbrauch_waschraum
        name: 'Wirtschaftraum'
      - entity: sensor.verbrauch_heizung
        name: 'Heizungsraum'
      - entity: sensor.verbrauch_vorratsraum
        name: 'Vorratsraum'
      - entity: sensor.verbrauch_gang_eg
        name: 'Vorraum'
      - entity: sensor.verbrauch_garage
        name: 'Garage'
      - entity: sensor.verbrauch_zahlerschrank
        name: 'Zählerschrank'
    positions:
      icon: 'off'
      indicator: inside
      name: outside
    height: 240px
    max: 3500
    min: 0
    padding: 2px
    title_position: inside
    unit_of_measurement: Wh
    width: 100%
    line_width: 0.5
    title_style:
      font-size: 14px
      font-weight: 400
    value_style:
      font-size: 14px
      font-weight: 500
    severity:
      - color: "#CFD8DC"
        value: 0
      - color: "#4CAF50"
        value: 50
      - color: "#FDD835"
        value: 100
      - color: "#64DD17"
        value: 200
      - color: "#FFF176"
        value: 300
      - color: "#FFEB3B"
        value: 400
      - color: "#FF5722"
        value: 600
      - color: "#f44336"
        value: 800
      - color: "#f44336"
        value: 5000
    style: |
      ha-card {
        border-radius: 4px;
        transform: scale(0.95);
        background-size: 100% 100%;
        background-color: transparent;
      }
     ....

name: inside --> same barwidth but name text to long ? Bildschirmfoto 2020-05-03 um 15 28 21

QAD-Setting with CSS:

    style: |-
      ha-card {
        border-radius: 4px;
        transform: scale(0.95);
        background-size: 100% 100%;
        background-color: transparent;
      }
      bar-card-name {
       text-overflow: ellipsis;
       white-space: nowrap;
       overflow: hidden;
       width:100%;
       cursor: pointer ! important;
      }
      bar-card-card	{
        min-width:10%;  
      }

Do I have to change anything in the settings?

Issue Analytics

State:
Created 3 years ago
Comments:5 (2 by maintainers)

Top GitHub Comments

1reaction

tomlutcommented, May 9, 2020

I think this is a similar issue. I was about to ask if the name field could be shortened to the chart width with ellipses (like the button card below) to prevent it pushing the bar charts off the card:

Rather than the bar chart assuming the width of the name.

0reactions

tomlutcommented, May 12, 2020

Would it help if we were able to specify the column width as a percentage of the card width rather than a number that seems to calculate an absolute width in px?