Use this reference to understand what Framework 7 Gauge Reference is for and which component-specific inspector group matters most when you configure it.
Inspector Property Groups
Gauge Properties
| Property |
Type |
Details |
| ID | text | Required in common setups.
Attribute: id |
| Type | droplist | Attribute: type
Options: Circle, Semicircle |
| Value | text | Attribute: value |
| Size | text | Attribute: size |
| Bg Color | css_color | Attribute: bg-color |
Gauge Border
| Property |
Type |
Details |
| Bg color | css_color | Attribute: border-bg-color |
| Color | css_color | Attribute: border-color |
| Width | text | Attribute: border-width |
Gauge Value
| Property |
Type |
Details |
| Text | text | Attribute: value-text |
| Text color | css_color | Attribute: value-text-color |
| Font size | text | Attribute: value-font-size |
| Font weight | text | Attribute: value-font-weight |
Gauge Label
| Property |
Type |
Details |
| Text | text | Attribute: label-text |
| Text color | css_color | Attribute: label-text-color |
| Font size | text | Attribute: label-font-size |
| Font weight | text | Attribute: label-font-weight |
Dynamic Attributes
Type
| Attribute property |
Type |
Details |
| Value: | text | Choose dynamic data binding. |
Value
| Attribute property |
Type |
Details |
| Value: | text | Choose dynamic data binding. |
Size
| Attribute property |
Type |
Details |
| Value: | text | Choose dynamic data binding. |
Bg Color
| Attribute property |
Type |
Details |
| Value: | text | Choose dynamic data binding. |
Params
| Attribute property |
Type |
Details |
| Value: | text | Choose dynamic data binding. |
