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

Fix statistics echarts with negative values (#23983)

Browse Source 
* Fix statistics echarts with negative values

* fix border-radius of negative bar values

* revert timeline label width to previous max values
This commit is contained in:
Petar Petrov 2025-01-31 12:02:39 +02:00 committed by GitHub
parent a8712e3b8e
commit 938855e13c
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 18 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/chart/state-history-chart-timeline.ts
View File

@ -183,7 +183,7 @@ export class StateHistoryChartTimeline extends LitElement {
private _createOptions() { private _createOptions() {
const narrow = this.narrow; const narrow = this.narrow;
const showNames = this.chunked || this.showNames; const showNames = this.chunked || this.showNames;
const maxInternalLabelWidth = narrow ? 70 : 165; const maxInternalLabelWidth = narrow ? 105 : 185;
const labelWidth = showNames const labelWidth = showNames
? Math.max(this.paddingYAxis, this._yWidth) ? Math.max(this.paddingYAxis, this._yWidth)
: 0; : 0;

23
src/components/chart/statistics-chart.ts
View File

@ -375,10 +375,12 @@ export class StatisticsChart extends LitElement {
) { ) {
// if the end of the previous data doesn't match the start of the current data, // if the end of the previous data doesn't match the start of the current data,
// we have to draw a gap so add a value at the end time, and then an empty value. // we have to draw a gap so add a value at the end time, and then an empty value.
d.data!.push([prevEndTime, ...prevValues[i]!]); d.data!.push(
this._transformDataValue([prevEndTime, ...prevValues[i]!])
);
d.data!.push([prevEndTime, null]); d.data!.push([prevEndTime, null]);
} }
d.data!.push([start, ...dataValues[i]!]); d.data!.push(this._transformDataValue([start, ...dataValues[i]!]));
}); });
prevValues = dataValues; prevValues = dataValues;
prevEndTime = end; prevEndTime = end;
@ -455,14 +457,14 @@ export class StatisticsChart extends LitElement {
borderWidth: 1.5, borderWidth: 1.5,
} }
: undefined, : undefined,
color: band ? color + "3F" : color + "7F", color:
band && hasMean ? color + (this.hideLegend ? "00" : "7F") : color,
}; };
if (band && this.chartType === "line") { if (band && this.chartType === "line") {
series.stack = `band-${statistic_id}`; series.stack = `band-${statistic_id}`;
series.stackStrategy = "all";
(series as LineSeriesOption).symbol = "none"; (series as LineSeriesOption).symbol = "none";
(series as LineSeriesOption).lineStyle = { (series as LineSeriesOption).lineStyle = { width: 1.5 };
opacity: 0,
};
if (drawBands && type === "max") { if (drawBands && type === "max") {
(series as LineSeriesOption).areaStyle = { (series as LineSeriesOption).areaStyle = {
color: color + "3F", color: color + "3F",
@ -495,7 +497,7 @@ export class StatisticsChart extends LitElement {
} }
} else if (type === "max" && this.chartType === "line") { } else if (type === "max" && this.chartType === "line") {
const max = stat.max || 0; const max = stat.max || 0;
val.push(max - (stat.min || 0)); val.push(Math.abs(max - (stat.min || 0)));
val.push(max); val.push(max);
} else { } else {
val.push(stat[type] ?? null); val.push(stat[type] ?? null);
@ -535,6 +537,13 @@ export class StatisticsChart extends LitElement {
this._statisticIds = statisticIds; this._statisticIds = statisticIds;
} }
private _transformDataValue(val: [Date, ...(number | null)[]]) {
if (this.chartType === "bar" && val[1] && val[1] < 0) {
return { value: val, itemStyle: { borderRadius: [0, 0, 4, 4] } };
}
return val;
}
static styles = css` static styles = css`
:host { :host {
display: block; display: block;

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

@ -244,7 +244,7 @@ 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 = Number.isNaN(columns) || Number(columns) <= 12;
return html` return html`
<ha-card> <ha-card>