Flash圖表控件FusionCharts如何在圖表標繪非連續數據

你可能常常要以不完整的數據點繪製圖表。例如,當繪製每個月的銷售圖表時,你可能沒有全部的月數據。因此,你可能只想以一個空白的區域來顯示缺失的數據,不在這個區域中繪製任何東西。FusionCharts能夠讓這個目標很容易的實現。 spa

用戶能夠經過不提供任何值到須要隱藏的相應<set>元素來隱藏任意數量的數據塊。 code

具體操做參考下面的XML代碼: xml

<chart >
    <set label='Jan' value='420' />
    <set label='Feb' value='295' />
    <set label='Mar' value='523' /> 
    <set label='Apr' value='473' /> 
    <set label='May' /> 
    <set label='Jun' /> 
    <set label='Jul' value='354' /> 
    <set label='Aug' value='457' /> 
    <set label='Sep' value='127' /> 
    <set label='Oct' value='354' /> 
    <set label='Nov' value='485' /> 
    <set label='Dec' value='486' /> 
</chart>

 

在這裏,咱們沒有5月和6月的數據。因此,咱們不提供任何相應的數據值。以下圖所示: io



 

能夠看到在這張圖表中沒有5月和6月的列。 class

若是對一個折線圖運行相同的數據,用戶將看到如下輸出效果:

 
im

折線圖在5月和6月的位置處是一個斷開,由於沒有對同一個區域賦值。若是用戶連缺失數據的數據標籤都沒有,能夠編寫缺失數據的空集元素以下: 數據

<set/>

如何在圖表中鏈接空集數據 圖表

在上面的折線圖中,5月和6月的地方顯示的是一個斷開。若是用戶不想顯示5月和6月的這個斷開,但願從4月直接鏈接到7,那麼能夠使用新引入的connectNullData屬性。 img

你只須要設置<chart ... connectNullData='1' ..> ,圖表將以下所示:

 
chart

這個屬性對全部的線和麪積圖都是有效的。

圖表的完整XML數據再次重現:

<chart showValues='0' connectNullData='1'>
      <set label='Jan' value='420' />
      <set label='Feb' value='295' />
      <set label='Mar' value='523' />
      <set label='Apr' value='473' />
      <set label='May' /> 
      <set label='Jun' />
      <set label='Jul' value='354' />
      <set label='Aug' value='457' />
      <set label='Sep' value='127' />
      <set label='Oct' value='354' />
      <set label='Nov' value='485' />
      <set label='Dec' value='486' />
  </chart>

 

或者,若是用戶想在鏈接的時候突出下這個斷開,您能夠使用虛線特性,以下所示:

<chart showValues='0' connectNullData='1' lineDashGap='6'>
      <set label='Jan' value='420' />
      <set label='Feb' value='295' />
      <set label='Mar' value='523' />
      <set label='Apr' value='473' />
      <set label='May' />
      <set label='Jun' />
      <set label='Jul' value='354' />
      <set label='Aug' value='457' />
      <set label='Sep' value='127' />
      <set label='Oct' value='354' />
      <set label='Nov' value='485' />
      <set label='Dec' value='486' />
  </chart>

將生成如下圖表:

相關文章
相關標籤/搜索