Circular progress
A circular progress that would display current progress compare to total
Name | Description |
---|---|
component | circular-progress |
text | text label to display to the right of the progress |
options | see options below |
Options
Name | Description |
---|---|
value | double value between 0 and 1 that show the overall progress |
max | double max value |
color | redgreen, blue , progress color |
fillColor | color of the progress circle |
display | percent, value, no-progress , how to display the value in the circular progress, if not provided, display nothing. If no-progress , value is displayed but there is no progress indicator |
radius | double, radius of the progress, can be null |
lineWidth | double, width of the current progress circle |
Example
{
"component": "circular-progress",
"text": "Today's tasks",
"options": {
"value": "{$sources.taskProgress.values.progress}",
"display": "percent"
},
"styles": {
"root": {
"padding": "10px 0px"
},
"header": {
"fontWeight": "bold"
}
}
}