Lovelace: mini graph card

Sorry, but im not understand how I do this

I want grey graph, when sun is down.

To do this I have created a binary_sensor this way:

platform: tod
name: Night Time
after: sunset
before: sunrise

And then in the graph I use the state_map:

      state_map:
        - value: "off"
          label: "Day"
        - value: "on"
          label: "Night"

And the entity is configured this way:

        - entity: binary_sensor.night_time
          color: '#B3B3B3'
          name: Night Time
          show_fill: true
          show_line: false
          show_points: false
          show_legend: false
          y_axis: secondary
1 Like

Hello. I faced with problem and don’t know how to fix it.
This is screenshot from desktop version.


Graph in highlihted places is curved.

This is screenshots of mobile version.


Graph in same places is flat or corrupted at all.
Is it possible to fix it?
Ps. Sorry for my english.
Pss. As new user I can’t post more than 3 reply and 1 picture per post :worried:

Updated:
It’s mini graph card.

entities:
  - sensor.weather_temperature
hours_to_show: 168
points_per_hour: 0.5
type: 'custom:mini-graph-card'

I switched to default theme to ensure that prodlem was with graph, not with theme.

That looks a lot like the core sensor card rather than the custom mini graph card that this topic is about.

For problems with that start your own topic or report the issue here:

Hey @yoni3210, sorry for the delay.

I’m using the ‘Soft-UI’ theme with the following added to the card:


        style: |
          ha-card {
            border-radius: 15px;
            box-shadow: var(--soft-ui-pressed) !important;
          }       

But I’ve modified this to make the shadows a little heavier in the theme itself

So

box-shadow: inset -3px -3px 5px rgba(255,255,255,.5), inset 3px 3px 5px rgba(0,0,0,.08)
1 Like

Can anyone help me build these graphs from the utility meter

I need 3 bar charts

  1. usage for each hour in the day
  2. usage for each day of the week
  3. usage for each month of the year
utility_meter:
  gas_hourly:
    source: sensor.gas_meter_kwh
    cycle: hourly
  gas_daily:
    source: sensor.gas_meter_kwh
    cycle: daily  
  gas_weekly:
    source: sensor.gas_meter_kwh
    cycle: weekly
  gas_monthly:
    source: sensor.gas_meter_kwh
    cycle: monthly
  gas_yearly:
    source: sensor.gas_meter_kwh
    cycle: yearly

Are you keeping a years worth of data in your recorder database?

No specifically because I assumed the yearly cycle in the utility.meter keeps a years worth of data?

Pretty sure that’s not how it works.

The utility meter relies on an ever increasing sensor.

I don’t understand why, all of sudden today my lines graphs are all STRAIGHT HORIZONTAL lines. Temperature, humidity, cpu, etc. all are just straight lines. I uninstalled from HACS, removed lovelace resource, and rebooted. Cleared browser cache, reinstalled, same issue still.
Please help!

Have you checked what the entity history looks like? I see this if a sensor fails for example…

Sensors work. I see values change every a minute or two. But the graph stays the same. It’s weird.

So check the entity matches… in the card and for the sensor

They match, plus these were working before it stopped working. I created a new tab/view and a new card still the same issue. This is strange.

Hey David, I may have found the issue! Looks like it was a bad db. I deleted it and it worked! Thanks!

1 Like

I have put 3 line in one graph, and the problem is the range of these 3 graph : 200-220, 0-20, 0-5. So the high line or low line will look like a straight line. If i put “y_axis : secondary” in the second and the third line, it’s look greater but the scale of the third line is still not suitable. How to scale each line separately and display their own axis label?

125d2421e1561e084747
I want is to look like blynk one, as the second picture here

Hi have a template sensor that has 3 states.

Mowing
Charging
Error

Any way to show how long the sensor has spent in either state per day?

1 Like

Is there away to bold the sensor value? I tried using card-mod however background color is the only thing that changes.

type: 'custom:mini-graph-card'
font_size: 65
style: |
  ha-card {
    background: rgb(64,64,65);
    font-weight: bold;
  }
show:
  icon: false
entities:
  - sensor.avg_voltage
name: House Volts
hours_to_show: 24
points_per_hour: 6