color_thresholds: a glitch may appear if "lower_bound" is specified and "named-"color format is used

[ildar170975]

Check this example:

• two same cards (same settings except lower_bound);
• 1st card: lower_bound: 0
• 2nd card: lower_bound: 1

  - type: vertical-stack
    title: same color fmt, diff lower_bound
    cards:
      - type: custom:mini-graph-card
        lower_bound: 0
        <<: &ref_card_settings
          hours_to_show: 1
          points_per_hour: 240
          hour24: true
          line_width: 1
          color_thresholds_transition: hard
          aggregate_func: last
          smoothing: false
          height: 200
          entities:
            - sensor.processor_use
          show:
            points: true
            labels: true
        color_thresholds: &ref_colors_numbers
          - value: 0
            color: '#008000'
          - value: 40
            color: '#ffff00'
          - value: 60
            color: '#ff0000'
          - value: 80
            color: '#00ffff'
      - type: custom:mini-graph-card
        lower_bound: 1
        <<: *ref_card_settings
        color_thresholds: *ref_colors_numbers

These cards give same output - this is OK:

Now let's specify colors differently:

• 1st card - use kind of #ff0000 format;
• 2nd card - use kind of red format.

  - type: vertical-stack
    title: diff color fmt, diff lower_bound
    cards:
      - type: custom:mini-graph-card
        lower_bound: 0
        <<: *ref_card_settings
        color_thresholds: *ref_colors_numbers
      - type: custom:mini-graph-card
        lower_bound: 1
        <<: *ref_card_settings
        color_thresholds: &ref_colors_names
          - value: 0
            color: green
          - value: 40
            color: yellow
          - value: 60
            color: red
          - value: 80
            color: cyan

Now the 2nd card has a strange fill - this is a BUG:

Now specify same lower_bound: 0 for both cards:

  - type: vertical-stack
    title: diff color fmt, same 0-lower_bound
    cards:
      - type: custom:mini-graph-card
        lower_bound: 0
        <<: *ref_card_settings
        color_thresholds: *ref_colors_numbers
      - type: custom:mini-graph-card
        lower_bound: 0
        <<: *ref_card_settings
        color_thresholds: *ref_colors_names

Graphs again look OK:

Now specify same lower_bound: 1 for both cards:

  - type: vertical-stack
    title: diff color fmt, same 1-lower_bound
    cards:
      - type: custom:mini-graph-card
        lower_bound: 1
        <<: *ref_card_settings
        color_thresholds: *ref_colors_numbers
      - type: custom:mini-graph-card
        lower_bound: 1
        <<: *ref_card_settings
        color_thresholds: *ref_colors_names

Same glitch:

Now just remove the lower_bound for both cards:

  - type: vertical-stack
    title: diff color fmt, no lower_bound
    cards:
      - type: custom:mini-graph-card
        <<: *ref_card_settings
        color_thresholds: *ref_colors_numbers
      - type: custom:mini-graph-card
        <<: *ref_card_settings
        color_thresholds: *ref_colors_names

Same glitch:

Conclusion: in case of both conditions:

• lower_bound is NOT specified or is not zero;
• color is specified by a name, the glitch appears.

---

This is a problem with a "fill" - check these scaled cards: Good:

Wrong:

[ildar170975]

The glitch does not appear if the first value in color_thresholds is more than defined lower_bound: glitch arrears:

        lower_bound: 1
        ...
        color_thresholds:
          - value: 0
            color: green

no glitch:

        lower_bound: 1
        ...
        color_thresholds:
          - value: 2
            color: green