# How to make a circular progress component? **URL:** \ **Category:** Ignition\ **Created:** [May 14, 2015, 2:32pm UTC](https://forum.inductiveautomation.com/t/how-to-make-a-circular-progress-component/10022 "2015-05-14T14:32:31Z")\ **Posts on this page:** 8\ **Page:** 1
**Author:** ![rchung](https://avatars.discourse-cdn.com/v4/letter/r/e19adc/32.png) [@rchung](https://forum.inductiveautomation.com/u/rchung)\ **Post date:** [May 14, 2015, 2:32pm UTC](https://forum.inductiveautomation.com/t/how-to-make-a-circular-progress-component/10022/1 "2015-05-14T14:32:31Z")
I want to make a circular component to display analog value, similar to the built-in “Level Indicator” component but I want to use a circle instead. The color of the outer circle will fill based on the value, let’s say, from 0 to 100%. I have attached a picture of what I have in mind. Any suggestion will be greatly appreciated. ![](https://us1.discourse-cdn.com/inductiveautomation/original/2X/9/982a935c6d4f20b76886bd4e4f364f7fbbde4836.jpg) ---
**Author:** ![JordanCClark](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/jordancclark/32/83362_2.png) [@JordanCClark](https://forum.inductiveautomation.com/u/JordanCClark)\ **Post date:** [May 14, 2015, 3:50pm UTC](https://forum.inductiveautomation.com/t/how-to-make-a-circular-progress-component/10022/2 "2015-05-14T15:50:58Z")
Hi, welcome to the forums! This was done using (from bottom to top): -A pie chart -A circle -A label ![](https://us1.discourse-cdn.com/inductiveautomation/original/2X/9/963e24f9bb6df406680469a9c54ed06de92f2867.PNG) The label has a custom property called progress. In the attached window you can import into your project, this is bound to a timer component. As the value changes, a propertyChange event script runs to update the values in the pie chart. This will need to be in Preview Mode in the Designer for it to work (the scripts won’t run otherwise!). [Circular Progress Meter\_2015-05-14\_1110.proj](https://us1.discourse-cdn.com/inductiveautomation/original/2X/f/fc68c5359dada579135069f0d0de57d44dd0c3af.proj) (14.1 KB) ---
**Author:** ![JordanCClark](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/jordancclark/32/83362_2.png) [@JordanCClark](https://forum.inductiveautomation.com/u/JordanCClark)\ **Post date:** [May 14, 2015, 4:53pm UTC](https://forum.inductiveautomation.com/t/how-to-make-a-circular-progress-component/10022/3 "2015-05-14T16:53:23Z")
All right, I knew I couldn’t leave it alone! 😆 Redid it so that it can be used as a group (also moved custom properties and scripts to the group). Also popped it into a custom pallet, which is attached. 😉 [JC Custom Pallette\_2015-05-14\_1246.proj](https://us1.discourse-cdn.com/inductiveautomation/original/2X/0/027f83a8b1bfd91ddd035f28432a011b3c7044ae.proj) (8.25 KB) ---
**Author:** ![bmeyers](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/bmeyers/32/37453_2.png) [@bmeyers](https://forum.inductiveautomation.com/u/bmeyers)\ **Post date:** [February 7, 2022, 4:17pm UTC](https://forum.inductiveautomation.com/t/how-to-make-a-circular-progress-component/10022/4 "2022-02-07T16:17:06Z")
1. Is it possible to import this project resource into Ignition 8.1.1? 2. Where does the imported resource get placed in the project? ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/0/e/0eb3e6922e57cff96d371a6c89de59f84c2b3b40.png) I have not been able to figure out how to use this resource… ---
**Author:** ![JordanCClark](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/jordancclark/32/83362_2.png) [@JordanCClark](https://forum.inductiveautomation.com/u/JordanCClark)\ **Post date:** [February 7, 2022, 4:43pm UTC](https://forum.inductiveautomation.com/t/how-to-make-a-circular-progress-component/10022/5 "2022-02-07T16:43:02Z")
Huh. The import works, But the pallette doesn’t show. 😢 Here’e the sample window with the grouping. [CircularProgressMeter\_2022-02-07\_1134.zip](https://forum.inductiveautomation.com/uploads/short-url/7PYEoD5rvJBAKOoC910oaIdUrc7.zip) (11.2 KB) ---
**Author:** ![paul-griffith](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/paul-griffith/32/37249_2.png) [@paul-griffith](https://forum.inductiveautomation.com/u/paul-griffith)\ **Post date:** [February 7, 2022, 4:43pm UTC](https://forum.inductiveautomation.com/t/how-to-make-a-circular-progress-component/10022/6 "2022-02-07T16:43:09Z")
Something appears to have regressed with custom palette import… ---
**Author:** ![JordanCClark](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/jordancclark/32/83362_2.png) [@JordanCClark](https://forum.inductiveautomation.com/u/JordanCClark)\ **Post date:** [February 7, 2022, 4:43pm UTC](https://forum.inductiveautomation.com/t/how-to-make-a-circular-progress-component/10022/7 "2022-02-07T16:43:48Z")
I’ll start a new thread for that. ---
**Author:** ![bmeyers](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/bmeyers/32/37453_2.png) [@bmeyers](https://forum.inductiveautomation.com/u/bmeyers)\ **Post date:** [February 7, 2022, 4:46pm UTC](https://forum.inductiveautomation.com/t/how-to-make-a-circular-progress-component/10022/8 "2022-02-07T16:46:14Z")
Thanks, this resource works just fine for my purposes.