資訊專欄INFORMATION COLUMN
摘要：點擊加減號按鈕可以顯示與隱藏當前節(jié)點的子節(jié)點。源碼解析插件的寫法這里的可以取到調(diào)用時傳的參數(shù)最后附上地址歡迎
jquery插件 說明
jquery插件皆可用于react,使用方法:react中使用jquery插件
效果圖 使用方法:$(".orgWrap").lenChart({
data:obj, //數(shù)據(jù)源
drag:true, //是否可拖拽
depth:3, //初始化展示的層級
renderdata:function(data,$dom){}, //根據(jù)數(shù)據(jù)定制每個名片里面的DOM結(jié)構(gòu)
callback:function(){} //渲染完圖表后的回調(diào)函數(shù)
})
數(shù)據(jù)源格式
var obj = {
id:001,
data:{}
children:[
{
id:001,
data:{}
children:[]
},
{
id:001,
data:{}
children:[]
}
]
}
插件說明
使用遞歸的方式深層遍歷數(shù)據(jù),架構(gòu)圖第二層為橫向結(jié)構(gòu),
從第三層開始為豎向結(jié)構(gòu),解決了橫向太長的問題。
點擊加減號按鈕可以顯示與隱藏當前節(jié)點的子節(jié)點。
(function($,window,document){
$.fn.lenChart = function (options) {//這里的options可以取到調(diào)用時傳的參數(shù)
var defaults = {};
var opts = $.extend({}, defaults, options);
...
}
})(jQuery,window,document)
最后附上github地址,歡迎star
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/51214.html
摘要：點擊加減號按鈕可以顯示與隱藏當前節(jié)點的子節(jié)點。源碼解析插件的寫法這里的可以取到調(diào)用時傳的參數(shù)最后附上地址歡迎 jquery插件 說明 jquery插件皆可用于react,使用方法:react中使用jquery插件 效果圖 showImg(https://segmentfault.com/img/bVX24E?w=895&h=756); 使用方法: $(.orgWrap).lenChar...
摘要：組織架構(gòu)圖說明插件皆可用于使用方法中使用插件效果圖定制化內(nèi)容的效果圖插件說明很好的的組織架構(gòu)圖，從上到下按層級展示匯報關(guān)系支持定制化內(nèi)容，和異步加載子節(jié)點下面會講到。且在開發(fā)中，用戶希望能夠根據(jù)數(shù)據(jù)定制每一塊的內(nèi)容展示。 spacetree組織架構(gòu)圖 說明 jquery插件皆可用于react,使用方法:react中使用jquery插件 效果圖 showImg(https://segme...
摘要：組織架構(gòu)圖說明插件皆可用于使用方法中使用插件效果圖定制化內(nèi)容的效果圖插件說明很好的的組織架構(gòu)圖，從上到下按層級展示匯報關(guān)系支持定制化內(nèi)容，和異步加載子節(jié)點下面會講到。且在開發(fā)中，用戶希望能夠根據(jù)數(shù)據(jù)定制每一塊的內(nèi)容展示。 spacetree組織架構(gòu)圖 說明 jquery插件皆可用于react,使用方法:react中使用jquery插件 效果圖 showImg(https://segme...
閱讀 740·2021-11-24 10:19
閱讀 1126·2021-09-13 10:23
閱讀 3445·2021-09-06 15:15
閱讀 1788·2019-08-30 14:09
閱讀 1702·2019-08-30 11:15
閱讀 1851·2019-08-29 18:44
閱讀 949·2019-08-29 16:34
閱讀 2470·2019-08-29 12:46
