echarts示例中人物关系图中节点是原点或其他形状，但人物关系图中节点呈现为人物图像更为合适。
有些情况下，使用symbol: require(‘@/assets…’)可以使用本地资源中的图片进行展示，但更一般的情况下，我们会从后端进行图片的请求，通常为图片二进制流，那么就需要用以下的方式进行节点的图片改造，简单来说就是：
异步请求（ajax/axios）后端图片数据流将二进制流编码为base64格式拼接字符串作为symbol
下面是Vue代码中的使用，并没有过多Vue特性，因此泛用性很好
<template><div class="echartLayout"><div id="container" style="width:100%; height:300%; overflow:hidden;"></div><button v-on:click='refresh()'>refresh</button></div></template><script>export default {name: 'personRelation',data () {return {myChart: null,chartData: [],chartLink: []}},mounted: function () {var this_ = thisvar data = []// 请求需要哪些人物图片this_.$axios.get('/ls', {params: {dirPath: '***'}}).then(function (response) {var facesArray = response.data.dataconsole.log(facesArray)//根据结果，对每个图片都进行请求for (var i = 0; i < facesArray.length; i++) {var element = facesArray[i]this_.$axios.get('/file', {params: {filePath: '***' + element.name},responseType: 'arraybuffer'}).then(function (response) {// 从response中取得当时请求时的图片名var imageName = response.config.params.filePath.split('/')[response.config.params.filePath.split('/').length - 1]var id = imageName.split('.')[0]//图片二进制数据流转为base64格式var image = 'data:image/jpg;base64,' + btoa(new Uint8Array(response.data).reduce((data, byte) => data + String.fromCharCode(byte), ''))data.push({symbolSize: 76, symbol: `image://${image}`, id: id})this_.chartData = data}).catch(function (error) {console.log(error)})}}).catch(function (error) {console.log(error)})// 这里link就自己定义吧// this_.chartLink = ...},methods: {refresh: function () {this.initEchart()},initEchart () {let dom = document.getElementById('container')this.myChart = this.$echarts.init(dom)let option = {tooltip: {show: false},series: [{edgeLabel: {normal: {formatter: '{c}',show: true}},edgeSymbol: 'circle',force: {repulsion: 2000},layout: 'force',roam: true,itemStyle: {normal: {color: '#6495ED'},// 鼠标放上去有阴影效果emphasis: {shadowColor: '#3721db',shadowOffsetX: 0,shadowOffsetY: 0,shadowBlur: 40}},label: {normal: {show: true}},// 头像// symbol:symbolSize: 46,type: 'graph',links: this.chartLink,data: this.chartData}]}this.myChart.setOption(option)this.myChart.on('click', function (params) {console.log(params.data) // 获取点击的头像的数据信息})}}</script><style scoped></style>
