資訊專欄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://specialneedsforspecialkids.com/yun/85179.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...
閱讀 1751·2021-09-23 11:34
閱讀 2472·2021-09-22 15:45
閱讀 12821·2021-09-22 15:07
閱讀 2221·2021-09-02 15:40
閱讀 4107·2021-07-29 14:48
閱讀 1071·2019-08-30 15:55
閱讀 3245·2019-08-30 15:55
閱讀 2190·2019-08-30 15:55
