懒加载数据会导致箭头消失,只能自定义箭头
层次图:dagre
折线:polyline
设置endArrow:true
接口懒加载数据,执行 this.graph.read(this.graphData); this.graph.zoom(0.6);
箭头消失,需自定义箭头
空心箭头,fill失效导致样式不美观。所以自定义内置箭头一样的样式
layout: {type: "dagre",rankdir: "LR",begin: [60, 20],// align: "UL",nodesep: 10,ranksep: 30},defaultNode: {type: "rect",size: [300, 230],shape: "rect",labelCfg: {style: {fill: "#fff",fontSize: 14}}},defaultEdge: {type: "polyline",style: {endArrow: {// 自定义箭头指向(0, 0),尾部朝向 x 轴正方向的 pathpath: "M0,-4 L6,0 L0,4",d: 14,fill: "#ccc",opacity: 0.8},lineWidth: 2,stroke: "#ccc",radius: 10,offset: 10,curveOffset: 10}}