1. 程式人生 > >highcharts外掛中,在外部點選一個按鈕或者別的時間,可以連結highcharts上點選事件

highcharts外掛中,在外部點選一個按鈕或者別的時間,可以連結highcharts上點選事件

我是用highcharts外掛來寫這種曲線圖或者折線圖或者面積曲線圖,由於需要背景顏色和曲線,就用到了面積曲線圖。


1,資料是動態獲取的,在demo中,直接現將資料寫成靜態資料,後面將會獲取動態資料,這個應該很簡單。在需求中,有八組資料,但是不需要顯示前面一個數據和後面一個數據,那類似就可以給這個 寬度是120% ,只顯示100%,居中就可以。寬度還需要動態的去適配,這只是個例子。

2,highcharts點選事件,點選線上的點可以進行事件處理,我這邊只執行了一個alert事件,具體的因人而異。


3,highcharts中y軸上的座標移動到第二個月上。即y軸線以為。可以在yAxis屬性上設定labels,align根據left或者right定位,x和y是px的單位,這個或許需要動態的根據螢幕或者hightcharts的寬度來進行設定。


4,x軸網格線和y軸網格線。是用gridLineWidth來表示寬度,如果不想要網格線可以直接設定為0。

下方的labels中categories是我放置動態資料的陣列。


5,外部點選按鈕,控制highcharts點選圖示座標。

一開始想,在外部控制點選事件肯定要獲取到hightcharts的內容屬性或者物件的。(顯而易見,這個方向是對的。)

先將highcharts物件(後用chart來稱呼)獲取到。

chart物件有很多屬性值,先擷取一部分

那麼多屬性由於沒有資料或者文件,我只能一個一個的去點開看他們的內容,哎呀,然後就找到了options這個Obj,哈哈哈,終於讓我找到了。

在這個裡面所有的屬性都好面熟 啊。噹噹噹,其中就有我放置alert的series,他在這裡是一個數組。


這裡直接呼叫裡面的click事件就行了。