我要评论
<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 属性资料的整理，后续继续补充相关资料，谢谢大家对本站的支持！
您可能感兴趣的文章:
如您对本文有疑问或者有任何想说的，请点击进行留言回复，万千网友为您解惑！
网友评论