# Create circular progress bar component

**URL:** <https://forum.inductiveautomation.com/t/create-circular-progress-bar-component/19510>\
**Category:** Ignition\
**Created:** [September 4, 2018, 3:40am UTC](https://forum.inductiveautomation.com/t/create-circular-progress-bar-component/19510 "2018-09-04T03:40:27Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![nader.chinichian](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nader.chinichian/32/9261_2.png) [@nader.chinichian](https://forum.inductiveautomation.com/u/nader.chinichian)\
**Post date:** [September 4, 2018, 3:40am UTC](https://forum.inductiveautomation.com/t/create-circular-progress-bar-component/19510/1 "2018-09-04T03:40:27Z")

</div>

Hi  
I’m very new to ignition. I’d like to is it possible to create create circular progress bar component in ignition from scratch?

thanks.

---

<div class="post-metadata">

**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:** [September 4, 2018, 11:39am UTC](https://forum.inductiveautomation.com/t/create-circular-progress-bar-component/19510/3 "2018-09-04T11:39:52Z")

</div>

> [@How to make a circular progress component?](http://forum.inductiveautomation.com/t/how-to-make-a-circular-progress-component/10022/3):
>
> All right, I knew I couldn’t leave it alone! laughing 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. wink[JC Custom Pallette\_2015-05-14\_1246.proj](https://us1.discourse-cdn.com/inductiveautomation/original/2X/0/027f83a8b1bfd91ddd035f28432a011b3c7044ae.proj) (8.25 KB)

---

<div class="post-metadata">

**Author:** ![zxcslo](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/zxcslo/32/61610_2.png) [@zxcslo](https://forum.inductiveautomation.com/u/zxcslo)\
**Post date:** [September 5, 2018, 7:42am UTC](https://forum.inductiveautomation.com/t/create-circular-progress-bar-component/19510/4 "2018-09-05T07:42:30Z")

</div>

This is what I've done in paintable canvas...

> [@Canvas circular meter/gauge](http://forum.inductiveautomation.com/t/canvas-circular-meter-gauge/14800):
>
> I like very much this circular meters/gauges which you can see almost every where… I would very much like to have something like this in Ignition. I was trying to do something with the canvas, but I’m not java ‘person’ and it’s a ‘little’ too much for me. Is there any ‘brave’ soul who would try to do something like this in Ignition: [http://thecodeplayer.com/walkthrough/make-gauge-charts-using-canvas-and-javascript](http://thecodeplayer.com/walkthrough/make-gauge-charts-using-canvas-and-javascript) I think everybody would like and use this…

---

<div class="post-metadata">

**Author:** ![MMaynard](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/mmaynard/32/3366_2.png) [@MMaynard](https://forum.inductiveautomation.com/u/MMaynard)\
**Post date:** [September 5, 2018, 12:47pm UTC](https://forum.inductiveautomation.com/t/create-circular-progress-bar-component/19510/5 "2018-09-05T12:47:57Z")

</div>

Have any of you looked at the Dial indicator in the cloud templates?  
We modified it to be a template for 0 to 100% output.

 ![](https://us1.discourse-cdn.com/inductiveautomation/original/2X/d/df3142bce51cf4fbefc523269e1134981fa75229.PNG)