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

Limit max label width of hui-energy-devices-graph-card (#24152)

Browse Source
This commit is contained in:
Petar Petrov 2025-02-10 16:54:20 +02:00 committed by GitHub
parent 3d5c65d652
commit 748642a8d6
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 19 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
src/panels/lovelace/cards/energy/hui-energy-devices-graph-card.ts
View File

@ -27,6 +27,7 @@ import { hasConfigChanged } from "../../common/has-changed";
import type { ECOption } from "../../../../resources/echarts";
import "../../../../components/ha-card";
import { fireEvent } from "../../../../common/dom/fire_event";
import { measureTextWidth } from "../../../../util/text";
@customElement("hui-energy-devices-graph-card")
export class HuiEnergyDevicesGraphCard
@ -109,8 +110,11 @@ export class HuiEnergyDevicesGraphCard
return `${title}${params.marker} ${params.seriesName}: ${value}`;
}
private _createOptions = memoizeOne(
(data: BarSeriesOption[]): ECOption => ({
private _createOptions = memoizeOne((data: BarSeriesOption[]): ECOption => {
const isMobile = window.matchMedia(
"all and (max-width: 450px), all and (max-height: 500px)"
).matches;
return {
xAxis: {
type: "value",
name: "kWh",
@ -124,6 +128,17 @@ export class HuiEnergyDevicesGraphCard
axisLabel: {
formatter: this._getDeviceName.bind(this),
overflow: "truncate",
fontSize: 12,
margin: 5,
width: Math.min(
isMobile ? 100 : 200,
Math.max(
...(data[0]?.data?.map(
(d: any) =>
measureTextWidth(this._getDeviceName(d.value[1]), 12) + 5
) || [])
)
),
},
},
grid: {
@ -137,8 +152,8 @@ export class HuiEnergyDevicesGraphCard
show: true,
formatter: this._renderTooltip.bind(this),
},
})
);
};
});
private _getDeviceName(statisticId: string): string {
return (