Add Y-Axis limits functionality from history graphs card to statistics graph card (#22771)

This commit is contained in:
DominikBitzer 2024-11-19 12:19:35 +01:00 committed by GitHub
parent c9cad254d2
commit 2c1931adb1
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
5 changed files with 59 additions and 3 deletions

View File

@ -72,6 +72,12 @@ export class StatisticsChart extends LitElement {
@property() public chartType: ChartType = "line";
@property({ type: Number }) public minYAxis?: number;
@property({ type: Number }) public maxYAxis?: number;
@property({ type: Boolean }) public fitYData = false;
@property({ type: Boolean }) public hideLegend = false;
@property({ type: Boolean }) public logarithmicScale = false;
@ -113,6 +119,9 @@ export class StatisticsChart extends LitElement {
changedProps.has("unit") ||
changedProps.has("period") ||
changedProps.has("chartType") ||
changedProps.has("minYAxis") ||
changedProps.has("maxYAxis") ||
changedProps.has("fitYData") ||
changedProps.has("logarithmicScale") ||
changedProps.has("hideLegend")
) {
@ -232,6 +241,8 @@ export class StatisticsChart extends LitElement {
text: unit || this.unit,
},
type: this.logarithmicScale ? "logarithmic" : "linear",
min: this.fitYData ? null : this.minYAxis,
max: this.fitYData ? null : this.maxYAxis,
},
},
plugins: {

View File

@ -195,6 +195,9 @@ export class HuiStatisticsGraphCard extends LitElement implements LovelaceCard {
.statTypes=${this._statTypes!}
.names=${this._names}
.unit=${this._unit}
.minYAxis=${this._config.min_y_axis}
.maxYAxis=${this._config.max_y_axis}
.fitYData=${this._config.fit_y_data || false}
.hideLegend=${this._config.hide_legend || false}
.logarithmicScale=${this._config.logarithmic_scale || false}
></statistics-chart>

View File

@ -356,6 +356,9 @@ export interface StatisticsGraphCardConfig extends LovelaceCardConfig {
period?: "5minute" | "hour" | "day" | "month";
stat_types?: StatisticType | StatisticType[];
chart_type?: "line" | "bar";
min_y_axis?: number;
max_y_axis?: number;
fit_y_data?: boolean;
hide_legend?: boolean;
logarithmic_scale?: boolean;
}

View File

@ -69,6 +69,9 @@ const cardConfigStruct = assign(
unit: optional(string()),
hide_legend: optional(boolean()),
logarithmic_scale: optional(boolean()),
min_y_axis: optional(number()),
max_y_axis: optional(number()),
fit_y_data: optional(boolean()),
})
);
@ -126,7 +129,8 @@ export class HuiStatisticsGraphCardEditor
(
localize: LocalizeFunc,
statisticIds: string[] | undefined,
metaDatas: StatisticsMetaData[] | undefined
metaDatas: StatisticsMetaData[] | undefined,
showFitOption: boolean
) => {
const units = new Set<string>();
metaDatas?.forEach((metaData) => {
@ -213,6 +217,33 @@ export class HuiStatisticsGraphCardEditor
],
],
},
{
name: "",
type: "grid",
schema: [
{
name: "min_y_axis",
required: false,
selector: { number: { mode: "box", step: "any" } },
},
{
name: "max_y_axis",
required: false,
selector: { number: { mode: "box", step: "any" } },
},
],
},
...(showFitOption
? [
{
name: "fit_y_data",
required: false,
selector: { boolean: {} },
},
]
: []),
{
name: "hide_legend",
required: false,
@ -254,7 +285,9 @@ export class HuiStatisticsGraphCardEditor
const schema = this._schema(
this.hass.localize,
this._configEntities,
this._metaDatas
this._metaDatas,
this._config!.min_y_axis !== undefined ||
this._config!.max_y_axis !== undefined
);
const configured_stat_types = this._config!.stat_types
? ensureArray(this._config.stat_types)
@ -359,6 +392,9 @@ export class HuiStatisticsGraphCardEditor
case "unit":
case "hide_legend":
case "logarithmic_scale":
case "min_y_axis":
case "max_y_axis":
case "fit_y_data":
return this.hass!.localize(
`ui.panel.lovelace.editor.card.statistics-graph.${schema.name}`
);

View File

@ -6162,7 +6162,10 @@
"pick_statistic": "Add a statistic",
"picked_statistic": "Statistic",
"hide_legend": "Hide legend",
"logarithmic_scale": "Logarithmic scale"
"logarithmic_scale": "Logarithmic scale",
"min_y_axis": "Y axis minimum",
"max_y_axis": "Y axis maximum",
"fit_y_data": "Extend Y axis limits to fit data"
},
"statistic": {
"name": "Statistic",