timeline

[MrAurik]

Hello.

in the mini-graph-card, is it possible to show the "timeline" at the botom of the x axis ?
I have a 24 "hours to show" and I would like to see it like my awfull below exemple ^^

thank's !

[ildar170975]

It is not possible.

[tinyhugh]

What is the code of the card you illustrated?

[MrAurik]

here it is !

`type: custom:stack-in-card
cards:

• type: custom:mushroom-title-card
  title: Chambre Lou
• type: custom:stack-in-card
  cards:
  • type: grid
    square: false
    columns: 2
    cards:
    • type: custom:mushroom-entity-card
      entity: sensor.capteur_lou_temperature
      primary_info: state
      secondary_info: name
      name: Temperature
      icon_color: green
    • type: custom:mushroom-entity-card
      entity: sensor.capteur_lou_humidity
      primary_info: state
      secondary_info: name
      name: Humidity
      icon_color: blue
  • type: custom:mini-graph-card
    entities:
    • entity: sensor.capteur_lou_temperature
      name: Temperature
      color: "#00bb33"
    • entity: sensor.capteur_lou_humidity
      name: Humidity
      color: "#2196f3"
      y_axis: secondary
      hours_to_show: 24
      line_width: 3
      font_size: 50
      animate: true
      show:
      name: false
      icon: false
      state: false
      legend: false
      fill: fade
      card_mod:
      style: |
      mushroom-shape-icon {
      {% if is_state(config.entity, 'heat_cool') %}
      --card-mod-icon: mdi:autorenew;
      animation: spin 3s ease-in-out infinite alternate;
      {% elif is_state(config.entity, 'heat') %}
      --card-mod-icon: mdi:fire;
      animation: heat 2s infinite;
      {% elif is_state(config.entity, 'cool') %}
      --card-mod-icon: mdi:snowflake;
      animation: cool 6s ease-in-out infinite;
      {% elif is_state(config.entity, 'dry') %}
      --card-mod-icon: mdi:water-percent;
      animation: dry 1.5s linear infinite;
      {% elif is_state(config.entity, 'fan_only') %}
      --card-mod-icon: mdi:fan;
      animation: spin 1s linear infinite;
      {% else %}
      --card-mod-icon: mdi:air-conditioner;
      {% endif %}
      display: flex;
      }
      @Keyframes cool {
      0%, 100% { transform: rotate(25deg); }
      25% { transform: rotate(-25deg); }
      50% { transform: rotate(50deg); }
      75% { transform: rotate(-50deg); }
      }
      @Keyframes heat {
      0%, 100% { --icon-color: rgba(var(--rgb-red), 1); }
      10%, 90% { --icon-color: rgba(var(--rgb-red), 0.8); }
      20%, 80% { --icon-color: rgba(var(--rgb-red), 0.6); }
      30%, 70% { --icon-color: rgba(var(--rgb-red), 0.4); }
      40%, 60% { --icon-color: rgba(var(--rgb-red), 0.2); }
      50% { --icon-color: rgba(var(--rgb-red), 0); }
      }
      @Keyframes dry {
      0%, 100% { --icon-symbol-size: 21px; }
      10%, 90% { --icon-symbol-size: 22px; }
      20%, 80% { --icon-symbol-size: 23px; }
      30%, 70% { --icon-symbol-size: 24px; }
      40%, 60% { --icon-symbol-size: 25px; }
      50% { --icon-symbol-size: 26px; }
      }
      `