Scale max and min values of Metric chart

[fpinedevx]

Hello Taipy Community.

I'm building a dashboard that has a scorecard of total sales. I wanted to use a Metric chart for the same total. When I select/de-select years in the dropdown, the total is updated correctly. In my function that I calculate the total, I also calc a new max and min for the Metric chart. The new values are not reflected with the updated total. Any ideas? Thanks in advance!

Function code:
`def update_total_sales(filtered_data):
total_sales = round(filtered_data["Sales"].sum(), 2)
year_count = filtered_data["Year"].nunique()
min_year = data["Year"].min()
min_year_sales = round(data[data["Year"] == min_year]["Sales"].sum(), 2)
total_threshold = (min_year_sales * year_count) * .92
total_max = total_sales * 1.25
total_min = total_sales/2

return total_sales,  total_threshold, total_max, total_min`

Markdown Code:
<|Total Sales|metric|value={total_sales}|min={total_min}|max={total_max}|threshold={total_threshold}|currency=USD|class_name=h4|>

[pratikrath126]

Hey! I think this is a state-binding issue. In Taipy, min/max/threshold need to be bound to state variables that actually change (same as value). A couple practical checks:\n\n- Make sure total_min, total_max, and total_threshold are declared in state and updated in your callback.\n- If you return multiple values, ensure your callback is wired to update all of them (e.g., on_change returns a tuple that maps to all three state vars).\n- Also, you’re using data when computing min_year/min_year_sales instead of filtered_data — if that’s intentional fine, but it might make the threshold look “stuck”.\n\nIf you can share the callback wiring (on_change / on_action), I can help spot it.

[fpinedevx]

Thanks for the quick response! I really appreciate it.
Here is my complete script:

from pathlib import Path
import pandas as pd
from taipy.gui import Gui, notify
import taipy.gui.builder as tgb

import warnings
warnings.filterwarnings("ignore")
import numpy as np
#import gspread
import openpyxl as opx

from babel.numbers import format_currency


# Initializations
#gc = gspread.service_account("service_account.json")
#sh = gc.open("OfficeSuppliesOrderData")
#ws = sh.worksheet("data")
#data = pd.DataFrame(ws.get_all_records())
file_path = "OfficeSuppliesOrderData.xlsx"
data = pd.read_excel(file_path)


# Data clean up
data["Order Date"] = pd.to_datetime(data["Order Date"], errors="coerce")
data["Sales"] = pd.to_numeric(data["Sales"], errors="coerce").fillna(0.0)


# data transformations
data["Year"] = data["Order Date"].dt.year
data["Month"] = data["Order Date"].dt.month
data["Quarter"] = data["Order Date"].dt.quarter


# Get LOV values
years = data["Year"].unique().tolist()
quarters = data["Quarter"].unique().tolist()
months = data["Month"].unique().tolist()


# Filter Data function based on dropdown values
def filter_data(selected_year, selected_quarter, selected_month):
    print("Filtering data with:")
    print(f"Years: {selected_year}, Quarters: {selected_quarter}, Months: {selected_month}")
    filtered_data = data[
        (data["Year"].isin(selected_year)) &
        (data["Quarter"].isin(selected_quarter)) &
        (data["Month"].isin(selected_month))
    ].copy()
    print("Filtered data:")
    print(filtered_data.head())
    return filtered_data  

def update_total_sales(filtered_data):
    total_sales = round(filtered_data["Sales"].sum(), 2)
    year_count = filtered_data["Year"].nunique()
    min_year = data["Year"].min()
    min_year_sales = round(data[data["Year"] == min_year]["Sales"].sum(), 2) 
    total_threshold = (min_year_sales * year_count) * .92 
    total_max = total_sales * 1.25
    total_min = total_sales/2

    return total_sales,  total_threshold, total_max, total_min

# Calc KPIs based on filtered data
def update_kpis(filtered_data):

    average_sale = round(filtered_data["Sales"].mean(), 2)
    #customer_count = filtered_data["Customer ID"].unique()
    #order_count = filtered_data["Order ID"].count()
    return average_sale #, customer_count, order_count


#Initialize state of variables
selected_year = years
selected_quarter = quarters
selected_month = months
filtered_data = filter_data(selected_year, selected_quarter, selected_month)
average_sale = update_kpis(filtered_data) #, customer_count, order_count = update_kpis(filtered_data)
total_sales, total_threshold, total_max, total_min = update_total_sales(filtered_data)


# Page definition
page = """
# Sales Dashboard 📊

<|layout|columns=1 1 1|gap=25px|
<|{selected_year}|selector|lov={years}|dropdown|label=Year|multiple|on_change=on_filter|>

<|{selected_quarter}|selector|lov={quarters}|dropdown|label=Quarter|multiple|on_change=on_filter|>

<|{selected_month}|selector|lov={months}|dropdown|label=Month|multiple|on_change=on_filter|>
|>

<|layout|columns=2 2 2 2|gap=25px|



<|Total Sales: {total_sales}|text|class_name=h4|>

<|Total Sales|>
<|Total Sales|metric|value={total_sales}|min={total_min}|max={total_max}|threshold={total_threshold}|format=currency|currency=USD|locale=en_US|class_name=h4|>

<|Average Sale: {average_sale}|text|class_name=h4|>

|>

<|{filtered_data}|table|class_name=h2|>




"""

# # full table of data <|{yrmonsales}|chart|type=line|x=YrMon|y=Sales|title=Month by Month Sales|>
#<|Order Count: {order_count}|text|class_name=h4|>

#<|Total Sales: {total_sales}|text|class_name=h4|>

#<|Average Sale: {average_sale}|text|class_name=h4|>

#<|Customer Count: {customer_count}|text|class_name=h4|>


# initialize the gui
gui = Gui(page)

# function to trigger data changes
def on_filter(state):
    state.filtered_data = filter_data(
        state.selected_year, 
        state.selected_quarter, 
        state.selected_month)
    state.average_sale = update_kpis(
        state.filtered_data)
    state.total_sales, state.total_threshold, state.total_max, state.total_min = update_total_sales(state.filtered_data)
    #, 
    #state.customer_count, 
    #state.order_count = update_kpis(
    #    state.filtered_data)
    
    
# assign variable values on dropdown change
gui._call_on_change("selected_year", on_filter)
gui._call_on_change("selected_quarter", on_filter)
gui._call_on_change("selected_month", on_filter)

# Execute the app 
gui.run(years=years, 
        quarters=quarters, 
        months=months, 
        selected_year=selected_year, 
        selected_quarter=selected_quarter, 
        selected_month=selected_month, 
        filtered_data=filtered_data, 
        total_sales=total_sales, 
        total_threshold=total_threshold,       
        total_max=total_max,
        total_min=total_min,
        average_sale=average_sale)

[arcanaxion]

The min and max properties for the metric control are not dynamic, so they will retain the value at initialization.

The easiest solution might be to instead use a figure directly like so:

import pandas as pd
import plotly.graph_objects as go
from taipy.gui import Gui, State

df = pd.DataFrame({"product": ["A", "B", "C"], "sales": [100, 200, 150]})

product_list = df["product"].tolist()
selected_product = None
sales_figure = None


def update_sales(state):
    _total_sales = df[df["product"] == state.selected_product]["sales"].values[0]
    _min_sales = _total_sales - 50
    _max_sales = _total_sales + 50
    _threshold_sales = _total_sales + 20

    fig = go.Figure(
        go.Indicator(
            mode="gauge+number",
            value=_total_sales,
            gauge={
                "axis": {"range": [_min_sales, _max_sales]},
                "threshold": {"line": {"color": "red", "width": 4}, "thickness": 0.75, "value": _threshold_sales},
            },
        )
    )
    state.sales_figure = fig


def on_init(state: State):
    state.selected_product = product_list[0]
    update_sales(state)


page = """
<|{selected_product}|selector|lov={product_list}|mode=radio|on_change=update_sales|>

<|chart|figure={sales_figure}|>
"""

Gui(page).run()

However, if you prefer to use the metric control, you can instead create the component in a partial. Let me know if you want an example of this