AngularGauge property analysis detailed explanation

<Chart bgColor='FFFFFF' upperLimit='120' lowerLimit='0' baseFontColor='666666' majorTMNumber='10' majorTMColor='666666' majorTMHeight='8' minorTMNumber='5' minorTMColor='666666' minorTMHeight='3' pivotRadius='10' showGaugeBorder='0' gaugeOuterRadius='100' gaugeInnerRadius='90' gaugeOriginX='170' gaugeOriginY='170' gaugeScaleAngle='220' displayValueDistance='20' placeValuesInside='1' gaugeFillMix='' pivotFillMix='{F0EFEA}, {BEBCB0}' pivotBorderColor='BEBCB0' pivotfillRatio='80,50' showShadow='0'>  <colorRange>    <color minValue='0' maxValue='84' code='00FF00' alpha='0'/>    <color minValue='80' maxValue='100' name='Danger' code='FF0000' alpha='50'/>  </colorRange>  <dials>  <dial value='50' bordercolor='#FF3333' bgColor='bebcb0, f0efea, bebcb0' borderAlpha='0' baseWidth='10' topWidth='3'/>  </dials>    <annotations>    <annotationGroup xPos='170' yPos='170' fillRatio='10,125,254' fillPattern='radial' >    <!-- Draw the upper White Rounded Border -->      <annotation type='circle' xPos='0' yPos='0' radius='150' borderColor= 'bebcb0' fillAsGradient='1' fillColor='f0efea, bebcb0' fillRatio='85,15'/>      <annotation type='circle' xPos='0' yPos='0' radius='140' fillColor='bebcb0, f0efea' fillRatio='85,15' />      <annotation type='circle' xPos='0' color='FFFFFF' yPos='0' radius='140' borderColor= 'f0efea' />    </annotationGroup>  </annotations></Chart>

-------------------------仪表盘重要属性解析-----------------------

根节点<Chart 属性：

upperLimit='120' --刻度值上限

lowerLimit='0' --刻度值下限

Limits='0/1' --是否显示极限值

baseFontColor='#FF3333' --刻度值字体颜色

majorTMNumber='12' --需要将仪表盘分成的等份值

majorTMColor='#FF3333' --刻度线的颜色

majorTMHeight='8' --刻度线的长度

minorTMNumber='5' --仪表盘刻度线间小刻度线的数量

minorTMColor='#FF3333' --仪表盘刻度线间小刻度线颜色

minorTMHeight='5' --仪表盘刻度线间小刻度线长度

pivotRadius='20' --针心圆半径

showGaugeBorder='1' --是否显示刻度盘边框

gaugeOuterRadius='130' --刻度盘外围半径

gaugeInnerRadius='110' --刻度盘内围半径

gaugeOriginX='170' --刻度盘圆心X坐标

gaugeOriginY='170' --刻度盘圆心Y坐标

gaugeScaleAngle='200' --刻度盘比例（度数）

displayValueDistance='20' --显示值与刻度线的距离

placeValuesInside='1' --显示值是否位于刻度盘的内部

gaugeFillMix='' --刻度盘颜色是否混合

pivotFillMix='{F0EFEA}, {BEBCB0}' --仪表盘轴心是否混合

pivotBorderColor='BEBCB0' --轴心边框颜色

pivotfillRatio='80,50' --轴心比率

showShadow='0' --是否显示阴影

颜色范围：

<colorRange>

<color minValue='0' maxValue='84' code='00FF00' alpha='0'/>

<color minValue='80' maxValue='100' name='Danger' code='FF0000' alpha='50'/>

</colorRange>

此节点的原理及应用：

通过两种不同的颜色拼接成刻度盘底色，可用于提醒指示到一定区域了；

转盘：

<dials>

<dial value='50' bordercolor='#FF3333' bgColor='bebcb0, f0efea, bebcb0' borderAlpha='0' baseWidth='10' topWidth='3'/>

</dials>

value='50' --指针指示值

borderAlpha='10' --指针边线的颜色深度

baseWidth='10' --只针的宽度

topWidth='3' --指针尖端的宽度

仪表盘外围控件：

<annotations> <annotationGroup xPos='170' yPos='170' fillRatio='225,225,254' fillPattern='radial' Alpha='11' > <annotation type='circle' xPos='0' yPos='0' radius='150' borderColor= 'bebcb0' fillAsGradient='1' fillColor='f0efea, bebcb0' fillRatio='85,15'/> <annotation type='circle' xPos='0' yPos='0' radius='140' fillColor='bebcb0, f0efea' fillRatio='85,15' /> <annotation type='circle' xPos='0' yPos='0' radius='140' borderColor= 'f0efea' color='FFFFFF'/>

<chart bgAlpha='0' bgColor='FFFFFF' lowerLimit='0' upperLimit='100' numberSuffix='%25' showBorder='0' basefontColor='FFFFDD' chartTopMargin='25' chartBottomMargin='25' chartLeftMargin='25' chartRightMargin='25' toolTipBgColor='80A905' gaugeFillMix='{dark-10},FFFFFF,{dark-10}' gaugeFillRatio='3'>  <colorRange>   <color minValue='0' maxValue='45' code='FF654F'/>   <color minValue='45' maxValue='80' code='F6BD0F'/>   <color minValue='80' maxValue='100' code='8BBA00'/>  </colorRange>  <dials>   <dial value='92' rearExtension='10'/>  </dials>  <trendpoints>   <point value='50' displayValue='Average' fontcolor='FF4400' useMarker='1' dashed='1' dashLen='2' dashGap='2' valueInside='1' />  </trendpoints>  <!--Rectangles behind the gauge -->  <annotations>   <annotationGroup id='Grp1' showBelow='1' >     <annotation type='rectangle' x='5' y='5' toX='345' toY='195' radius='10' color='009999,333333' showBorder='0' />   </annotationGroup>  </annotations>  <styles>   <definition>     <style name='RectShadow' type='shadow' strength='3'/>   </definition>   <application>     <apply toObject='Grp1' styles='RectShadow' />   </application>  </styles></chart>

-------------------------仪表盘重要属性解析-----------------------

<chart

numberSuffix='%25' --数值后缀%

chartTopMargin='25' --到容器顶端的距离

chartBottomMargin='25' --到容器底端的距离

chartLeftMargin='25' --到容器左端的距离

chartRightMargin='25' --到容器右端的距离

gaugeFillRatio='11' --刻度盘背景颜色比例

<annotationGroup showBelow='1' --显示在XX下面

以上就是对AngularGauge 属性资料的整理，后续继续补充相关资料，谢谢大家对本站的支持！