xiangshan
/
ggfwjsc
22
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

1

This commit is contained in:
姚宇浩 2024-04-15 15:19:07 +08:00
parent 385a455612
commit 1031053ebd
7 changed files with 91 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
src/view/echarts/eP2.vue
View File

@ -12,9 +12,11 @@ const chart = ref(); // 创建DOM引用
let option = {
tooltip: {
trigger: "axis",
padding: [20, 10, 20, 10],
formatter: "{b0}<br />{a1}:{c1} <br />{a2}:{c2} <br />{a3}:{c3}",
},
legend: {
// data: ["80-90补贴人次", "90-98补贴人次", "99以上补贴人次"],
data: ["80-90补贴人次", "90-98补贴人次", "99以上补贴人次"],
top: "8%",
right: "15%",
textStyle: {
@ -33,14 +35,14 @@ let option = {
type: "category",
// boundaryGap: false,
data: ["1月", "2月", "3月", "4月", "5月"],
splitArea: {
show: true,
interval: '10',
areaStyle: {
color: ["rgba(255, 255, 255, 0.10)"],
width:10,
},
},
// splitArea: {
// show: true,
// interval: '10',
// areaStyle: {
// color: ["rgba(255, 255, 255, 0.10)"],
// width:10,
// },
// },
axisLabel: {
//坐标轴刻度标签的相关设置
textStyle: {
@ -65,6 +67,15 @@ let option = {
},
},
series: [
{
name: "背景",
type: "bar",
data: [0, 0, 0, 0, 0],
showBackground: true,
backgroundStyle: {
color: "rgba(180, 180, 180, 0.2)",
},
},
{
name: "80-90补贴人次",
type: "line",

31
src/view/echarts/eP2_2.vue
View File

@ -12,9 +12,11 @@ const chart = ref(); // 创建DOM引用
let option = {
tooltip: {
trigger: "axis",
padding: [20, 10, 20, 10],
formatter: "{b0}<br />{a1}:{c1} <br />{a2}:{c2} <br />{a3}:{c3}",
},
legend: {
// data: ["80-90补贴人次", "90-98补贴人次", "99以上补贴人次"],
data: ["80-90补贴人次", "90-98补贴人次", "99以上补贴人次"],
top: "8%",
right: "15%",
textStyle: {
@ -24,7 +26,7 @@ let option = {
},
grid: {
left: "1%",
right: "4%",
right: "10%",
bottom: "3%",
containLabel: true,
},
@ -33,14 +35,14 @@ let option = {
type: "category",
// boundaryGap: false,
data: ["1月", "2月", "3月", "4月", "5月"],
splitArea: {
show: true,
interval: '10',
areaStyle: {
color: ["rgba(255, 255, 255, 0.10)"],
width:10,
},
},
// splitArea: {
// show: true,
// interval: '10',
// areaStyle: {
// color: ["rgba(255, 255, 255, 0.10)"],
// width:10,
// },
// },
axisLabel: {
//坐标轴刻度标签的相关设置
textStyle: {
@ -65,6 +67,15 @@ let option = {
},
},
series: [
{
name: "背景",
type: "bar",
data: [0, 0, 0, 0, 0],
showBackground: true,
backgroundStyle: {
color: "rgba(180, 180, 180, 0.2)",
},
},
{
name: "80-90补贴人次",
type: "line",

22
src/view/echarts/eP3.vue
View File

@ -12,11 +12,13 @@ const chart = ref(); // 创建DOM引用
let option = {
tooltip: {
trigger: "axis",
padding: [20, 10, 20, 10],
formatter: "{b0}<br />{a1}:{c1} <br />{a2}:{c2} ",
},
legend: {
// data: ["80-90补贴人次", "90-98补贴人次", "99以上补贴人次"],
data: ["职工养老保险金额", "城乡养老保险金额"],
top: "8%",
right: "15%",
right: "11%",
textStyle: {
fontSize: 12,
color: "#ccc",
@ -24,7 +26,7 @@ let option = {
},
grid: {
left: "1%",
right: "4%",
right: "10%",
bottom: "3%",
containLabel: true,
},
@ -58,7 +60,16 @@ let option = {
},
series: [
{
name: "特困补助金额",
name: "背景",
type: "bar",
data: [0, 0, 0, 0, 0],
showBackground: true,
backgroundStyle: {
color: "rgba(180, 180, 180, 0.2)",
},
},
{
name: "职工养老保险金额",
type: "line",
stack: "Total",
symbol: "emptyCircle",
@ -71,9 +82,8 @@ let option = {
},
data: [120, 132, 101, 134, 90],
},
{
name: "低保补助金额",
name: "城乡养老保险金额",
type: "line",
stack: "Total",
symbol: "emptyCircle",

4
src/view/echarts/eP3_2.vue
View File

@ -15,7 +15,7 @@ let option = {
},
legend: {
top: "8%",
right: "5%",
right: "11%",
textStyle: {
fontSize: 12,
color: "#ccc",
@ -23,7 +23,7 @@ let option = {
},
grid: {
left: "1%",
right: "4%",
right: "10%",
bottom: "3%",
containLabel: true,
},

20
src/view/echarts/pie.vue
View File

@ -12,6 +12,9 @@ const chart = ref(); // 创建DOM引用
let option = {
tooltip: {
trigger: "axis",
axisPointer: {
type: "shadow",
},
},
legend: {
top: "8%",
@ -40,6 +43,8 @@ let option = {
data: ["2019", "2020", "2021", "2022", "2023"],
},
],
yAxis: [
{
type: "value",
@ -59,10 +64,12 @@ let option = {
},
],
series: [
{
name: "职工养老保险发放人次",
type: "bar",
data: [2.0, 4.9, 7.0, 23.2, 25.6],
barWidth: "25%",
showBackground: true,
itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
@ -76,14 +83,15 @@ let option = {
},
]),
},
backgroundStyle: {
color: "rgba(180, 180, 180, 0.2)",
},
// backgroundStyle: {
// color: "rgba(180, 180, 180, 0.2)",
// },
},
{
name: "城乡养老保险发放人次",
type: "bar",
data: [2.6, 5.9, 9.0, 26.4, 28.7],
barWidth: "25%",
showBackground: true,
itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
@ -97,9 +105,9 @@ let option = {
},
]),
},
backgroundStyle: {
color: "rgba(180, 180, 180, 0.2)",
},
// backgroundStyle: {
// color: "rgba(180, 180, 180, 0.2)",
// },
},
],
};

13
src/view/echarts/pie2.vue
View File

@ -12,9 +12,11 @@ const chart = ref(); // 创建DOM引用
let option = {
tooltip: {
trigger: "axis",
padding: [20, 10, 20, 10],
formatter: "{b0}<br />{a1}:{c1} <br />{a2}:{c2} ",
},
legend: {
// data: ["80-90补贴人次", "90-98补贴人次", "99以上补贴人次"],
data: ["职工养老保险金额", "城乡养老保险金额"],
top: "8%",
right: "11%",
textStyle: {
@ -57,6 +59,15 @@ let option = {
},
},
series: [
{
name: "背景",
type: "bar",
data: [0, 0, 0, 0, 0],
showBackground: true,
backgroundStyle: {
color: "rgba(180, 180, 180, 0.2)",
},
},
{
name: "职工养老保险金额",
type: "line",

8
src/view/yl.vue
View File

@ -237,13 +237,15 @@ const change = (name, index) => {
<style lang="scss" scoped>
.displayFlex {
box-sizing: border-box;
height: 90vh;
display: flex;
flex-direction: column;
// flex: 1;
flex: 1;
}
.flex1 {
// flex: 1;
flex: 1;
// padding: 0 28px;
box-sizing: border-box;
}
@ -263,7 +265,7 @@ const change = (name, index) => {
// background-repeat: no-repeat;
// background-size: 100% 100%;
box-sizing: border-box;
width: 90%;
width: 94%;
height: 36px;
position: relative;