饼图

1.调整标题位置，图例位置
title: {
text: "标题",
x: "center", //水平位置 left center right
y: "bottom", //垂直位置 top center bottom
textStyle: { // 自定义样式
color: "#333",
fontStyle: "normal",
fontSize: 12,
fontWeight: "200"
}
},
2.更改图例位置，图标
legend: {
// orient: 'vertical',
// top: 'middle',
bottom: 40, //距离底部距离
left: "center",
icon: "circle",//图标的类型
data: this.pieKey //数据
},
3.类型太多，颜色不想重复，字体和轴覆盖
series: [
{
type: "pie",
radius: "65%",
center: ["50%", "45%"],
selectedMode: "single",
data: this.pieVal,
minAngle: 3, //最小的扇区角度（0 ~ 360），用于防止某个值过小导致扇区太小影响交互
avoidLabelOverlap: true,
label: {
align: "left",
normal: {
formatter(v) {
let text = Math.round(v.percent) + "%" + "" + v.name;
if (text.length <= 8) {
return text;
} else if (text.length > 8 && text.length <= 16) {
return (text = ${text.slice(0, 8)}\n${text.slice(8)});
} else if (text.length > 16 && text.length <= 24) {
return (text = ${text.slice(0, 8)}\n${text.slice( 8, 16 )}\n${text.slice(16)});
} else if (text.length > 24 && text.length <= 30) {
return (text = ${text.slice(0, 8)}\n${text.slice( 8, 16 )}\n${text.slice(16, 24)}\n${text.slice(24)});
} else if (text.length > 30) {
return (text = ${text.slice(0, 8)}\n${text.slice( 8, 16 )}\n${text.slice(16, 24)}\n${text.slice( 24, 30 )}\n${text.slice(30)});
}
},
textStyle: {
fontSize: 8
}
}
},
itemStyle: {
normal: { //颜色随机
color: function (){return "#"+("00000"+((Math.random()*16777215+0.5)>>0).toString(16)).slice(-6); }
}
}
}
]

柱状图

1.文字太多重叠，显示不全
xAxis: {
type: "category",
data: this.pieKey,
axisLabel: {
interval:0,//代表显示所有x轴标签显示
rotate:30, //代表逆时针旋转45度
}
},

后续遇到问题在补充