Number Card

Card type: number

The number card displays a number with an optional unit and formatting options.

In addition to the common parameters the number card has the following configuration options:

Name	Type	Required	Default	Description
`value`	int or float	Yes	-	The value to be displayed.
`unit`	str	No	-	Text to be displayed under the number (e.g. `%` or `€`).
`locales`	str	No	-	Unicode locale identifier (e.g. `DE`).
`format`	dict	No	-	Number formatting options (See below)
`description`	str	No	-	Extra text to be displayed above the value. Hidden when the card is too small.
`fontSize`	str	No	-	Custom font size to override automatic sizing (e.g. `"2rem"`, `"24px"`, `"150%"`).
`textAlign`	str	No	`"right"`	Alignment of the number and unit text. Can be `"left"`, `"center"`, or `"right"`.

`format` parameter

The format parameter can be used to customize the number formatting, following the Intl.NumberFormat options. Here are some commonly-used options:

Name	Type	Required	Default	Description
`style`	str	No	`"decimal"`	The number style to use. Can be `"decimal"` (plain number formatting), `"currency"`, `"percent"`, or `"unit"`.
`currency`	str	No	-	The currency to use if the `style` is `"currency"`. ISO currency codes, e.g. `"EUR"`, `"USD"`, `"GBP"`, etc.
`useGrouping`	bool	No	`False`	Whether to use grouping separators (e.g. `1,000` instead of `1000`).
`minimumFractionDigits`	int	No	`0`	Minimum number of decimal places to display.
`maximumFractionDigits`	int	No	`2`	Maximum number of decimal places to display.
`minimumSignificantDigits`	int	No	-	Minimum number of significant digits to display.
`maximumSignificantDigits`	int	No	-	Maximum number of significant digits to display.
`trailingZeroDisplay`	str	No	`"auto"`	Whether to display trailing zeros. Can be `"auto"` (default), `"stripIfInteger"` (remove fraction digits if they are all zero)

Examples

Basic number card


datacards.publish.card(
    type='number',
    value=42,
    label='Number',
    description='Description',
    unit='Unit',
    logic_view_size=(2,1)
)

Number card (financial)

An example of a number card formatted for financial purposes.

Currency formatting with € symbol
Grouping separators according to German conventions
Reduced font size


datacards.publish.card(
    type='number',
    value=1321321,
    label='Turnover',
    description='',
    unit='',
    logic_view_size=(2,1),
    locales="DE",
    format={"useGrouping": True, "style": "currency", "currency": "EUR", "trailingZeroDisplay": 'stripIfInteger'},
    font_size="0.75rem"
)

Number card (percent)

A number card formatted with percent style and 1 decimal place. (Default is 2 decimal places).


datacards.publish.card(
    type='number',
    value=0.42312,
    label='Number',
    description='',
    unit='',
    logic_view_size=(2,1),
    format={"style": "percent", "maximumFractionDigits": 1}
)