fusioncharts儀表盤重要屬性解析


<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下面
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章