jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-07-19 07:16:39 +00:00
Code Issues Packages Projects Releases Wiki Activity

Improve chart height and narrow option in grid section (#24046)

Browse Source 
* Fix chart size in grid

* Set minimal height to 2 for history chart

* Update history chart
This commit is contained in:
Paul Bottein 2025-02-03 15:12:28 +01:00 committed by Bram Kragten
parent 72df585c5e
commit 0f4b6b423a
2 changed files with 7 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/panels/lovelace/cards/hui-history-graph-card.ts
View File

@ -65,7 +65,7 @@ export class HuiHistoryGraphCard extends LitElement implements LovelaceCard {
return {
columns: 12,
min_columns: 6,
min_rows: this._config?.entities?.length || 1,
min_rows: 2,
};
}
@ -244,7 +244,8 @@ export class HuiHistoryGraphCard extends LitElement implements LovelaceCard {
})}`;
const columns = this._config.grid_options?.columns ?? 12;
const narrow = Number.isNaN(columns) || Number(columns) <= 12;
const narrow = typeof columns === "number" && columns <= 12;
const hasFixedHeight = typeof this._config.grid_options?.rows === "number";
return html`
<ha-card>
@ -283,9 +284,7 @@ export class HuiHistoryGraphCard extends LitElement implements LovelaceCard {
.minYAxis=${this._config.min_y_axis}
.maxYAxis=${this._config.max_y_axis}
.fitYData=${this._config.fit_y_data || false}
.height=${this._config.grid_options?.rows
? "100%"
: undefined}
.height=${hasFixedHeight ? "100%" : undefined}
.narrow=${narrow}
></state-history-charts>
`}

4
src/panels/lovelace/cards/hui-statistics-graph-card.ts
View File

@ -258,6 +258,8 @@ export class HuiStatisticsGraphCard extends LitElement implements LovelaceCard {
return nothing;
}
const hasFixedHeight = typeof this._config.grid_options?.rows === "number";
return html`
<ha-card .header=${this._config.title}>
<div
@ -290,7 +292,7 @@ export class HuiStatisticsGraphCard extends LitElement implements LovelaceCard {
.daysToShow=${this._energyStart && this._energyEnd
? differenceInDays(this._energyEnd, this._energyStart)
: this._config.days_to_show || DEFAULT_DAYS_TO_SHOW}
.height=${this._config.grid_options?.rows ? "100%" : undefined}
.height=${hasFixedHeight ? "100%" : undefined}
></statistics-chart>
</div>
</ha-card>