JS圖表控件FusionCharts使用教程：在圖表標繪非連續數據

---

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

》》》免費下載Flash圖表控件FusionCharts最新版

用戶可以通過不提供任何值到需要隱藏的相應<set>元素來隱藏任意數量的數據塊。

具體操作參考下面的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月的數據。所以,我們不提供任何相應的數據值。如下圖所示:

可以看到在這張圖表中沒有5月和6月的列。

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

折線圖在5月和6月的位置處是一個斷開,因為沒有對同一個區域賦值。如果用戶連缺失數據的數據標簽都沒有，可以編寫缺失數據的空集元素如下:

<set/>

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

在上面的折線圖中,在5月和6月的地方顯示的是一個斷開。如果用戶不想顯示5月和6月的這個斷開,希望從4月直接連接到7月,那么可以使用新引入的connectNullData屬性。

你只需要設置<chart ... connectNullData='1' ..> ，圖表將如下所示:

這個屬性對所有的線和面積圖都是有效的。

圖表的完整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'>

改為

<chart  showValues='0'  connectNullData='1'  lineDashGap='6'>

即可。

將生成以下圖表：