【JS套件 - jqplot】進行ing－凱開 x 慵懶日子

jqplot

其實有同事也有在使用D3包過的，聽說好像也是不錯耶!!!但她說我的既然已經弄出來了，就使用jqplot吧!

網路有可以搜尋很多jqplot跟D3比較的文章。

好吧，總之我就是使用jqplot了，這東西也有好幾年了也有在持續更新。

因為我要一頁顯示很多個趨勢圖，所以我另外寫個function

html 部分

1. 先把該要有的檔案載進來

2. 有個區塊置入jqplot的趨勢圖

JS 部分

其實data我是用ajax產出的，因為要多個趨勢圖，所以也搭配不同id(看自己要怎麼設計)

$(document).ready(function () {

var id = 'char1';

var data = [['2015', '3'], ['2016', '10']];

plotchart(id,data);

function plotchart (id, data){

}

});

Q. 遭遇到的問題，趨勢圖y軸看不到資料

1. 如果有固定的最大值，可以直接設定yaxis裡頭的max

2. 因為我是動態產出，所以另外寫個function去計算data裡面的最大值。

備註：有更好的辦法請提供一下阿，覺得現在寫的邏輯可能還沒那麼好

function get_jqplot_range(data) {
var vals = [];

$.each(data, function (key, value) {
if (value[1]) {
vals.push(parseFloat(value[1]));
}
});

var max = Math.max.apply(null, vals);

if (max) {
return max;
}
}

Kaikai凱開

凱開 x 慵懶日子

Kaikai凱開發表在痞客邦留言(0) 人氣()

E-mail轉寄

凱開 x 慵懶日子