From bc1c8864584375da6d978fd77a22de5f84d28f9a Mon Sep 17 00:00:00 2001 From: jiangyy Date: Fri, 6 Jan 2023 17:20:41 +0800 Subject: [PATCH] =?UTF-8?q?=E6=95=B0=E6=8D=AE=E7=9C=8B=E6=9D=BF?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/assets/images/shuju/renfang/jm-logo.png | Bin 0 -> 1494 bytes .../dataBoard/renfang/cpts/jmBarOption.js | 140 +++++++ .../dataBoard/renfang/cpts/jmPieOption.js | 90 +++++ src/views/dataBoard/renfang/cpts/jmgl.vue | 376 +++++++++++++++++- 4 files changed, 601 insertions(+), 5 deletions(-) create mode 100644 src/assets/images/shuju/renfang/jm-logo.png create mode 100644 src/views/dataBoard/renfang/cpts/jmBarOption.js create mode 100644 src/views/dataBoard/renfang/cpts/jmPieOption.js diff --git a/src/assets/images/shuju/renfang/jm-logo.png b/src/assets/images/shuju/renfang/jm-logo.png new file mode 100644 index 0000000000000000000000000000000000000000..73ebb254139f05c78711542c056486fad42d8048 GIT binary patch literal 1494 zcmV;{1u6Q8P)Px)kV!;AR9HvFmwk+!RTaj6&&=#Dr5H=2w!5?2ZkMJ~n%YKV1JP=mO;I$8iS;X* z!bbLE-t9jYH4xfBs6oNhXw1xh(9rS`O+rF)S8>6xyyc3%Xma5L%g? znaA9hU7b#+-Cftj^ViJ0_uTWl=Y7sOcf|kMG~4*?18$#$4&YKH80T_E@}Je&+4^5- z-9-WJuoHW8bXnYLb4B$g5=G!)CD@hk(~JKt$OQq?gT96`Lx#0AfhTPms(vdW23D=M5QXPT@V$mhxTSc8yCpgduO`GZ z3mdurg)i&%dV8D)kk0uhHXld4-qgt2<2UK#OeacbJ!t3+*-EBZXeb zLcboU-Rm5HWy4-mn&gjRQ6fQ4KBIeQ3Lc(cb-i8Qph|rmDZBbKYsQ8#q4JuTXNcw$=f6S1Jr6&NL@kbfj04!MSy>7rV%Qn@>pm zvta=%PIT$js_gtHMmp<*hOH9Ag-9W#v$oJDiWQE>T1c|K(5Gjno#PBm@GPbsaraoH zTj~O|6~w{*&iya5NYLw0KN}wmpD|26vQ)YOJ}{=5TClK zk)_AG^_Q9q++}mC#G{2sopk|P2mI+ug&#>wCgIA_NH5QpAf5ArHeZq$DMVUV?bk8n zx4&8Ds7+epu0o{S>H=JKz>TNJ83mRge%q5_(;ZS}CWzKSf2>mGr(s=f`L^%#(&8CH z{ci~s($qjlb#~5cL~S{Ls%##P#U#Gjonhz2AeLvnx&(&|Er=sM88#d}h@Kc{R|VD! zK5SSN`alA<z@dnU_2|`*jm8n+*AI(P^X&v%f zm$?~n8nY^N!!TE-f{rJWY|HoQXLU7D`>xYj-)8v6Od1HaolLQPv`0tlt!>HrbHI0j zrJ)-plWdtT)4H!<)32O5_B=P++-_Jfm4&~GcutJjBqdrf>*DwOmIbl?ura~T6B(VT z1!>>sMa46Osk$Z%r-n;ed7?|F&jaWf^0GI}JYush9w6oiK&~g^$yzan?l*2Wl`DM3 z=DKOnr0D!}M)6Rqw)P=kSuF8;;Iip*Ja-y~ZU%=js|ClB;`5`Cj?DB5!t=JQuPuuQ zG4Dc5B%m{BqSm)H=X)yVYeBT#85aK=pnab&DW2sJ<^#avDe=kCNPnMA@aZ*Emzkg2 zygQ^h1shNH>-p+E+6Miha+zPp;!Vb7`j(}0-ea>v;$;@Hp>Tu3C1TFjy4NdRwJO-U)xIOcp7-G;Hg5tuD&QhOV;6rvLuz{+R;A!a=rlZp$6RR3WMQu zLn9q0yA@wnYE9{3uks`>0IxNtc*pcrYQ7N5hul0_Vk{P0g04bF`|AS?daKJE1fCx2 z*Zb!ixY|FR^Ql;ju&2NSq}0Ht%jTA~^A(uMY(^}pl!fLzS?U)ggV!Z literal 0 HcmV?d00001 diff --git a/src/views/dataBoard/renfang/cpts/jmBarOption.js b/src/views/dataBoard/renfang/cpts/jmBarOption.js new file mode 100644 index 000000000..1c24850ab --- /dev/null +++ b/src/views/dataBoard/renfang/cpts/jmBarOption.js @@ -0,0 +1,140 @@ +import * as echarts from 'echarts' +export function barOption () { + + return { + title: { + text: '单位（人）', + left: 5, + textStyle: { + + fontSize: 14, + color: " rgba(255,255,255,0.65)", + fontWeight: 400, + }, + }, + tooltip: { + trigger: 'axis', + axisPointer: { + type: 'shadow' + } + }, + // legend: {}, + grid: { + top:40, + left: '3%', + right: '4%', + bottom: 19, + containLabel: true + }, + xAxis: [ + { + type: 'category', + axisLine: { + lineStyle: { + color:'rgba(255,255,255,0.15)', + width: 1, + type: 'solid' + } + }, + axisTick: { + alignWithLabel: true + }, + axisLabel: { + show: true, + textStyle: { + color: 'rgba(255,255,255,0.85)', //更改坐标轴文字颜色 + fontSize : 12 //更改坐标轴文字大小 + } + }, + + data: [] + } + ], + yAxis: [ + { + type: 'value', + max : 1000, + splitNumber : 5, + splitLine: { + show: true, + lineStyle:{ + color:'rgba(255,255,255,0.15)', + width: 1, + type: 'solid' + } + }, + axisLabel: { + show: true, + textStyle: { + color: 'rgba(255,255,255,0.85)', //更改坐标轴文字颜色 + fontSize : 12 //更改坐标轴文字大小 + } + }, + } + ], + series: [ + + { + name: '常住人口', + type: 'line', + stack: 'Total', + barWidth:12, + emphasis: { + focus: 'series' + }, + itemStyle: { + normal: { + color: "#FFAA00", //图例颜色 + borderWidth: 2, + borderColor: "#FFAA00", + lineStyle: { color: "#FFAA00", width: 1 } + } + }, + + areaStyle: { + normal: { + // 渐变填充色（线条下半部分） + color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ + { offset: 0, color: "#FFAA00" }, + { offset: 1, color: "rgba(255,170,0,0)" } + ]) + } + }, + + data: [] + }, + { + name: '流动人口', + type: 'line', + barWidth:12, + stack: 'Total', + emphasis: { + focus: 'series' + }, + itemStyle: { + normal: { + color: "#1A95FF", //图例颜色 + borderWidth: 2, + borderColor: "#1A95FF", + lineStyle: { color: "#1A95FF", width: 1 } + } + }, + + areaStyle: { + normal: { + // 渐变填充色（线条下半部分） + color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ + { offset: 0, color: "#1A95FF" }, + { offset: 1, color: "rgba(255,170,0,0)" } + ]) + } + }, + data: [] + }, + + + + ] + + } +} diff --git a/src/views/dataBoard/renfang/cpts/jmPieOption.js b/src/views/dataBoard/renfang/cpts/jmPieOption.js new file mode 100644 index 000000000..99480650b --- /dev/null +++ b/src/views/dataBoard/renfang/cpts/jmPieOption.js @@ -0,0 +1,90 @@ +import * as echarts from 'echarts' +export function pieOption() { + const center = ["50%", "170px"]; + return { + title: { + text: "0", + top: 45, + left: "center", + textStyle: { + width: "100%", + fontSize: 24, + color: "#FFFFFF", + fontWeight: 400, + }, + itemGap: 5, + // subtext: "总数", + // subtextStyle: { + // fontSize: 20, + // color: "#fff", + // fontWeight: 400, + // }, + }, + tooltip: { + show: false, + }, + // legend: { + // top: 350, + // bottom: 0, + // itemWidth: 20, + // itemHeight: 10, + // textStyle: { + // color: '#D2E7FF', + // fontSize: 16, + // lineHeight: 20, + // }, + + // }, + series: [ + { + name: 'Access From', + type: 'pie', + radius: ['60%', '90%'], + avoidLabelOverlap: false, + label: { + show: false, + position: 'center' + }, + // emphasis: { + // label: { + // show: true, + // fontSize: 40, + // fontWeight: 'bold' + // } + // }, + labelLine: { + show: false + }, + itemStyle: { + normal: { + color: (list) => { + // 注意 ！！！！！ 这里的数组一定要和实际的类目长度相等或大于，不然会缺少颜色报错 + var colorList = [ + { + colorStart:'#00023A', + colorEnd:'#6FDEFF' + }, + { + colorStart:'#00023A', + colorEnd:'#FFAA00' + }, + + + ] + return new echarts.graphic.LinearGradient(1, 0, 0, 0, [{ //左、下、右、上 + offset: 0, + color: colorList[list.dataIndex]['colorStart'] + }, { + offset: 1, + color: colorList[list.dataIndex]['colorEnd'] + }]) + } + } + }, + + data: [ + ] + } + ] + }; +} diff --git a/src/views/dataBoard/renfang/cpts/jmgl.vue b/src/views/dataBoard/renfang/cpts/jmgl.vue index edaf98176..747f610a9 100644 --- a/src/views/dataBoard/renfang/cpts/jmgl.vue +++ b/src/views/dataBoard/renfang/cpts/jmgl.vue @@ -1,9 +1,107 @@ - +