diff --git a/.devcontainer/ui-lovelace.yaml b/.devcontainer/ui-lovelace.yaml index bc0ca2c..9c7d213 100644 --- a/.devcontainer/ui-lovelace.yaml +++ b/.devcontainer/ui-lovelace.yaml @@ -1072,3 +1072,25 @@ views: show_states: true colorize_states: true disable_actions: true + - type: 'custom:apexcharts-card' + header: + show: true + title: ApexCharts-Card + show_states: true + series: + - entity: sensor.random0_100 + name: Temperature + data_generator: | + const now = new Date(); + const data = []; + data.push([now.getTime() - 25 * 1000 * 60 * 60, 50]) + data.push([now.getTime() - 10 * 1000 * 60 * 60, 21.2]) + data.push([now.getTime() - 4 * 1000 * 60 * 60, 20.4]) + data.push([now.getTime() - 3 * 1000 * 60 * 60, 19.7]) + data.push([now.getTime() - 0 * 1000 * 60 * 60, 19.7]) + return data; + yaxis_id: temp + show: + extremas: true + yaxis: + - id: temp diff --git a/src/apexcharts-card.ts b/src/apexcharts-card.ts index 4ed381a..6c6fe72 100644 --- a/src/apexcharts-card.ts +++ b/src/apexcharts-card.ts @@ -939,7 +939,12 @@ class ChartsCard extends LitElement { return { points: this._config?.series_in_graph.flatMap((serie, index) => { if (serie.show.extremas) { - const { min, max } = this._graphs?.[serie.index]?.minMaxWithTimestamp(start.getTime(), end.getTime()) || { + const { min, max } = this._graphs?.[serie.index]?.minMaxWithTimestamp( + this._seriesOffset[index] + ? new Date(start.getTime() + this._seriesOffset[index]).getTime() + : start.getTime(), + this._seriesOffset[index] ? new Date(end.getTime() + this._seriesOffset[index]).getTime() : end.getTime(), + ) || { min: [0, null], max: [0, null], }; @@ -1059,7 +1064,10 @@ class ChartsCard extends LitElement { if (yaxis.min_type !== minmax_type.FIXED || yaxis.max_type !== minmax_type.FIXED) { const minMax = yaxis.series_id?.map((id) => { // eslint-disable-next-line @typescript-eslint/no-non-null-assertion - const lMinMax = this._graphs![id]?.minMaxWithTimestamp(start.getTime(), end.getTime()); + const lMinMax = this._graphs![id]?.minMaxWithTimestampForYAxis( + this._seriesOffset[id] ? new Date(start.getTime() + this._seriesOffset[id]).getTime() : start.getTime(), + this._seriesOffset[id] ? new Date(end.getTime() + this._seriesOffset[id]).getTime() : end.getTime(), + ); if (!lMinMax) return undefined; if (this._config?.series[id].invert && lMinMax.min[1] !== null) { lMinMax.min[1] = -lMinMax.min[1]; diff --git a/src/graphEntry.ts b/src/graphEntry.ts index ab747d6..e188a4c 100644 --- a/src/graphEntry.ts +++ b/src/graphEntry.ts @@ -145,6 +145,18 @@ export default class GraphEntry { ); } + public minMaxWithTimestampForYAxis(start: number, end: number): { min: HistoryPoint; max: HistoryPoint } | undefined { + if (!this._computedHistory || this._computedHistory.length === 0) return undefined; + let lastTimestampBeforeStart = start; + const lastHistoryIndexBeforeStart = + this._computedHistory.findIndex((hist) => { + return hist[0] >= start; + }) - 1; + if (lastHistoryIndexBeforeStart >= 0) + lastTimestampBeforeStart = this._computedHistory[lastHistoryIndexBeforeStart][0]; + return this.minMaxWithTimestamp(lastTimestampBeforeStart, end); + } + private async _getCache(key: string, compressed: boolean): Promise { const data: EntityEntryCache | undefined | null = await localForage.getItem( `${key}_${this._md5Config}${compressed ? '' : '-raw'}`,