jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-07-19 15:26:36 +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 { return {
columns: 12, columns: 12,
min_columns: 6, 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 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` return html`
<ha-card> <ha-card>
@ -283,9 +284,7 @@ export class HuiHistoryGraphCard extends LitElement implements LovelaceCard {
.minYAxis=${this._config.min_y_axis} .minYAxis=${this._config.min_y_axis}
.maxYAxis=${this._config.max_y_axis} .maxYAxis=${this._config.max_y_axis}
.fitYData=${this._config.fit_y_data || false} .fitYData=${this._config.fit_y_data || false}
.height=${this._config.grid_options?.rows .height=${hasFixedHeight ? "100%" : undefined}
? "100%"
: undefined}
.narrow=${narrow} .narrow=${narrow}
></state-history-charts> ></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; return nothing;
} }
const hasFixedHeight = typeof this._config.grid_options?.rows === "number";
return html` return html`
<ha-card .header=${this._config.title}> <ha-card .header=${this._config.title}>
<div <div
@ -290,7 +292,7 @@ export class HuiStatisticsGraphCard extends LitElement implements LovelaceCard {
.daysToShow=${this._energyStart && this._energyEnd .daysToShow=${this._energyStart && this._energyEnd
? differenceInDays(this._energyEnd, this._energyStart) ? differenceInDays(this._energyEnd, this._energyStart)
: this._config.days_to_show || DEFAULT_DAYS_TO_SHOW} : this._config.days_to_show || DEFAULT_DAYS_TO_SHOW}
.height=${this._config.grid_options?.rows ? "100%" : undefined} .height=${hasFixedHeight ? "100%" : undefined}
></statistics-chart> ></statistics-chart>
</div> </div>
</ha-card> </ha-card>