diff --git a/src/view/dialog/echarts/jypxs copy.vue b/src/view/dialog/echarts/jypxs copy.vue
new file mode 100644
index 0000000..69fc9a4
--- /dev/null
+++ b/src/view/dialog/echarts/jypxs copy.vue
@@ -0,0 +1,155 @@
+
+
+
+
+
+
+
diff --git a/src/view/dialog/echarts/jypxs.vue b/src/view/dialog/echarts/jypxs.vue
index 1056379..97a7e6a 100644
--- a/src/view/dialog/echarts/jypxs.vue
+++ b/src/view/dialog/echarts/jypxs.vue
@@ -37,104 +37,60 @@ let datas = [
value: 80,
},
];
+const colorList = ["#ffd813", "#08daaa", "#6571fc"];
const getOption = () => {
data.option = {
- color: data.color,
-
+ //标题
title: {
- // 圆环标题
- // text: "就业率", // 主标题
+ // text: "近五年全省清洁能源发电及电能占比情况",
textStyle: {
- // 主标题样式
- color: "#fff",
-
- fontSize: 16,
+ color: "#212b43",
+ fontSize: 14, //fontWeight: 'normal',
},
- // left: "24%", // 定位到适合的位置
- // top: "38%", // 定位到适合的位置
- // subtext: `100%`, // 副标题
- // subtextStyle: {
- // // 副标题样式
- // color: "#00FFFB",
- // fontSize: 22,
- // fontWeight: "bold",
- // },
- // textAlign: "center", // 主、副标题水平居中显示
- },
- // grid: {
- // top: "13%",
- // left: "1%",
- // right: "1%",
- // bottom: "0%",
- // },
+ }, //图例组件
legend: {
- itemHeight: 10,
- itemWidth: 25,
- icon: "rect",
- orient: "vertical",
- top: "center",
- right: "16%",
- itemGap: 30, // 垂直间距
- textStyle: {
- align: "left",
- color: "#ffffff",
- verticalAlign: "middle",
- rich: {
- name: {
- width: 80,
- fontSize: 16,
- },
- value: {
- width: 30,
- align: "right",
- fontFamily: "Medium",
- fontSize: 16,
- },
- rate: {
- width: 20,
- align: "right",
- fontSize: 16,
- },
- },
- },
- data: datas,
- formatter: (name) => {
- if (datas.length) {
- const item = datas.filter((item) => item.name === name)[0];
- return `{name|${name}} {value| ${item.value}}`;
- }
- },
+ bottom: "0;",
},
tooltip: {
trigger: "item",
- formatter: "{b}:{d}",
},
- calculable: true,
series: [
{
- name: "",
type: "pie",
- // radius: ["45%", "90%"],
- // center: ["25%", "50%"],
+ radius: [0, 100],
+ center: ["50%", "40%"],
- roseType: "radiuas",
- labelLine: {
- normal: {
- length: 30, // 改变标示线的长度
- length2: 80,
- lineStyle: {
- color: "white", // 改变标示线的颜色
+ roseType: "area",
+ itemStyle: {
+ color: (params) => {
+ return colorList[params.dataIndex];
+ },
+ borderRadius: 8,
+ }, //标题与数字一行显示
+ label: {
+ show: true,
+ position: "outside",
+ formatter: "{a|{b}:{d}%}\n{hr|}",
+ rich: {
+ hr: {
+ backgroundColor: "auto",
+ borderRadius: 3,
+ width: 1,
+ height: 3,
+ padding: [3, 3, 0, -12],
+ },
+ a: {
+ padding: [0, 1, -20, 15],
+ color: "auto",
},
},
},
- label: {
- show: true,
- formatter: "{b}:{c}" + "个\n\n",
- borderWidth: 10,
- borderRadius: 4,
- padding: [0, -80],
- },
- data: datas,
+ data: [
+ { value: 200, name: "高血压" },
+ { value: 230, name: "糖尿病" },
+ { value: 198, name: "其他疾病患者" },
+ { value: 80, name: "无重大疾病患者" },
+ ],
},
],
};