Merge branch 'main' of git.zdool.com:xs/ggfwjsc

This commit is contained in:
lnn19986213 2024-05-21 16:12:57 +08:00
commit 2b717611d7
28 changed files with 324 additions and 333 deletions

View File

@ -59,7 +59,7 @@ const getOption = () => {
grid: { grid: {
top: "6%", top: "6%",
left: "9%", left: "9%",
right: "10%", right: "14%",
bottom: "0%", bottom: "0%",
containLabel: false, //---grid containLabel: false, //---grid
}, },
@ -78,6 +78,7 @@ const getOption = () => {
show: false, show: false,
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
axisLine: { axisLine: {
@ -102,6 +103,7 @@ const getOption = () => {
show: false, show: false,
lineStyle: { lineStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
width: 1, width: 1,
}, },
}, },
@ -112,16 +114,12 @@ const getOption = () => {
//y //y
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
axisLine: { axisLine: {
//线 //线
show: false, show: false,
// lineStyle: {
// color: "#ffffff",
// width: 1,
// type: "solid",
// },
}, },
data: data1, data: data1,
}, },
@ -137,6 +135,7 @@ const getOption = () => {
//--- //---
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
axisTick: { axisTick: {

View File

@ -53,7 +53,7 @@ const option = {
// data: ["", ""], // data: ["", ""],
// top: "8%", // top: "8%",
textStyle: { textStyle: {
fontSize: 12, fontSize: 14,
color: "#ffffff", color: "#ffffff",
}, },
}, },
@ -64,6 +64,7 @@ const option = {
bottom: "0%", bottom: "0%",
containLabel: true, containLabel: true,
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
calculable: true, calculable: true,
// color: "rgba(0, 252, 255, 1)", // color: "rgba(0, 252, 255, 1)",
@ -75,6 +76,7 @@ const option = {
// //
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
axisTick: { axisTick: {
@ -98,6 +100,7 @@ const option = {
show: false, show: false,
lineStyle: { lineStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
width: 1, width: 1,
}, },
}, },
@ -105,6 +108,7 @@ const option = {
// //
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
axisLine: { axisLine: {
@ -112,6 +116,7 @@ const option = {
show: false, show: false,
lineStyle: { lineStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
width: 1, width: 1,
type: "solid", type: "solid",
}, },
@ -174,27 +179,7 @@ const option = {
// data: data.map(() => max), // data: data.map(() => max),
data: data.map(() => Math.max(...data) * 1.02), data: data.map(() => Math.max(...data) * 1.02),
barWidth: 40, // barWidth: 40, //
// emphasis: {
// itemStyle: {
// color: {
// type: "linear",
// x: 0,
// x2: 0,
// y: 0,
// y2: 1,
// colorStops: [
// {
// offset: 0,
// color: "rgba(64, 247, 176, 0.25)",
// },
// {
// offset: 1,
// color: "rgba(17, 34, 64, 0.25)",
// },
// ],
// },
// },
// },
type: "bar", type: "bar",
}, },
], ],
@ -202,19 +187,8 @@ const option = {
// 使 // 使
onMounted(() => { onMounted(() => {
// domecharts
// var myChart = echarts.init(document.getElementById('main'));
// Vue3
var myChart = echarts.init(chart.value); var myChart = echarts.init(chart.value);
// init(); // vue3.2this
// 使
myChart.setOption(option); myChart.setOption(option);
// :
// window.addEventListener("resize", () => {
// myChart.resize();
// });
}); });
</script> </script>

View File

@ -62,6 +62,7 @@ const getOption = () => {
borderWidth: 1, borderWidth: 1,
borderColor: "rgba(193, 229, 255, .1)", borderColor: "rgba(193, 229, 255, .1)",
color: "rgba(14, 59, 123, 0.60)", color: "rgba(14, 59, 123, 0.60)",
fontSize: 14,
}, },
}, },
tooltip: { tooltip: {
@ -93,7 +94,8 @@ const getOption = () => {
//{a|}rich a //{a|}rich a
//{hr|} //{hr|}
formatter: "{hr|}{a|{b} {c}}\n\n", formatter: "{hr|}{a|{b} {c}}\n\n",
color: "#fffdef", //线 color: "#ffffff", //线
fontSize: 14,
borderWidth: 10, borderWidth: 10,
borderRadius: 4, borderRadius: 4,
padding: [90, -60], padding: [90, -60],
@ -113,8 +115,9 @@ const getOption = () => {
}, },
textStyle: { textStyle: {
color: "white", // // color: "white", //
fontSize: 13, // color: "#ffffff",
fontSize: 14, //
}, },
}, },
labelLine: { labelLine: {

View File

@ -32,8 +32,8 @@ const getOption = () => {
top: "8%", top: "8%",
right: "11%", right: "11%",
textStyle: { textStyle: {
fontSize: 12, fontSize: 14,
color: "#ccc", color: "#ffffff",
}, },
}, },
grid: { grid: {
@ -49,7 +49,8 @@ const getOption = () => {
axisLabel: { axisLabel: {
// //
textStyle: { textStyle: {
color: "#ccc", color: "#ffffff",
fontSize: 14,
}, },
}, },
axisTick: { axisTick: {
@ -80,7 +81,8 @@ const getOption = () => {
axisLabel: { axisLabel: {
// //
textStyle: { textStyle: {
color: "#ccc", color: "#ffffff",
fontSize: 14,
}, },
}, },
}, },
@ -105,7 +107,7 @@ const getOption = () => {
show: false, show: false,
fontSize: 14, fontSize: 14,
fontFamily: "MicrosoftYaHei", fontFamily: "MicrosoftYaHei",
color: "#DEF1FF", color: "#ffffff",
lineHeight: 19, lineHeight: 19,
}, },
}, },
@ -171,6 +173,7 @@ const getOption = () => {
yAxisIndex: 1, yAxisIndex: 1,
itemStyle: { itemStyle: {
color: "rgba(221, 242, 255, 0.1)", color: "rgba(221, 242, 255, 0.1)",
fontSize: 14,
}, },
data: ["2019", "2020", "2021"].map(() => 100), data: ["2019", "2020", "2021"].map(() => 100),
barWidth: 70, barWidth: 70,

View File

@ -71,6 +71,7 @@ let option = {
fontSize: '24', fontSize: '24',
fontWeight: 'normal', fontWeight: 'normal',
color: '#fff', color: '#fff',
fontSize: 14,
lineHeight: 30, lineHeight: 30,
rich: { rich: {
cell: { cell: {

View File

@ -72,6 +72,7 @@ const getOption = () => {
// }, // },
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
rotate: 40, rotate: 40,
}, },
@ -94,6 +95,7 @@ const getOption = () => {
// //
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
axisLine: { axisLine: {
@ -101,6 +103,7 @@ const getOption = () => {
show: false, show: false,
lineStyle: { lineStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
width: 1, width: 1,
type: "solid", type: "solid",
}, },

View File

@ -46,6 +46,7 @@ data.option = {
// //
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
@ -76,6 +77,7 @@ data.option = {
// //
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
axisLine: { axisLine: {
@ -83,6 +85,7 @@ data.option = {
show: false, show: false,
lineStyle: { lineStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
width: 1, width: 1,
type: "solid", type: "solid",
}, },
@ -109,7 +112,8 @@ data.option = {
show: false, show: false,
fontSize: 14, fontSize: 14,
fontFamily: "MicrosoftYaHei", fontFamily: "MicrosoftYaHei",
color: "#DEF1FF", color: "#ffffff",
fontSize: 14,
lineHeight: 19, lineHeight: 19,
}, },
}, },

View File

@ -56,6 +56,7 @@ const getOption = () => {
// //
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
}, },
@ -72,6 +73,7 @@ const getOption = () => {
// //
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
}, },

View File

@ -38,7 +38,7 @@ const getOption = () => {
top: "6%", top: "6%",
right: "11%", right: "11%",
textStyle: { textStyle: {
fontSize: 12, fontSize: 14,
color: "#ffffff", color: "#ffffff",
}, },
}, },
@ -57,6 +57,7 @@ const getOption = () => {
// //
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
data: data.year, data: data.year,
@ -85,6 +86,7 @@ const getOption = () => {
// //
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
}, },
@ -109,7 +111,8 @@ const getOption = () => {
show: false, show: false,
fontSize: 14, fontSize: 14,
fontFamily: "MicrosoftYaHei", fontFamily: "MicrosoftYaHei",
color: "#DEF1FF", color: "#ffffff",
fontSize: 14,
lineHeight: 19, lineHeight: 19,
}, },
}, },

View File

@ -38,7 +38,7 @@ const getOption = () => {
top: "6%", top: "6%",
right: "11%", right: "11%",
textStyle: { textStyle: {
fontSize: 12, fontSize: 14,
color: "#ffffff", color: "#ffffff",
}, },
}, },
@ -57,6 +57,7 @@ const getOption = () => {
axisLabel: { axisLabel: {
// //
textStyle: { textStyle: {
fontSize: 14,
color: "#ffffff", color: "#ffffff",
}, },
}, },
@ -73,6 +74,7 @@ const getOption = () => {
axisLabel: { axisLabel: {
// //
textStyle: { textStyle: {
fontSize: 14,
color: "#ffffff", color: "#ffffff",
}, },
}, },

View File

@ -56,6 +56,7 @@ const getOption = () => {
// //
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
}, },
@ -72,6 +73,7 @@ const getOption = () => {
// //
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
}, },

View File

@ -186,8 +186,8 @@ const getOption = () => {
borderRadius: 20, borderRadius: 20,
}, },
textStyle: { textStyle: {
color: "#ccc", color: "#ffffff",
fontSize: 12, fontSize: 14,
padding: 10, padding: 10,
rich: { rich: {
name: { name: {

View File

@ -24,7 +24,7 @@ const option = {
data: ["救助金额", "救助人数"], data: ["救助金额", "救助人数"],
top: "8%", top: "8%",
textStyle: { textStyle: {
fontSize: 12, fontSize: 14,
color: "#ffffff", // color: "#ffffff", //
}, },
}, },
@ -45,6 +45,7 @@ const option = {
// //
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
axisTick: { axisTick: {
@ -69,12 +70,14 @@ const option = {
show: false, show: false,
lineStyle: { lineStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
width: 1, width: 1,
}, },
}, },
axisLabel: { axisLabel: {
//y //y
textStyle: { textStyle: {
fontSize: 14,
color: "#ffffff", color: "#ffffff",
}, },
}, },
@ -83,6 +86,7 @@ const option = {
show: false, show: false,
lineStyle: { lineStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
width: 1, width: 1,
type: "solid", type: "solid",
}, },
@ -105,6 +109,7 @@ const option = {
//y //y
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
axisLine: { axisLine: {
@ -112,6 +117,7 @@ const option = {
show: false, show: false,
lineStyle: { lineStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
width: 1, width: 1,
type: "solid", type: "solid",
}, },
@ -138,7 +144,7 @@ const option = {
show: false, show: false,
fontSize: 14, fontSize: 14,
fontFamily: "MicrosoftYaHei", fontFamily: "MicrosoftYaHei",
color: "#DEF1FF", color: "#ffffff",
lineHeight: 19, lineHeight: 19,
}, },
}, },

View File

@ -49,7 +49,7 @@ const option = {
data: ["救助金额", "救助人数"], data: ["救助金额", "救助人数"],
top: "8%", top: "8%",
textStyle: { textStyle: {
fontSize: 12, fontSize: 14,
color: "#ffffff", // color: "#ffffff", //
}, },
}, },
@ -59,6 +59,7 @@ const option = {
bottom: "0%", bottom: "0%",
containLabel: true, containLabel: true,
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
calculable: true, calculable: true,
color, color,
@ -70,6 +71,7 @@ const option = {
// //
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
axisTick: { axisTick: {
@ -94,6 +96,7 @@ const option = {
show: false, show: false,
lineStyle: { lineStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
width: 1, width: 1,
}, },
}, },
@ -101,6 +104,7 @@ const option = {
//y //y
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
axisLine: { axisLine: {
@ -108,6 +112,7 @@ const option = {
show: false, show: false,
lineStyle: { lineStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
width: 1, width: 1,
type: "solid", type: "solid",
}, },
@ -130,6 +135,7 @@ const option = {
//y //y
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
axisLine: { axisLine: {
@ -137,6 +143,7 @@ const option = {
show: false, show: false,
lineStyle: { lineStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
width: 1, width: 1,
type: "solid", type: "solid",
}, },
@ -162,9 +169,9 @@ const option = {
axisLabel: { axisLabel: {
show: false, show: false,
fontSize: 14, fontSize: 14,
fontFamily: "MicrosoftYaHei",
color: "#DEF1FF", color: "#DEF1FF",
lineHeight: 19, lineHeight: 19,
fontFamily: "MicrosoftYaHei",
}, },
}, },
], ],
@ -238,19 +245,8 @@ const option = {
// 使 // 使
onMounted(() => { onMounted(() => {
// domecharts
// var myChart = echarts.init(document.getElementById('main'));
// Vue3
var myChart = echarts.init(chart.value); var myChart = echarts.init(chart.value);
// init(); // vue3.2this
// 使
myChart.setOption(option); myChart.setOption(option);
// :
// window.addEventListener("resize", () => {
// myChart.resize();
// });
}); });
</script> </script>

View File

@ -44,7 +44,7 @@ const option = {
data: ["特困救助金额", "低保救助金额"], data: ["特困救助金额", "低保救助金额"],
top: "3%", top: "3%",
textStyle: { textStyle: {
fontSize: 12, fontSize: 14,
color: "#ffffff", // color: "#ffffff", //
}, },
}, },
@ -52,7 +52,7 @@ const option = {
data: ["特困救助人次", "低保救助人次", "低边救助人次"], data: ["特困救助人次", "低保救助人次", "低边救助人次"],
top: "13%", top: "13%",
textStyle: { textStyle: {
fontSize: 12, fontSize: 14,
color: "#ffffff", // color: "#ffffff", //
}, },
}, },
@ -65,6 +65,7 @@ const option = {
bottom: "0%", bottom: "0%",
containLabel: true, containLabel: true,
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
calculable: true, calculable: true,
color, color,
@ -76,6 +77,7 @@ const option = {
// //
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
axisTick: { axisTick: {
@ -100,6 +102,7 @@ const option = {
show: false, show: false,
lineStyle: { lineStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
width: 1, width: 1,
}, },
}, },
@ -107,6 +110,7 @@ const option = {
//y //y
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
axisLine: { axisLine: {
@ -114,6 +118,7 @@ const option = {
show: false, show: false,
lineStyle: { lineStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
width: 1, width: 1,
type: "solid", type: "solid",
}, },
@ -136,13 +141,16 @@ const option = {
//y //y
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
axisLine: { axisLine: {
//y线 //y线
show: false, show: false,
lineStyle: { lineStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
width: 1, width: 1,
type: "solid", type: "solid",
}, },
@ -168,9 +176,9 @@ const option = {
axisLabel: { axisLabel: {
show: false, show: false,
fontSize: 14, fontSize: 14,
fontFamily: "MicrosoftYaHei", color: "#ffffff",
color: "#DEF1FF",
lineHeight: 19, lineHeight: 19,
fontFamily: "MicrosoftYaHei",
}, },
}, },
], ],

View File

@ -42,7 +42,7 @@ const option = {
], ],
top: "3%", top: "3%",
textStyle: { textStyle: {
fontSize: 12, fontSize: 14,
color: "#ffffff", // color: "#ffffff", //
}, },
}, },
@ -53,6 +53,7 @@ const option = {
bottom: "5%", bottom: "5%",
containLabel: true, containLabel: true,
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
calculable: true, calculable: true,
color, color,
@ -64,6 +65,7 @@ const option = {
// //
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
axisTick: { axisTick: {
@ -88,6 +90,7 @@ const option = {
show: false, show: false,
lineStyle: { lineStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
width: 1, width: 1,
}, },
}, },
@ -95,6 +98,7 @@ const option = {
//y //y
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
axisLine: { axisLine: {
@ -102,6 +106,7 @@ const option = {
show: false, show: false,
lineStyle: { lineStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
width: 1, width: 1,
type: "solid", type: "solid",
}, },
@ -124,6 +129,7 @@ const option = {
//y //y
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
axisLine: { axisLine: {
@ -131,6 +137,7 @@ const option = {
show: false, show: false,
lineStyle: { lineStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
width: 1, width: 1,
type: "solid", type: "solid",
}, },
@ -156,9 +163,9 @@ const option = {
axisLabel: { axisLabel: {
show: false, show: false,
fontSize: 14, fontSize: 14,
fontFamily: "MicrosoftYaHei", color: "#ffffff",
color: "#DEF1FF",
lineHeight: 19, lineHeight: 19,
fontFamily: "MicrosoftYaHei",
}, },
}, },
], ],

View File

@ -45,7 +45,7 @@ const option = {
top: "8%", top: "8%",
bottom: "9%", bottom: "9%",
textStyle: { textStyle: {
fontSize: 12, fontSize: 14,
color: "#ffffff", // color: "#ffffff", //
}, },
}, },
@ -65,6 +65,7 @@ const option = {
bottom: "7%", bottom: "7%",
containLabel: true, containLabel: true,
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
xAxis: [ xAxis: [
{ {
@ -74,6 +75,7 @@ const option = {
// //
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
axisTick: { axisTick: {
@ -97,6 +99,7 @@ const option = {
show: false, show: false,
lineStyle: { lineStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
width: 1, width: 1,
}, },
}, },
@ -104,6 +107,7 @@ const option = {
//y //y
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
axisLine: { axisLine: {
@ -111,6 +115,7 @@ const option = {
show: false, show: false,
lineStyle: { lineStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
width: 1, width: 1,
type: "solid", type: "solid",
}, },
@ -133,6 +138,7 @@ const option = {
//y //y
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
axisLine: { axisLine: {
@ -140,6 +146,7 @@ const option = {
show: false, show: false,
lineStyle: { lineStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
width: 1, width: 1,
type: "solid", type: "solid",
}, },
@ -166,7 +173,7 @@ const option = {
show: false, show: false,
fontSize: 14, fontSize: 14,
fontFamily: "MicrosoftYaHei", fontFamily: "MicrosoftYaHei",
color: "#DEF1FF", color: "#ffffff",
lineHeight: 19, lineHeight: 19,
}, },
}, },
@ -280,8 +287,8 @@ const option = {
show: false, // show: false, //
position: "top", // position: "top", //
textStyle: { textStyle: {
fontSize: "12", fontSize: "14",
color: "#B0E1FF", color: "#ffffff",
}, },
}, },
}, },

View File

@ -50,7 +50,7 @@ const getOption = () => {
top: "8%", top: "8%",
right: "15%", right: "15%",
textStyle: { textStyle: {
fontSize: 12, fontSize: 14,
color: "#ffffff", color: "#ffffff",
}, },
}, },
@ -63,20 +63,12 @@ const getOption = () => {
xAxis: { xAxis: {
type: "category", type: "category",
// boundaryGap: false,
data: data.year, data: data.year,
// splitArea: {
// show: true,
// interval: '10',
// areaStyle: {
// color: ["rgba(255, 255, 255, 0.10)"],
// width:10,
// },
// },
axisLabel: { axisLabel: {
// //
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
}, },
@ -85,7 +77,8 @@ const getOption = () => {
splitLine: { splitLine: {
show: true, show: true,
lineStyle: { lineStyle: {
color: "rgba(226, 226, 226, 0.3)", color: "rgba(255, 255, 255, 0.2)",
fontSize: 14,
width: 1, width: 1,
}, },
}, },
@ -93,6 +86,7 @@ const getOption = () => {
// //
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
}, },

View File

@ -50,7 +50,7 @@ const getOption = () => {
top: "8%", top: "8%",
right: "15%", right: "15%",
textStyle: { textStyle: {
fontSize: 12, fontSize: 14,
color: "#ffffff", color: "#ffffff",
}, },
}, },
@ -77,6 +77,7 @@ const getOption = () => {
// //
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
}, },
@ -93,6 +94,7 @@ const getOption = () => {
// //
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
}, },
@ -104,6 +106,7 @@ const getOption = () => {
showBackground: true, showBackground: true,
backgroundStyle: { backgroundStyle: {
color: "rgba(180, 180, 180, 0.2)", color: "rgba(180, 180, 180, 0.2)",
fontSize: 14,
}, },
}, },
{ {

View File

@ -50,7 +50,7 @@ const getOption = () =>{
top: "8%", top: "8%",
right: "11%", right: "11%",
textStyle: { textStyle: {
fontSize: 12, fontSize: 14,
color: "#ffffff", color: "#ffffff",
}, },
}, },
@ -69,6 +69,7 @@ const getOption = () =>{
// //
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
}, },
@ -77,7 +78,8 @@ const getOption = () =>{
splitLine: { splitLine: {
show: true, show: true,
lineStyle: { lineStyle: {
color: "rgba(226, 226, 226, 0.3)", color: "rgba(255, 255, 255, 0.2)",
fontSize: 14,
width: 1, width: 1,
}, },
}, },
@ -85,6 +87,7 @@ const getOption = () =>{
// //
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
}, },

View File

@ -47,7 +47,7 @@ const getOption = () =>{
top: "5%", top: "5%",
right: "11%", right: "11%",
textStyle: { textStyle: {
fontSize: 12, fontSize: 14,
color: "#ffffff", color: "#ffffff",
}, },
}, },
@ -65,6 +65,7 @@ const getOption = () =>{
// //
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
data: data.year, data: data.year,
@ -75,6 +76,8 @@ const getOption = () =>{
data: data.year, data: data.year,
axisLabel: { axisLabel: {
show: false, show: false,
color: "#ffffff",
fontSize: 14,
}, },
}, },
@ -94,6 +97,7 @@ const getOption = () =>{
// //
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
}, },
@ -105,7 +109,7 @@ const getOption = () =>{
show: false, show: false,
lineStyle: { lineStyle: {
type: "solid", type: "solid",
color: "rgb(221, 242, 255,0.1)" color: "rgb(221, 242, 255,0.3)"
}, },
}, },
axisLine: { axisLine: {
@ -117,8 +121,8 @@ const getOption = () =>{
axisLabel: { axisLabel: {
show: false, show: false,
fontSize: 14, fontSize: 14,
fontFamily: "MicrosoftYaHei",
color: "#DEF1FF", color: "#DEF1FF",
fontFamily: "MicrosoftYaHei",
lineHeight: 19, lineHeight: 19,
}, },
}, },

View File

@ -46,7 +46,7 @@ const getOption = () => {
top: "8%", top: "8%",
right: "11%", right: "11%",
textStyle: { textStyle: {
fontSize: 12, fontSize: 14,
color: "#ffffff", color: "#ffffff",
}, },
}, },
@ -64,6 +64,7 @@ const getOption = () => {
// //
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
data: data.year, data: data.year,
@ -84,7 +85,9 @@ const getOption = () => {
splitLine: { splitLine: {
show: true, show: true,
lineStyle: { lineStyle: {
color: "rgba(226, 226, 226, 0.3)", // color: "rgba(226, 226, 226, 0.3)",
color: "#ffffff",
fontSize: 14,
width: 1, width: 1,
}, },
}, },
@ -114,7 +117,7 @@ const getOption = () => {
show: false, show: false,
fontSize: 14, fontSize: 14,
fontFamily: "MicrosoftYaHei", fontFamily: "MicrosoftYaHei",
color: "#DEF1FF", color: "#ffffff",
lineHeight: 19, lineHeight: 19,
}, },
}, },

View File

@ -48,7 +48,7 @@ const getOption = () => {
top: "8%", top: "8%",
right: "11%", right: "11%",
textStyle: { textStyle: {
fontSize: 12, fontSize: 14,
color: "#ffffff", color: "#ffffff",
}, },
}, },
@ -67,6 +67,7 @@ const getOption = () => {
// //
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
}, },
@ -75,7 +76,8 @@ const getOption = () => {
splitLine: { splitLine: {
show: true, show: true,
lineStyle: { lineStyle: {
color: "rgba(226, 226, 226, 0.3)", color: "rgba(255, 255, 255, 0.2)",
fontSize: 14,
width: 1, width: 1,
}, },
}, },
@ -83,6 +85,7 @@ const getOption = () => {
// //
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
}, },

View File

@ -251,7 +251,7 @@ function getPie3D(pieData, internalDiameterRatio) {
textStyle: { textStyle: {
// //
fontSize: 14, fontSize: 14,
color: "#B8DDFF", color: "#FFFFFF",
lineHeight: 20, lineHeight: 20,
}, },
@ -288,7 +288,7 @@ function getPie3D(pieData, internalDiameterRatio) {
).toFixed(2); ).toFixed(2);
const value = option.series[params.seriesIndex].pieData.value; const value = option.series[params.seriesIndex].pieData.value;
return ( return (
`<div style='color:rgba(214, 243, 255, 0.9);'>` + `<div style='color:#FFFFFF;'>` +
`<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:${params.color};"></span>` + `<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:${params.color};"></span>` +
`${params.seriesName}<br/>` + `${params.seriesName}<br/>` +
`<span style='margin-right:20px'>${value}人</span>` + `<span style='margin-right:20px'>${value}人</span>` +

View File

@ -86,9 +86,9 @@ const getOption = () => {
}, },
legend: { legend: {
data: ["计划生育人数", "计划生育补贴金额"], data: ["计划生育人数", "计划生育补贴金额"],
top: "8%", top: "3%",
textStyle: { textStyle: {
fontSize: 12, fontSize: 14,
color: "#ffffff", // color: "#ffffff", //
}, },
}, },
@ -107,6 +107,7 @@ const getOption = () => {
// //
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
axisTick: { axisTick: {
@ -130,7 +131,8 @@ const getOption = () => {
//线 //线
show: false, show: false,
lineStyle: { lineStyle: {
color: "#ffffff", color: "rgba(255, 255, 255, 0.3)",
fontSize: 14,
width: 1, width: 1,
}, },
}, },
@ -138,6 +140,7 @@ const getOption = () => {
//y //y
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
axisLine: { axisLine: {
@ -145,6 +148,7 @@ const getOption = () => {
show: false, show: false,
lineStyle: { lineStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
width: 1, width: 1,
type: "solid", type: "solid",
}, },
@ -167,13 +171,16 @@ const getOption = () => {
//y //y
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
axisLine: { axisLine: {
//y线 //y线
show: false, show: false,
lineStyle: { lineStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
width: 1, width: 1,
type: "solid", type: "solid",
}, },
@ -186,7 +193,7 @@ const getOption = () => {
show: false, show: false,
lineStyle: { lineStyle: {
type: "solid", type: "solid",
color: "rgb(221, 242, 255,0.1)", color: "rgba(255, 255, 255, 0.3)",
}, },
}, },
axisLine: { axisLine: {
@ -198,9 +205,9 @@ const getOption = () => {
axisLabel: { axisLabel: {
show: false, show: false,
fontSize: 14, fontSize: 14,
fontFamily: "MicrosoftYaHei", color: "#ffffff",
color: "#DEF1FF",
lineHeight: 19, lineHeight: 19,
fontFamily: "MicrosoftYaHei",
}, },
}, },
], ],

View File

@ -39,6 +39,7 @@ const color = [
}, },
]; ];
const option = { const option = {
color,
tooltip: { tooltip: {
trigger: "axis", trigger: "axis",
formatter: "{b0}<br/> {a0}:{c0}<br/>{a1}:{c1}", formatter: "{b0}<br/> {a0}:{c0}<br/>{a1}:{c1}",
@ -53,7 +54,7 @@ const option = {
data: ["上门服务时长", "上门服务次数"], data: ["上门服务时长", "上门服务次数"],
// top: "8%", // top: "8%",
textStyle: { textStyle: {
fontSize: 12, fontSize: 14,
color: "#ffffff", color: "#ffffff",
}, },
}, },
@ -64,10 +65,10 @@ const option = {
bottom: "0%", bottom: "0%",
containLabel: true, containLabel: true,
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
calculable: true, calculable: true,
// color: "rgba(0, 252, 255, 1)",
color,
xAxis: [ xAxis: [
{ {
type: "category", type: "category",
@ -75,6 +76,7 @@ const option = {
// //
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
axisTick: { axisTick: {
@ -97,7 +99,8 @@ const option = {
splitLine: { splitLine: {
show: false, show: false,
lineStyle: { lineStyle: {
color: "#ffffff", color: "rgba(255, 255, 255, 0.3)",
fontSize: 14,
width: 1, width: 1,
}, },
}, },
@ -105,6 +108,7 @@ const option = {
// //
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
axisLine: { axisLine: {
@ -112,6 +116,7 @@ const option = {
show: false, show: false,
lineStyle: { lineStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
width: 1, width: 1,
type: "solid", type: "solid",
}, },
@ -126,13 +131,15 @@ const option = {
splitLine: {//线 splitLine: {//线
show: false, show: false,
lineStyle: { lineStyle: {
color: "#ffffff", color: "rgba(255, 255, 255, 0.3)",
width: 1, width: 1,
fontSize: 14,
}, },
}, },
axisLabel: {//y axisLabel: {//y
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
axisLine: { axisLine: {
@ -140,6 +147,7 @@ const option = {
show: false, show: false,
lineStyle: { lineStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
width: 1, width: 1,
type: "solid", type: "solid",
}, },

View File

@ -1,8 +1,5 @@
<template> <template>
<div <div ref="chart" style="width: 100%; height: 260px"></div>
ref="chart"
style="width: 100%; height: 260px"
></div>
</template> </template>
<script setup> <script setup>
@ -36,15 +33,12 @@ const chart = ref(null); // 创建DOM引用
// const data = ["", "", "", "", "", ""]; // const data = ["", "", "", "", "", ""];
// const datas = ["8", "10", "7", " 23", "25", "250"]; // const datas = ["8", "10", "7", " 23", "25", "250"];
const data = reactive({ const data = reactive({
list1: [], list1: [],
list2: [], list2: [],
option: {}, option: {},
}); });
let zoomShow = true; let zoomShow = true;
// if (data.length > 7) { // if (data.length > 7) {
// zoomShow = true; // zoomShow = true;
@ -67,9 +61,11 @@ const getOption = () => {
bottom: "3%", bottom: "3%",
containLabel: true, containLabel: true,
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
dataZoom: [ dataZoom: [
{// {
//
show: zoomShow, show: zoomShow,
type: "inside", type: "inside",
startValue: 0, startValue: 0,
@ -81,7 +77,8 @@ const getOption = () => {
moveOnMouseWheel: true, // moveOnMouseWheel: true, //
moveOnMouseMove: true, // moveOnMouseMove: true, //
}, },
{ //使 {
//使
show: zoomShow, show: zoomShow,
type: "slider", type: "slider",
realtime: true, realtime: true,
@ -97,7 +94,7 @@ const getOption = () => {
showDataShadow: false, // auto showDataShadow: false, // auto
showDetail: false, // showDetail: false, //
top: "1%", top: "1%",
right: "8",// right: "8", //
}, },
], ],
// dataZoom: [ // dataZoom: [
@ -135,6 +132,7 @@ const getOption = () => {
// //
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
// formatter: `{value}/` // x // formatter: `{value}/` // x
formatter: function (value, index) { formatter: function (value, index) {
@ -151,6 +149,7 @@ const getOption = () => {
show: true, show: true,
lineStyle: { lineStyle: {
color: "rgba(255, 255, 255, 0.2)", color: "rgba(255, 255, 255, 0.2)",
fontSize: 14,
width: 1, width: 1,
}, },
}, },
@ -170,6 +169,7 @@ const getOption = () => {
// bargap: 0.5, // // bargap: 0.5, //
textStyle: { textStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
}, },
}, },
//y线 //y线
@ -177,6 +177,7 @@ const getOption = () => {
show: false, show: false,
lineStyle: { lineStyle: {
color: "#ffffff", color: "#ffffff",
fontSize: 14,
width: 1, width: 1,
type: "solid", type: "solid",
}, },
@ -188,7 +189,8 @@ const getOption = () => {
splitLine: { splitLine: {
show: false, show: false,
lineStyle: { lineStyle: {
color: "#ffffff", color: "rgba(255, 255, 255, 0.2)",
fontSize: 14,
width: 1, width: 1,
}, },
}, },
@ -215,8 +217,8 @@ const getOption = () => {
}, },
}, },
], ],
};
}; };
}
// onMounted(() => { // onMounted(() => {
// // domecharts // // domecharts

View File

@ -637,62 +637,6 @@ const ylwsList = ref([
}, },
]); ]);
// const whsyList = ref([
// {
// name: "()",
// value: "198",
// dw: "",
// },
// {
// name: "",
// value: "1983",
// dw: "",
// },
// {
// name: "",
// value: "2787",
// dw: "",
// },
// {
// name: "",
// value: "1.292.874",
// dw: "",
// },
// {
// name: "",
// value: "1.724.012",
// dw: "",
// },
// ]);
// const tysyList = ref([
// {
// name: "",
// value: "100",
// img: footerball,
// },
// {
// name: "",
// value: "100",
// img: baskerball,
// },
// {
// name: "",
// value: "100",
// img: tableTennis,
// },
// {
// name: "",
// value: "100",
// img: badminton,
// },
// {
// name: "绿",
// value: "100",
// dw: "km",
// img: running,
// },
// ]);
const jtsyList = ref([ const jtsyList = ref([
{ {