
Es gibt eine vielzahl von Möglichkeiten seine Sensoren in Graphen anzeigen zu lassen…
Dieser Beitrag gibt einen kleinen Überblick über die verschiedensten Varianten


Empfohlene Produkte
Ausgewählte Empfehlungen für dein Smart Home Projekt

Es gibt eine vielzahl von Möglichkeiten seine Sensoren in Graphen anzeigen zu lassen…
Dieser Beitrag gibt einen kleinen Überblick über die verschiedensten Varianten

Shopping-Empfehlungen
Weitere empfohlene Produkte für dein Smart Home
1entities:
2 - entity: sensor.ku_temp
3 name: Temperatur (24h)
4 color: var(--dwains-theme-accent)
5 show_fill: true
6 - entity: sensor.ausee_temperature_test
7 color: green
8 show_fill: false
9font_size: 80
10hours_to_show: 24
11line_width: 2
12hour24: true
13points_per_hour: 2
14decimals: 0
15show:
16 animate: true
17 icon: false
18 labels: false
19 legend: false
20 name: false
21 graph: line
22 extrema: true
23 average: true
24theme: ios-dark-mode-blue-red
25type: custom:mini-graph-card
1type: grid
2cards:
3 - type: grid
4 cards:
5 - type: sensor
6 entity: sensor.wz_temp
7 graph: line
8 columns: 1
9 square: false
10columns: 1
11square: false
1cards:
2 - aggregate_func: max
3 align_state: center
4 animate: true
5 decimals: 0
6 entities:
7 - entity: sensor.wz_temp
8 index: 0
9 name: Download
10 - entity: sensor.speedtest_upload
11 index: 1
12 name: Upload
13 font_size: 100
14 font_size_header: 14
15 group_by: interval
16 height: 150
17 hour24: true
18 hours_to_show: 6
19 lower_bound: 0
20 points_per_hour: 2
21 show:
22 graph: line
23 icon: false
24 labels: true
25 legend: false
26 name: false
27 points: true
28 state: true
29 smoothing: false
30 type: custom:mini-graph-card
31title: false
32type: custom:vertical-stack-in-card

1entities:
2 - sensor.ausee_temperature_test
3 - sensor.wz_temp
4graph: line
5hour24: false
6hours_to_show: 72
7name: Temperatur-Verlauf
8show:
9 extrema: true
10 icon: true
11 name: true
12type: custom:mini-graph-card
1cards:
2 - cards:
3 - color_thresholds_transition: smooth
4 entities:
5 - entity: sensor.speedtest_ping
6 index: 0
7 name: Ping
8 font_size: 70
9 group: false
10 hour24: true
11 line_width: 6
12 lower_bound: 0
13 points_per_hour: 1
14 show:
15 extrema: true
16 fill: fade
17 icon: true
18 labels: false
19 name: true
20 state: true
21 style: |
22 ha-card {
23 box-shadow: none;
24 --ha-card-background: 'rgba(0, 0, 0, 0)';
25 }
26 type: custom:mini-graph-card
27 - color_thresholds_transition: smooth
28 entities:
29 - entity: sensor.speedtest_download
30 index: 0
31 name: Download
32 font_size: 70
33 group: false
34 hour24: true
35 line_width: 6
36 lower_bound: 0
37 points_per_hour: 1
38 show:
39 extrema: true
40 fill: fade
41 icon: true
42 labels: false
43 name: true
44 state: true
45 style: |
46 ha-card {
47 box-shadow: none;
48 --ha-card-background: 'rgba(0, 0, 0, 0)';
49 }
50 type: custom:mini-graph-card
51 - color_thresholds_transition: smooth
52 entities:
53 - entity: sensor.speedtest_upload
54 index: 0
55 name: Upload
56 font_size: 70
57 group: false
58 hour24: true
59 line_width: 6
60 lower_bound: 0
61 points_per_hour: 1
62 show:
63 extrema: true
64 fill: fade
65 icon: true
66 labels: false
67 name: true
68 state: true
69 style: |
70 ha-card {
71 box-shadow: none;
72 --ha-card-background: 'rgba(0, 0, 0, 0)';
73 }
74 type: custom:mini-graph-card
75 horizontal: true
76 name: Speedtest
77 style: |
78 ha-card {
79 box-shadow: none;
80 --ha-card-background: 'rgba(0, 0, 0, 0)';
81 }
82 type: custom:vertical-stack-in-card
83style: |
84 ha-card {
85 box-shadow: none;
86 --ha-card-background: var(--ha-card-background);
87 }
88title: Network
89type: custom:vertical-stack-in-card
1entities:
2 - sensor.wz_temp
3graph: line
4hour24: false
5hours_to_show: 240
6name: Wohnzimmer-Verlauf
7show:
8 extrema: true
9 icon: true
10 name: true
11type: custom:mini-graph-card
1type: custom:stack-in-card
2cards:
3 - type: custom:apexcharts-card
4 header:
5 show: true
6 title: Außen
7 floating: true
8 show_states: true
9 series:
10 - entity: sensor.wz_temp
11 name: Temperatur
12 - entity: sensor.humiditiy_sensor
13 name: rel. Luftfeuchtigkeit
14 show:
15 in_chart: false
16 all_series_config:
17 type: area
18 show:
19 extremas: true
20 apex_config:
21 legend:
22 show: false
23 stroke:
24 width: 2
25 yaxis:
26 - decimalsInFloat: 0
27 style: |
28 ha-card {
29 font-size: 15px;
30 }
31 - type: custom:apexcharts-card
32 header:
33 show: true
34 title: Außen
35 floating: true
36 show_states: true
37 series:
38 - entity: sensor.ausee_temperature_test
39 name: Temperatur
40 - entity: sensor.humiditiy_sensor
41 name: rel. Luftfeuchtigkeit
42 show:
43 in_chart: false
44 all_series_config:
45 type: area
46 show:
47 extremas: true
48 apex_config:
49 legend:
50 show: false
51 stroke:
52 width: 2
53 yaxis:
54 - decimalsInFloat: 0
55 style: |
56 .wrapper div#header div#states__state:nth-child(2) div#state__value {
57 justify-content: end;
58 }
59 .wrapper div#header div#states__state div#state__value {
60 display: flex;
61 }
62 .wrapper div#header div#states__state:nth-child(1),
63 .wrapper div#header div#header__title {
64 margin-left: 30px;
65 }
1type: custom:apexcharts-card
2layout: minimal
3locale: de
4graph_span: 8h
5show:
6 loading: false
7apex_config:
8 plotOptions:
9 area:
10 fillTo: end
11 grid:
12 padding:
13 top: -15
14 fill:
15 type: gradient
16 gradient:
17 type: vertical
18 opacityFrom: 0.8
19 opacityTo: 0
20 stops:
21 - 0
22 - 99
23 - 100
24 stroke:
25 width: 4
26 tooltip:
27 style:
28 fontSize: 14px
29 x:
30 format: dddd HH:mm
31 chart:
32 height: 140px
33 offsetY: '-20px'
34 xaxis:
35 crosshairs:
36 show: false
37series:
38 - entity: sensor.wz_temp
39 name: Temp
40 color: '#385581'
41 type: area
42 fill_raw: last
43 group_by:
44 func: avg
45 duration: 1h
1entities:
2 - sensor.wz_temp
3icon: hass:broom
4hour24: false
5hours_to_show: 36
6name: Temp History Wohnzimmer
7show:
8 extrema: true
9 graph: bar
10 icon: true
11 name: true
12 name_adaptive_color: true
13 icon_adaptive_color: true
14type: custom:mini-graph-card
1type: custom:mini-graph-card
2height: 30
3line_width: 4
4font_size: 70
5hours_to_show: 168
6points_per_hour: 1
7show:
8 extrema: true
9 fill: true
10 labels: false
11 icon: true
12hour24: true
13icon: mdi:thermometer
14style: |
15 ha-card {
16 --ha-card-background: "rgba(0, 0, 0, 0.0)";
17 --ha-card-box-shadow: 'none';
18 border-radius: 5px;
19 }
20 .info.flex {
21 font-size: 16px !important;
22 }
23entities:
24 - sensor.ausee_temperature_test
25name: Temperature
26color_thresholds:
27 - value: 30
28 color: '#00ff00'
29 - value: 60
30 color: '#ffa500'
31 - value: 80
32 color: '#ff0000'
33color_thresholds_transition: smooth
1type: history-graph
2title: Wohnzimmer
3entities:
4 - entity: sensor.weather_temperature
5 name: Outside
6 - entity: climate.fritz_dect_301_1
7 name: ':'
8hours_to_show: 24
9refresh_interval: 0
1type: entities
2title: BÜRO
3show_header_toggle: false
4style: |
5 ha-card {
6 border-radius: 15px;
7 background-color: rgba(220,220,220,0.5);
8 box-shadow: 1px 1px 2px 0px rgba(0,0,0,0.50);
9 font-weight: bold
10 }
11entities:
12 - type: custom:simple-thermostat
13 entity: climate.fritz_dect_301_2_wohnzimmer
14 name: false
15 icon: false
16 fallback: AUS
17 decimals: 1
18 step_size: 0.5
19 step_layout: column
20 label:
21 temperature: Temperatur
22 state: Status
23 hide:
24 temperature: false
25 state: true
26 control:
27 _headings: false
28 _names: true
29 _icons: true
30 hvac:
31 heat:
32 name: An
33 icon: mdi:fire
34 'off':
35 name: Aus
36 icon: mdi:power
37 sensors:
38 - entity: sensor.humiditiy_sensor
39 name: Luftfeuchtigkeit
40 icon: mdi:water-percent
41 style: |
42 ha-card {
43 border-radius: 15px;
44 background-color: rgba(000,000,000,0.0);
45 box-shadow: 1px 1px 2px 0px rgba(000,000,000,0.0);
46 font-weight: bold;
47 --st-spacing: 2px;
48 }
49 ha-card .mode-item {
50 background: rgba(000,000,000,0.0);
51 color: rgba(150,150,150, 1.0);
52 }
53 ha-card .mode-item.active {
54 background: rgba(002,136,209,1.0);
55 }
56 ha-card .mode-item:hover {
57 background: rgba(220,220,220,0.5);
58 }
59 - type: custom:mini-graph-card
60 hours_to_show: 168
61 points_per_hour: 10
62 animate: false
63 decimals: 1
64 lower_bound: 18
65 upper_bound: 26
66 height: 300
67 show:
68 icon: false
69 name: false
70 state: false
71 fill: true
72 labels: true
73 extrema: false
74 line_width: 1
75 hour24: true
76 entities:
77 - entity: sensor.wz_temp
78 name: Gemessen
79 color: green
80 - entity: sensor.ausee_temperature_test
81 name: IST
82 color: rgba(106,201,254,1.0)
83 style: |
84 ha-card {
85 border-radius: 15px;
86 background-color: rgba(000,000,000,0.0);
87 box-shadow: 1px 1px 2px 0px rgba(000,000,000,0.0);
88 font-weight: bold
89 }
1type: custom:button-card
2aspect_ratio: 1/1
3icon: mdi:chair-rolling
4entity: sensor.wz_temp
5name: Büro
6hold_action:
7 haptic: heavy
8 action: call-service
9 service: browser_mod.command
10 service_data:
11 command: popup
12 title: |
13 [[[ return entity.attributes.friendly_name ]]]
14 style:
15 position: fixed
16 z-index: 999
17 top: 0
18 left: 0
19 height: 100%
20 width: 100%
21 display: block
22 align-items: center
23 justify-content: center
24 background: rgba(0, 0, 0, 0.8)
25 color: var(--primary-color)
26 flex-direction: column
27 margin: 0
28 '--iron-icon-fill-color': '#FFF'
29 card:
30 type: custom:thermostat-popup-card
31 entity: climate.fritz_dect_301_2_wohnzimmer
32 brightnessWidth: 150px
33 brightnessHeight: 400px
34 switchWidth: 150px
35 switchHeight: 400px
36 fullscreen: false
37custom_fields:
38 graph:
39 card:
40 type: custom:mini-graph-card
41 entities:
42 - sensor.wz_temp
43 show:
44 icon: false
45 name: false
46 state: false
47 line_width: 5
48 hu: |
49 [[[
50 return `<ha-icon
51 icon="mdi:water-percent:"
52 style="width:20px;color: skyblue;">
53 </ha-icon><span style="color: var(--text-color-sensor);">${states['sensor.wz_temp'].state}%</span>`
54 ]]]
55 temp: |
56 [[[
57 return `<ha-icon
58 icon="mdi:thermometer:"
59 style="width:20px;color:var(--accent-color);">
60 </ha-icon><span>${entity.state}°C</span>`
61 ]]]
62styles:
63 custom_fields:
64 graph:
65 - overflow: unset
66 card:
67 - overflow: unset
68 grid:
69 - grid-template-areas: '"n i" "temp hu" "graph graph"'
70 - grid-template-columns: 50% 50%
71 - grid-template-rows: 1fr 1fr 1fr
72 - overflow: unset
73 name:
74 - font-size: 16px
75 - color: white
76 state:
77 - font-size: 10px
78 - color: white
1entity: input_select.home
2states:
3 Home:
4 cards:
5 - entity: climate.fritz_dect_301_2_wohnzimmer
6 type: thermostat
7 - entities:
8 - entity: sensor.wz_temp
9 hours_to_show: 24
10 refresh_interval: 0
11 type: history-graph
12 type: vertical-stack
13 Away:
14 cards:
15 - entity: climate.fritz_dect_301_2_wohnzimmer
16 type: thermostat
17 - entities:
18 - entity: sensor.wz_temp
19 hours_to_show: 24
20 refresh_interval: 0
21 type: history-graph
22 type: vertical-stack
23type: custom:state-switch