Meter

Meters represent the value within the known range.

<script>
    import { Meter } from 'svelte-spectre'

    let state = {
        value: 30,
        striped: true,
        animated: true,
        min: 0,
        max: 100,
        low: 30,
        high: 80,
        optimum: 90
    }
</script>

<Meter { ...state } />
© 2022 — 2023 BASF SE

API Meter

value: number = 0
Current numeric value
any number
min: number = 0
The lower numeric bound of the measured range.
any number
max: number = 100
The upper numeric bound of the measured range.
any number
low: number = 26
The upper numeric bound of the low end of the measured range.
any number
high: number = 51
The lower numeric bound of the high end of the measured range.
any number
optimum: number = 90
This attribute indicates the optimal numeric value.
any number
striped: boolean
Striped indicator.
true | false
animated: boolean
Striped animated indicator.
true | false
progress: boolean
Striped indicator like progress value
true | false