数据可视化大屏项目开发中，会遇到各种各样的效果，今天遇到一个问题就是legend图标中矩形只有直角的，但是设计图里是
设计图效果
echarts实现效果
调整办法
echarts legend矩形图标默认只有直角的，没有圆角的，所以我们需要将图标改为svg格式的，我们可以通过iconfont来寻找圆角矩形图标。
查找图标
我们可以查找图标，寻找符合我们需要的图标
下载图标
鼠标移入点击下载图标进行图标下载
选择svg下载
打开下载文件
打开下载文件，提取关键代码
修改我们的echarts代码
将legend icon图标改为svg代码
legend: {
show: true,
icon: 'path://M962 782c0 99.405-80.595 180-180 180h-540c-99.405 0-180-80.595-180-180v-540c0-99.405 80.595-180 180-180h540c99.405 0 180 80.595 180 180v540z',
orient: 'horizontal',
left: 'center',
top: 'bottom',
itemWidth: 12,
width: '80%',
itemHeight: 12,
itemGap: 16,
textStyle: {
color: '#fff',
fontSize: 14,
fontWeight: 'normal'
},
},
图标就更换为了我们想要的圆角矩形了。
自定义图片图标
除了svg字体图标外，我们还可以指定图片图标
