天天看點

同步Flex Chart的資料提示

圖表資料提示的同步不僅包含單個圖表内多個系列的資料提示的同步,也包含多個圖表的資料提示的同步。有時圖表縱軸的數值差别太大,放在一個 Chart中顯示為多個系列不太合适。一種辦法是使用多個縱軸,但軸多了界面會亂。另外一種辦法是将不同的系列放在不同的Chart中顯示。這種方法更常 用,但多個圖表的資料提示同步相對比較麻煩。

首先應該實作滑鼠橫向跟蹤的功能:在整個繪圖區都能顯示資料提示,隻要給定坐标的橫軸值與目标資料點橫軸值相同,就能跟蹤到滑鼠指針下最近的資料點 提示。要實作這一功能,最好的方法是覆寫 findDataPoints方法。隻需要改寫dist變量的算法即可:var dist:Number = (v.x – x)*(v.x – x);隻用橫軸值來計算,是以能沿橫軸跟蹤;覆寫前是var dist:Number = (v.x – x)*(v.x – x) + (v.y – y)*(v.y -y);用了橫縱軸值來計算,是以隻有當滑鼠指針移動到目标資料點上時,才能顯示資料點提示。好了,測試一下滑鼠橫向跟蹤功能。如果圖表中有多個系列,可 以看到此時圖表内部的資料提示是同步的。

1

2

3

4

5

6

7

8

9

<code>public</code> <code>function</code> <code>addDataTip(data:</code><code>Object</code><code>, index:</code><code>int</code><code>):</code><code>void</code><code>{</code>

<code>  </code><code>var</code> <code>item:LineSeriesItem =</code><code>new</code> <code>LineSeriesItem(</code><code>this</code><code>, data, index);</code>

<code>  </code><code>var</code> <code>arr:</code><code>Array</code> <code>=</code><code>new</code> <code>Array</code><code>();</code>

<code>  </code><code>arr.push(item);</code>

<code>  </code><code>this</code><code>.dataTipItems = arr;</code>

<code>}</code>

<code>public</code> <code>function</code> <code>removeDataTip():</code><code>void</code><code>{</code>

<code>  </code><code>this</code><code>.dataTipItems = [];</code>

滑鼠指移進圖表時,其它圖表的系列調用addDataTip方法來新增資料提示;滑鼠指移出圖表時,其它圖表的系列調用removeDataTip方法來删除資料提示,進而同步多個Flex chart的資料提示。

繼續閱讀