组织架构树形图
一、说明 (1)通过后台查询 数据库 ,生成树形数组结构,返回到前台。 (2)需要引入的js插件和css文件: ①jquery.jOrgChart.css ②jquery.min.js ③jquery.jOrgChart.js (3)使用jOrgChart插件,根据返回的数据将其子节点加入到相应的<li></li>中。 首先,我们的数据表应该要有 id(节点),pid(父节点的id),name的字段, 那么我们要把这个数组转为树形数组结构,即将各个元素放在 pid 父类元素的 childrens字段中,下面就是简单生成树形数组的代码。至于展示出来的样式,可以在html页面中添加自定义样式覆盖它之前的样式。 注意: 后台返回的数据格式必须如下,其中id,pid字段为必须要有。childrens字段也为必须的,不过字段名可以自己定义,name字段是根据自己业务需求的字段,在这里以name字段作为要显示的文本内容: { "data": [{ "id": 1, "name": "企业主体信用得分", "pid": null, "childrens": [ { "id": 2, "name": "企业素质", "pid": 1, "childrens": [ { "id": 5, "name": "基本信息", "pid": 2, "childrens": [ { "id":