echarts交叉关系图一

想要做一个公司-人员关系图，官网echarts图graph webkit dep 稍微改了一下，

也是有点恶心自己，调了一个数据最多的去改，如果正好有人需要就不用去改了

说明：此图没有坐标，可以设置图形的向心力，可以是圆形，中间线相互交叉，

但是拖拽不能定型

var webkitDep={
    "type": "force",
    "categories": [
        {
            "name": "公司",
            "keyword": {},
            "base": "HTMLElement"
        },
        {
            "name": "主要成员",
            "keyword": {},
            "base": "WebGLRenderingContext"
        },
        {
            "name": "自然人",
            "keyword": {},
            "base": "SVGElement"
        },
        {
            "name": "实业公司",
            "keyword": {},
            "base": "CSSRule"
        }
    ],
    "nodes": [
        {
            "name": "河北XX设计有限公司",
            "value": 1,
            "category": 0
        },
        {
            "name": "石家庄XX设计有限公司",
            "value": 1,
            "category": 0
        },
        {
            "name": "河北XX创业发展有限公司",
            "value": 1,
            "category": 0
        },
        {
            "name": "河北XX置业发展有限公司",
            "value": 1,
            "category": 0
        },
        {
            "name": "石家庄XX传媒有限公司",
            "value": 1,
            "category":0
        },
        {
            "name": "河北XX实业发展有限公司",
            "value": 1,
            "category": 0
        },
        {
            "name": "赵敏雅",
            "value": 1,
            "category": 1
        },
        {
            "name": "范军",
            "value": 3,
            "category": 1
        },
        {
            "name": "孙海",
            "value": 3,
            "category": 1
        },
        {
            "name": "李博",
            "value": 3,
            "category": 1
        },
        {
            "name": "主要人员",
            "value": 3,
            "category": 2
        },
        {
            "name": "投资人",
            "value": 3,
            "category": 2
        },
        {
            "name": "法定代表人",
            "value": 3,
            "category": 2
        },
        {
            "name": "河北XX实业有限公司",
            "value": 3,
            "category": 3

        }

    ],
    "links": [
        {
            "source": 0,//建立关联关系，按从上到下的顺序，第几个节点
            "target": 6 //按从上到下的顺序，连接到第几个节点
        }, {
            "source": 1,
            "target": 6
        }, {
            "source": 2,
            "target": 6
        }, {
            "source": 2,
            "target": 7
        }, {
            "source": 3,
            "target": 8
        }, {
            "source": 4,
            "target": 7
        }, {
            "source": 5,
            "target": 7
        }, {
            "source": 6,
            "target": 10
        }, {
            "source": 7,
            "target": 10
        }, {
            "source": 6,
            "target": 11
        }, {
            "source": 7,
            "target": 11
        }, {
            "source": 8,
            "target": 11
        }, {
            "source": 12,
            "target": 8
        }, {
            "source": 9,
            "target": 11
        }, {
            "source": 13,
            "target": 12
        }, {
            "source": 13,
            "target": 10
        }, {
            "source": 13,
            "target": 11
        }
    ]
};

var mychart8 = echarts.init($("#gxt").get(0)),
    option8 = {
        legend: {
            data: ['公司', '主要成员', '自然人', '实业公司'],
            top:0,
            left:(winWidth-1200)/2, //这里是图例组件定位使用的，自定义
            itemGap:26,
            textStyle:{
                padding:[0,12]
            },
            backgroundColor:'#f5f5f5'
        },
        series: [{
            type: 'graph',//
            layout: 'force',
            animation: false,
            label: {
                normal: {
                    position: 'bottom',
                    show:true,
                    rich:{
                        bg:{
                            backgroundColor: '#f5f5f5'
                        }
                    }
                },
            },
            symbolSize:(value,params)=>{//设置图像的大小
               switch (params.data.category){
                  case 0:return 40;break;
                  case 1:return 30;break;
                  case 2:return 20;break;
                  case 3:return 30;break;
                  case 4:return 20;break;
                  default:return 10;
               }
            },
            draggable: true,
            data: webkitDep.nodes.map(function (node, idx) {
                node.id = idx;
                return node;
            }),
            categories: webkitDep.categories,
            force: {
                // initLayout: 'circular'
                // repulsion: 20,
                edgeLength: 150,
                repulsion: 50,
                gravity: 0.01
            },
            edges: webkitDep.links
        }]

    };mychart8.setOption(option8);
直接引入echarts.js 就可以了