echarts画关系图,指定有的关系为双向箭头,有的关系为单向箭头

echarts关系图里 有箭头、无箭头、双箭头连线同时存在

首先series里面设置 edgeSymbol: [‘arrow’, ‘arrow’],edgeSymbolSize: [10,10]
然后到需要要剪头的link下设置 symbol: [‘circle’, ‘arrow’],symbolSize: [5, 5]

另 symbol的可选取值,如下,
‘circle’(圆形), ‘rect’(矩形), ‘roundRect’(圆角矩形), ‘triangle’(三角形), ‘diamond’(菱形), ‘pin’(大头针), ‘arrow’(箭头)‘none’ (无)

// series中配置edgeSymbol和edgeSymbolSize 指定默认样式为双向箭头,大小都是10
series: [
            {
                type: 'graph',
                layout: 'force',
                symbolSize: 80,
                roam: true,
                edgeSymbol: ['arrow', 'arrow'],
                edgeSymbolSize: [10, 10],
                }
]
// 在links中,针对单个关系,配置symbol和symbolSize指定两边的样式和大小
links: [
    {
        'source': '高育良',
        'target': '侯亮平',
        'name': '师生111',
        'des': '侯亮平是高育良的得意门生',
        'symbol': ['circle', 'arrow'],
        'symbolSize': [5, 5],
    }
]

示例如下,默认单向箭头,指定节点1和节点3的关系为双向箭头
echarts画关系图,指定有的关系为双向箭头,有的关系为单向箭头_第1张图片

你可能感兴趣的:(前端,echarts)