Skip to content

A
attendance-performance-platform
Commit c4bb2c2d authored by 姬鋆屾's avatar 姬鋆屾
Browse files
Options

tui

parent 139d34ca
Hide whitespace changes
Inline Side-by-side
Showing with 111 additions and 32 deletions
attendance-performance-manager-ui/admin/src/views/homeCharts/record/list.vue
View file @ c4bb2c2d
......@@ -738,7 +738,7 @@ export default {
areaStyle: { color: "#56A3F1" }, //雷达覆盖区域背景颜色
label: {
show: false,
formatter: function (params) {
formatter: function(params) {
return params.value;
},
},
......@@ -936,12 +936,12 @@ export default {
},
// 反馈记录整体情况echarts
drawRecordPie(names = [], values = []) {
let colorList = ["#97e7ff", "#75f5ff", "#00deff", "#0093ff", "#2a5fcf"];
let colorList = ["#2a5fcf", "#fc8251", "#97e7ff", "#91cd77"];
let visualMapPiecesData = [];
for (var i = 0; i < names.length; i++) {
visualMapPiecesData.push({
value: values[i],
label: names[i],
name: names[i],
color: colorList[i],
});
}
......@@ -952,54 +952,133 @@ export default {
if (!this.recordPie) {
this.recordPie = this.$echarts.init(chartDom);
}
this.recordPie.setOption({
tooltip: {
trigger: "item",
},
polar: {
radius: [0, "90%"],
center: ["50%", "55%"],
},
angleAxis: {
show: false, // 隐藏刻度
max: Math.max(...values) * 1.5, // 控制柱子高度
startAngle: 90,
},
radiusAxis: {
show: true,
type: "category",
data: names,
},
visualMap: {
top: 40,
x: "left",
legend: {
bottom: "0%",
right: "0%",
orient: "vertical",
textStyle: {
color: "#000",
},
pieces: visualMapPiecesData,
outOfRange: {
color: "#999",
// 文字的样式
fontSize: 12, // 可控制每个legend项的间距
color: "#000000",
fontWeight: 600,
},
// rich: {
// // 通过富文本rich给每个项设置样式，下面的oneone、twotwo、threethree可以理解为"每一列"的样式
// oneone: {
// width: 50,
// color: "#000000",
// fontSize: 12,
// fontWeight: "bolder",
// },
// twotwo: {
// width: 35,
// color: "#333",
// fontSize: 12,
// fontWeight: 600,
// },
// threethree: {
// // 设置百分比这一列的样式
// width: 20,
// color: "#333",
// fontSize: 12,
// },
// },
// formatter: (name) => {
// // formatter格式化函数动态呈现数据
// let total = 0; // 用于计算总数
// let target; // 遍历拿到数据
// // for (let i = 0; i < data.length; i++) {
// // total += data[i].value;
// // if (data[i].name == name) {
// // target = data[i].value;
// // }
// // }
// // let v = ((target / total) * 100).toFixed(2);
// return `${name}`;
// // 富文本第一列样式应用 富文本第二列样式应用 富文本第三列样式应用
// },
},
series: [
{
type: "bar",
data: values,
coordinateSystem: "polar",
type: "pie",
radius: "80%",
// avoidLabelOverlap: false,
data: visualMapPiecesData,
left: "-25%",
top: "10%",
minAngle: 1, //最小的扇区角度（0 ~ 360），用于防止某个值过小导致扇区太小影响交互
avoidLabelOverlap: true,
// label: {
// position: "center",
// fontSize: 16,
// // formatter: () => {
// // return "总" + "\n" + total;
// // },
// },
itemStyle: {
normal: {
// 定制显示（按顺序）
color: function (params) {
color: function(params) {
return colorList[params.dataIndex];
},
},
},
labelLine: {
show: true,
},
},
],
// tooltip: {
// trigger: "item",
// },
// polar: {
// radius: [0, "90%"],
// center: ["50%", "55%"],
// },
// angleAxis: {
// show: false, // 隐藏刻度
// max: Math.max(...values) * 1.5, // 控制柱子高度
// startAngle: 90,
// },
// radiusAxis: {
// show: true,
// type: "category",
// data: names,
// },
// visualMap: {
// top: 40,
// x: "left",
// orient: "vertical",
// textStyle: {
// color: "#000",
// },
// pieces: visualMapPiecesData,
// outOfRange: {
// color: "#999",
// },
// },
// series: [
// {
// type: "bar",
// data: values,
// coordinateSystem: "polar",
// itemStyle: {
// normal: {
// // 定制显示（按顺序）
// color: function(params) {
// return colorList[params.dataIndex];
// },
// },
// },
// },
// ],
});
window.addEventListener("resize", this.adapterEcharts);
},
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment