jquery.orgchart.js是一款基于jQuery的組織結構圖插件,可以用于顯示和管理組織結構圖。想要使用jquery.orgchart.js,首先需要下載該插件的代碼。
// 下載jquery.orgchart.js的代碼 git clone https://github.com/dabeng/OrgChart.git // 或者直接下載壓縮包 https://github.com/dabeng/OrgChart/archive/master.zip
下載完成后,可以將jquery.orgchart.js文件拷貝至項目中,并在HTML中引入該文件:
<script src="jquery.orgchart.js"></script>
接著,可以使用以下代碼來生成組織結構圖:
// HTML結構 <div id="orgchart"></div> // JavaScript代碼 $('#orgchart').orgchart({ 'data' : [ { 'id': '1', 'name': 'CEO' }, { 'id': '2', 'pid': '1', 'name': 'VP1' }, { 'id': '3', 'pid': '1', 'name': 'VP2' }, { 'id': '4', 'pid': '2', 'name': 'Director1' }, { 'id': '5', 'pid': '2', 'name': 'Director2' }, { 'id': '6', 'pid': '3', 'name': 'Director3' } ] });
以上代碼會在id為orgchart的div中生成一個組織結構圖,其中CEO為根節點,下面分別有兩個VP和對應的Director。
當然,jquery.orgchart.js還有很多其他的用法和配置,可以參考官方文檔進行學習和實踐。
上一篇vue錄音單聲道
下一篇java 和手機c 效率