diff --git a/src/components/chart/state-history-chart-timeline.ts b/src/components/chart/state-history-chart-timeline.ts index fd2dea5e0a..f255b014da 100644 --- a/src/components/chart/state-history-chart-timeline.ts +++ b/src/components/chart/state-history-chart-timeline.ts @@ -143,11 +143,16 @@ export class StateHistoryChartTimeline extends LitElement { } }, afterUpdate: (y) => { + const yWidth = this.showNames + ? y.width ?? 0 + : computeRTL(this.hass) + ? 0 + : y.left ?? 0; if ( - this._yWidth !== Math.floor(y.width) && + this._yWidth !== Math.floor(yWidth) && y.ticks.length === this.data.length ) { - this._yWidth = Math.floor(y.width); + this._yWidth = Math.floor(yWidth); fireEvent(this, "y-width-changed", { value: this._yWidth, chartIndex: this.chartIndex, diff --git a/src/components/chart/state-history-charts.ts b/src/components/chart/state-history-charts.ts index 4e3e429219..4e7a0d429a 100644 --- a/src/components/chart/state-history-charts.ts +++ b/src/components/chart/state-history-charts.ts @@ -175,15 +175,14 @@ export class StateHistoryCharts extends LitElement { if (changedProps.has("_chartCount")) { if (this._chartCount < this._childYWidths.length) { this._childYWidths.length = this._chartCount; - this._maxYWidth = - this._childYWidths.length === 0 ? 0 : Math.max(...this._childYWidths); + this._maxYWidth = Math.max(...Object.values(this._childYWidths), 0); } } } private _yWidthChanged(e: CustomEvent) { this._childYWidths[e.detail.chartIndex] = e.detail.value; - this._maxYWidth = Math.max(...this._childYWidths); + this._maxYWidth = Math.max(...Object.values(this._childYWidths), 0); } private _isHistoryEmpty(): boolean {