echarts
initEcharts() {
let myChart = echarts.init(document.getElementById("partTwo"));
//只让click事件触发一次
myChart.off("click");
let option = {
backgroundColor: "transparent",
color: [
"#FF72A6",
"#FF9502",
"#FEEC02",
"#506CEF",
"#38A5EA ",
"#ad36ff",
],
tooltip: {
trigger: "axis",
axisPointer: {
type: "shadow",
},
textStyle: {
color: "#fff",
},
backgroundColor: "#000A3070",
borderColor: "#000A3060",
},
legend: {
data: this.projectDomainsList.map((v) => v.name),
orient: "vertical",
right: "0%",
top: "15%",
icon: "circle",
itemWidth: 10,
itemHeight: 10,
itemGap: 20,
textStyle: {
color: "#fff",
fontSize: 12,
},
},
series: [
{
name: "项目行业分布",
type: "pie",
clockwise: false,
startAngle: 90,
center: ["38%", "50%"],
radius: ["45%", "65%"],
hoverAnimation: false,
label: {
show: true,
orient: "outside",
formatter: "{a|{b}: {d}%}",
rich: {
a: {
color: "#fff",
},
},
left: 10,
top: 20,
bottom: 20,
},
data: this.projectDomainsList.map((v) => {
return { name: v.name, value: v.project };
}),
},
],
};
myChart.setOption(option);
//点击饼图跳研发
myChart.on("click", (params) => {
this.visible = true;
let serviceName = params.name;
this.projectDomainsList.forEach((item) => {
if (serviceName == item.name) {
this.serviceType = item.id;
}
});
this.getSreviceTypeList();
});
// // let names = ["制造流量", "轨道交通", "金融", "政府", "通信"];
// let firstSelectName = "制造流量";
// myChart.dispatchAction({
// type: "highlight",
// // 数据的 index,如果不指定也可以通过 name 属性根据名称指定数据
// name: firstSelectName,
// });
// let selectIndex = 1;
// setInterval(() => {
// myChart.dispatchAction({
// type: "downplay",
// seriesIndex: 1,
// });
// myChart.dispatchAction({
// type: "highlight",
// // 数据的 index,如果不指定也可以通过 name 属性根据名称指定数据
// name: names[selectIndex],
// });
// selectIndex++;
// if (selectIndex >= names.length) {
// selectIndex = 0;
// }
// }, 3000);
},