# circel gauge
## properties
1. Value(Number) - 仪表的值。
<figure style="text-align: center;">

![仪表-Value适用结果][gauge-circle-02]  
<figurecaption>(value: 85)</figurecaption>
</figure>

2. startValue - 仪表的起始值。
<figure style="text-align: center;">

![仪表-BackgroundColor适用结果][gauge-circle-03]  
<figurecaption>(startValue: 10)</figurecaption>
</figure>

3. endValue - 仪表的最终值。
<figure style="text-align: center;">

![仪表-BackgroundColor适用结果][gauge-circle-04]  
<figurecaption>(endValue: 120)</figurecaption>
</figure>

4. step - 仪表的刻度间隔。
<figure style="text-align: center;">

![仪表-BackgroundColor适用结果][gauge-circle-05]  
<figurecaption>(step: 30)</figurecaption>
</figure>

5. stepTextSize - 仪表的刻度文本大小。
<figure style="text-align: center;">

![仪表-BackgroundColor适用结果][gauge-circle-06]  
<figurecaption>(stepTextSize: 10)</figurecaption>
</figure>

6. subStep - 仪表的刻度之间间隔。
<figure style="text-align: center;">

![仪表-BackgroundColor适用结果][gauge-circle-07]  
<figurecaption>(subStep: 10)</figurecaption>
</figure>

7. stepNeedleSize - 仪表的刻度大小。
<figure style="text-align: center;">

![仪表-BackgroundColor适用结果][gauge-circle-08]  
<figurecaption>(stepNeedleSize: 3)</figurecaption>
</figure>

8. startAngle - 仪表的起始角度。以12点方向为标准，向顺时针方向增加。 如果是负数，就会是反方向。
<figure style="text-align: center;">

![仪表-BackgroundColor适用结果][gauge-circle-09]  
<figurecaption>(startAngle: -90)</figurecaption>
</figure>

9. endAngle - 仪表的最终角度。以12点方向为标准，向顺时针方向增加。 如果是负数，就会是反方向。
<figure style="text-align: center;">

![仪表-BackgroundColor适用结果][gauge-circle-10]  
<figurecaption>(endAngle: 90)</figurecaption>
</figure>

10. textFillStyle - 仪表的刻度文本颜色。
<figure style="text-align: center;">

![仪表-BackgroundColor适用结果][gauge-circle-11]  
<figurecaption>(textFillStyle: #ec5324)</figurecaption>
</figure>

11. needleFillStyle - 仪表的针色。
<figure style="text-align: center;">

![仪表-BackgroundColor适用结果][gauge-circle-12]  
<figurecaption>(needleFillStyle: #ec5324)</figurecaption>
</figure>

12. innerCircleFillStyle - 仪表指针的圆的颜色。
<figure style="text-align: center;">

![仪表-BackgroundColor适用结果][gauge-circle-13]  
<figurecaption>(innerCircleFillStyle: #ec5324)</figurecaption>
</figure>

13. stepFillStyle - 仪表指针的颜色。
<figure style="text-align: center;">

![仪表-BackgroundColor适用结果][gauge-circle-14]  
<figurecaption>(stepFillStyle: #ec5324)</figurecaption>
</figure>

14. colorStops - 仪表的各个区间的颜色。可以通过双击而添加区间，也可以向下拖动标记而删除区间。
<figure style="text-align: center;">

![仪表-BackgroundColor适用结果][gauge-circle-15]  
<figurecaption>(colorStops: <img src="../images/color-stops-value.png"
</figure>

15. showStartValue - 决定是否显示仪表的起始值。
<figure style="text-align: center;">

![仪表-BackgroundColor适用结果][gauge-circle-16]  
<figurecaption>(showStartValue: unchecked)</figurecaption>
</figure>

16. showEndValue - 决定是否显示仪表的最终值。
<figure style="text-align: center;">

![仪表-BackgroundColor适用结果][gauge-circle-17]  
<figurecaption>(showEndValue: unchecked)</figurecaption>
</figure>

17. showStepLine - 决定是否显示仪表的刻度。
<figure style="text-align: center;">

![仪表-BackgroundColor适用结果][gauge-circle-18]  
<figurecaption>(showStepLine: unchecked)</figurecaption>
</figure>

18. showStepText - 决定是否显示仪表的刻度值。
<figure style="text-align: center;">

![仪表-BackgroundColor适用结果][gauge-circle-19]  
<figurecaption>(showStepText: unchecked)</figurecaption>
</figure>

19. showSubStep - 决定是否显示仪表的分刻度。
<figure style="text-align: center;">

![仪表-BackgroundColor适用结果][gauge-circle-20]  
<figurecaption>(showSubStep: unchecked)</figurecaption>
</figure>

20. inText - 决定仪表的刻度值的位置。（checked：内部，unchecked：外部）
<figure style="text-align: center;">

![仪表-BackgroundColor适用结果][gauge-circle-21]  
<figurecaption>(inText: unchecked)</figurecaption>
</figure>


[gauge-circle-01]: ../images/gauge-circle-01.png
[gauge-circle-02]: ../images/gauge-circle-02.png
[gauge-circle-03]: ../images/gauge-circle-03.png
[gauge-circle-04]: ../images/gauge-circle-04.png
[gauge-circle-05]: ../images/gauge-circle-05.png
[gauge-circle-06]: ../images/gauge-circle-06.png
[gauge-circle-07]: ../images/gauge-circle-07.png
[gauge-circle-08]: ../images/gauge-circle-08.png
[gauge-circle-09]: ../images/gauge-circle-09.png
[gauge-circle-10]: ../images/gauge-circle-10.png
[gauge-circle-11]: ../images/gauge-circle-11.png
[gauge-circle-12]: ../images/gauge-circle-12.png
[gauge-circle-13]: ../images/gauge-circle-13.png
[gauge-circle-14]: ../images/gauge-circle-14.png
[gauge-circle-15]: ../images/gauge-circle-15.png
[gauge-circle-16]: ../images/gauge-circle-16.png
[gauge-circle-17]: ../images/gauge-circle-17.png
[gauge-circle-18]: ../images/gauge-circle-18.png
[gauge-circle-19]: ../images/gauge-circle-19.png
[gauge-circle-20]: ../images/gauge-circle-20.png
[gauge-circle-21]: ../images/gauge-circle-21.png
