From 645289f07bf498f0df85aeaa9a4906237a2cd70d Mon Sep 17 00:00:00 2001 From: yaoyuhao Date: Thu, 17 Oct 2024 16:41:38 +0800 Subject: [PATCH] gx --- src/assets/images/jz/sjx.png | Bin 0 -> 1289 bytes src/assets/images/jz/wfjw1.png | Bin 0 -> 4921 bytes src/assets/images/jz/wfjw2.png | Bin 0 -> 1498 bytes src/view/echarts_jz/eP1.vue | 296 +++++++++++++++++++++++++++ src/view/echarts_jz/eP3.vue | 320 ++++++++++++++++++++++------- src/view/echarts_jz/eP4.vue | 296 +++++++++++++++++++++++++++ src/view/echarts_jz/zwfw1.vue | 190 ++++++++--------- src/view/echarts_jz/zwfw2.vue | 198 +++++++++--------- src/view/sy_map.vue | 14 +- src/view/table_gk/gk_jz.vue | 361 +++++++++++++++++++++++++++++---- 10 files changed, 1360 insertions(+), 315 deletions(-) create mode 100644 src/assets/images/jz/sjx.png create mode 100644 src/assets/images/jz/wfjw1.png create mode 100644 src/assets/images/jz/wfjw2.png create mode 100644 src/view/echarts_jz/eP1.vue create mode 100644 src/view/echarts_jz/eP4.vue diff --git a/src/assets/images/jz/sjx.png b/src/assets/images/jz/sjx.png new file mode 100644 index 0000000000000000000000000000000000000000..db2fe144dd3bd3d5114847e97c64c5dd197eed7a GIT binary patch literal 1289 zcmV+k1@`)hP)Px(!%0LzR9HvV*^S17BklK{gc43jqD2&6e>ssD|UZES%lWoFM}QdHN8dLy%t+xt-~JvgWa^4WH8BM zM&>wjB8V@D7bGT%g1byn>?Bd1?I@b)%db*unkSG8mbYMX);Nwl=YvT*YyK z!{Zc2hw~QOTdX(OypW*cl297O6-qmzkjV;_NG@aYGUQRI2PvAjM4XoP(k}KiTnc#O zaEimCS1$EfHwT6}GRiEyEEM0&V0!Hul42#3T}P_O7yl(698$E?_n@3r>M2mu)27hU z(#{goPaNEpIo%+kIRZ5j4F%PEn0> z1PV>Igx?|`Wq7^LyH5Dw8O!y{4d07UM9V8=XNjqhoFgjIdm@oO1!CJ1Yl?L&-n~N6 z*+$3W6gh7c^R`IP@#nX2sht6vmJlPs1R9fRjH5Ay##+M99ba?G;=#j@W5bQhmhX%s zl|ocx$wYDVKF!Vq`kJDSMLKeQ?9^sC0qlRr{k4JHZtz-O-w-rC<7uSODiTEs&F#pS z%hq`cyIeMfYgv!cF4zo`X$E5w8WaAHb^|c=N4}gjh&ab zcv?--3vIGAzxLc*1$Z<@;j5P%?*_*Mljszx&60ZJWP_;Ptm9CDI{hs+$`rWwCtmYe z1eQXJ;uNU~TAJG(pFaw4y0S66ztixErq?;T4NtE?ze&2^lb$@#^1)8v<8uQaXNf)B z+%ddI;PBif9(M8CG|BKexb}~kwSG|RT>OYr-Hi-y{BKj;c^3=1J{Vg*ee8>cwO?*M z6${qKx#ZWSJ}vp&OaA&+x3(`$Yya9=cNW(6#r>(+`p}2&T5lfJSz&P#Nq=8=x%B$U zY`?Aj24;j2y literal 0 HcmV?d00001 diff --git a/src/assets/images/jz/wfjw1.png b/src/assets/images/jz/wfjw1.png new file mode 100644 index 0000000000000000000000000000000000000000..fb805dafd9565ee04700fd78d0e5362be0555044 GIT binary patch literal 4921 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 literal 0 HcmV?d00001 diff --git a/src/assets/images/jz/wfjw2.png b/src/assets/images/jz/wfjw2.png new file mode 100644 index 0000000000000000000000000000000000000000..da5f59148b0e3fe64eba8604c1601c8f5ab282f7 GIT binary patch literal 1498 zcmV<01tt24P)Px)lu1NERCr$Poo#CrF%*SUTlGh)_=1QCA`}XxANoIiT{$6VID4DfUE_vMnzJy> z?$jBRn}>6AlT7Z#ZnwKnDg8<*{YfePmIJ?ejo)|W8qRto`Hk=X%w>U#loAen_?_ox za7F3XwU@tfDKE_S=!T>ueK0zg7aC;=e;7GcESam^oF01y&D1rxyGx59WOfD+0} z0C`(L1AqXIAo4fWQP0Pe(oHju1x{5)DkPPWK;jG_^BF+i6bK0;L9Ds&2qnR!%hvNe zO)_^)6-Zb@6;dHom%S)r0dav6KwcLh0U{5=NY_m_UQUk7VDmrjqkD%iJ}NP-2`GSkPM7^PrKB*{lu{Kl zM%=2540z^lp1EqT!3)(fM%FQ+RuEMopF<(P6lJVINf2Xz!)Ti@s#?y~9ImYn^#D9| z*>Q-6eZ?A(P{=&&^I3q5P%_Xt6yTr$I`rcqpt&H`phkg=Q8nGQM%7eDz_t&Veosk1WL zk6d%v50o*b^nxz?!-_&irPOIeRY{G!=WGtwn*B&d)Kp0Vxl9ep5Knf|#Z@ogp^)!I zAps$kQlstKTsK{|1~iVc=Yz90cg-kUhk0;qZ_Kg$hB5-kMIql6g(QqrM)oIbflVBb z)M$IYCUK2pFvEFko?}3>*KaH^=4(*Mw*^QjBOz2M;~ck+Nk*0QOwD|7#-K*WAoo`C z$eeX_*Hp+1JZS{f(wPweaN|ito0!YV{IV? zT{hK`P-Y-s7Z_C~0bv{@kFzy8eW=3uJGAgguCXh8D$g5?*b+OjN_5I(BjzY@wuC4uG;H3WNnqt+LU1) zca$NYmj-e!aC+6&K=!h%pW9>s1KDIY-_*+j2C|oB{oE!C7|15G`KDeLFp#}0>*qFE zz(6*c%{TS3fPw5~SwFYQ0tT|lY`&?N1q@^_%lf%Z7BG-aX7f$GEMOpeS=P^OvVehX zGMjJeWdQ@(%d&oMlLZW9li7SzFAEsRUY7N9n=D`;o6P2$dRf3g_Oh&>+hhR)*djlR`Vo_#w$Z&jgRtQnHwPfuvX;R#lFK6;{ z;-sxL?^xxDK}{Sa*WGh<^ZQz^n!LxjQ_GD7z}89|fmDU8<;XsoTF%Kgx7Nhtm8a&i z*{4(}PfEV&^u*%J&l-FHmtzL%i$FN|(Pu7vJU%>V!Z07*qoM6N<$f|%;e A +
+ + + + + \ No newline at end of file diff --git a/src/view/echarts_jz/eP3.vue b/src/view/echarts_jz/eP3.vue index 3ebb754..3187942 100644 --- a/src/view/echarts_jz/eP3.vue +++ b/src/view/echarts_jz/eP3.vue @@ -33,6 +33,13 @@ const colors = [ bottom: "rgba(14, 252, 255, .46)", front: "rgba(14, 252, 255, .66)", }, + { + left: "rgba(60, 143, 255, .16)", + right: "rgba(60, 143, 255, .6)", + top: "rgba(60, 143, 255, 1)", + bottom: "rgba(60, 143, 255, .46)", + front: "rgba(60, 143, 255, .66)", + }, ]; // const valueList = [20, 53, 47, 65, 29, 11, 10]; const data = reactive({ @@ -41,7 +48,8 @@ const data = reactive({ Max: 20000, valueList: [4504, 16086, 6130, 2844, 4967, 179, 1685, 5010], valueList2: [1181, 2177, 3720, 3711, 4642, 1654, 3395, 5552], - xxname: ["2020", "2021", "2022", "2023"], + valueList3: [1181, 2177, 3720, 3711, 4642, 1654, 3395, 5552], + xxname: ["1月", "2月", "3月", "4月","5月"], }); // 注册5个面图形:左侧、前面、右面、上面、下面 //c0:左下角，c1：右下角,c2:右上角，c3：左上角 @@ -55,8 +63,8 @@ const CubeLeft_1 = echarts.graphic.extendShape({ // 会canvas的应该都能看得懂，shape是从custom传入的 const xAxisPoint = shape.xAxisPoint; const c0 = [shape.x - 40, shape.y]; - const c1 = [shape.x - 27, shape.y - 14]; - const c2 = [xAxisPoint[0] - 27, xAxisPoint[1] - 14]; + const c1 = [shape.x - 30, shape.y - 10]; + const c2 = [xAxisPoint[0] - 30, xAxisPoint[1] - 10]; const c3 = [xAxisPoint[0] - 40, xAxisPoint[1]]; ctx .moveTo(c0[0], c0[1]) @@ -75,8 +83,8 @@ const CubeFront_1 = echarts.graphic.extendShape({ // 会canvas的应该都能看得懂，shape是从custom传入的 const xAxisPoint = shape.xAxisPoint; const c0 = [shape.x - 40, shape.y]; - const c1 = [shape.x - 18, shape.y]; - const c2 = [xAxisPoint[0] - 18, xAxisPoint[1]]; + const c1 = [shape.x - 28, shape.y]; + const c2 = [xAxisPoint[0] - 28, xAxisPoint[1]]; const c3 = [xAxisPoint[0] - 40, xAxisPoint[1]]; ctx .moveTo(c0[0], c0[1]) @@ -93,10 +101,10 @@ const CubeRight_1 = echarts.graphic.extendShape({ }, buildPath: function (ctx, shape) { const xAxisPoint = shape.xAxisPoint; - const c0 = [shape.x - 18, shape.y]; - const c1 = [shape.x - 5, shape.y - 14]; - const c2 = [xAxisPoint[0] - 5, xAxisPoint[1] - 14]; - const c3 = [xAxisPoint[0] - 18, xAxisPoint[1]]; + const c0 = [shape.x - 28, shape.y]; + const c1 = [shape.x - 17, shape.y - 10]; + const c2 = [xAxisPoint[0] - 18, xAxisPoint[1] - 10]; + const c3 = [xAxisPoint[0] - 28, xAxisPoint[1]]; ctx .moveTo(c0[0], c0[1]) .lineTo(c1[0], c1[1]) @@ -112,9 +120,9 @@ const CubeTop_1 = echarts.graphic.extendShape({ }, buildPath: function (ctx, shape) { const c0 = [shape.x - 40, shape.y]; - const c1 = [shape.x - 18, shape.y]; - const c2 = [shape.x - 5, shape.y - 14]; - const c3 = [shape.x - 27, shape.y - 14]; + const c1 = [shape.x - 28, shape.y]; + const c2 = [shape.x - 18, shape.y - 10]; + const c3 = [shape.x - 30, shape.y - 10]; ctx .moveTo(c0[0], c0[1]) .lineTo(c1[0], c1[1]) @@ -133,9 +141,9 @@ const CubeBottom_1 = echarts.graphic.extendShape({ const xAxisPoint = shape.xAxisPoint; const c0 = [xAxisPoint[0] - 40, xAxisPoint[1]]; - const c1 = [xAxisPoint[0] - 18, xAxisPoint[1]]; - const c2 = [xAxisPoint[0] - 5, xAxisPoint[1] - 14]; - const c3 = [xAxisPoint[0] - 27, xAxisPoint[1] - 14]; + const c1 = [xAxisPoint[0] - 28, xAxisPoint[1]]; + const c2 = [xAxisPoint[0] - 18, xAxisPoint[1] - 10]; + const c3 = [xAxisPoint[0] - 30, xAxisPoint[1] - 10]; ctx .moveTo(c0[0], c0[1]) @@ -160,10 +168,10 @@ const CubeLeft_2 = echarts.graphic.extendShape({ buildPath: function (ctx, shape) { // 会canvas的应该都能看得懂，shape是从custom传入的 const xAxisPoint = shape.xAxisPoint; - const c0 = [shape.x - 0, shape.y]; - const c1 = [shape.x + 13, shape.y - 14]; - const c2 = [xAxisPoint[0] + 13, xAxisPoint[1] - 14]; - const c3 = [xAxisPoint[0] - 0, xAxisPoint[1]]; + const c0 = [shape.x - 15, shape.y]; + const c1 = [shape.x - 2, shape.y - 10]; + const c2 = [xAxisPoint[0] - 2, xAxisPoint[1] - 10]; + const c3 = [xAxisPoint[0] - 15, xAxisPoint[1]]; ctx .moveTo(c0[0], c0[1]) .lineTo(c1[0], c1[1]) @@ -180,10 +188,10 @@ const CubeFront_2 = echarts.graphic.extendShape({ buildPath: function (ctx, shape) { // 会canvas的应该都能看得懂，shape是从custom传入的 const xAxisPoint = shape.xAxisPoint; - const c0 = [shape.x - 0, shape.y]; - const c1 = [shape.x + 22, shape.y]; - const c2 = [xAxisPoint[0] + 22, xAxisPoint[1]]; - const c3 = [xAxisPoint[0] - 0, xAxisPoint[1]]; + const c0 = [shape.x - 15, shape.y]; + const c1 = [shape.x -3, shape.y]; + const c2 = [xAxisPoint[0] -3, xAxisPoint[1]]; + const c3 = [xAxisPoint[0] - 15, xAxisPoint[1]]; ctx .moveTo(c0[0], c0[1]) .lineTo(c1[0], c1[1]) @@ -199,10 +207,10 @@ const CubeRight_2 = echarts.graphic.extendShape({ }, buildPath: function (ctx, shape) { const xAxisPoint = shape.xAxisPoint; - const c0 = [shape.x + 22, shape.y]; - const c1 = [shape.x + 35, shape.y - 14]; - const c2 = [xAxisPoint[0] + 35, xAxisPoint[1] - 14]; - const c3 = [xAxisPoint[0] + 22, xAxisPoint[1]]; + const c0 = [shape.x -3, shape.y]; + const c1 = [shape.x + 10, shape.y - 10]; + const c2 = [xAxisPoint[0] + 10, xAxisPoint[1] - 10]; + const c3 = [xAxisPoint[0] - 3, xAxisPoint[1]]; ctx .moveTo(c0[0], c0[1]) .lineTo(c1[0], c1[1]) @@ -217,10 +225,10 @@ const CubeTop_2 = echarts.graphic.extendShape({ y: 0, }, buildPath: function (ctx, shape) { - const c0 = [shape.x - 0, shape.y]; - const c1 = [shape.x + 22, shape.y]; - const c2 = [shape.x + 35, shape.y - 14]; - const c3 = [shape.x + 13, shape.y - 14]; + const c0 = [shape.x - 15, shape.y]; + const c1 = [shape.x - 3, shape.y]; + const c2 = [shape.x + 10, shape.y - 10]; + const c3 = [shape.x - 2, shape.y - 10]; ctx .moveTo(c0[0], c0[1]) .lineTo(c1[0], c1[1]) @@ -238,10 +246,10 @@ const CubeBottom_2 = echarts.graphic.extendShape({ // 会canvas的应该都能看得懂，shape是从custom传入的 const xAxisPoint = shape.xAxisPoint; - const c0 = [xAxisPoint[0] - 0, xAxisPoint[1]]; - const c1 = [xAxisPoint[0] + 22, xAxisPoint[1]]; - const c2 = [xAxisPoint[0] + 35, xAxisPoint[1] - 14]; - const c3 = [xAxisPoint[0] + 13, xAxisPoint[1] - 14]; + const c0 = [xAxisPoint[0] - 15, xAxisPoint[1]]; + const c1 = [xAxisPoint[0] -3, xAxisPoint[1]]; + const c2 = [xAxisPoint[0] + 10, xAxisPoint[1] - 10]; + const c3 = [xAxisPoint[0] -2, xAxisPoint[1] - 10]; ctx .moveTo(c0[0], c0[1]) @@ -259,15 +267,123 @@ echarts.graphic.registerShape("CubeTop_2", CubeTop_2); echarts.graphic.registerShape("CubeBottom_2", CubeBottom_2); // ------------------------------ +const CubeLeft_3 = echarts.graphic.extendShape({ + shape: { + x: 0, + y: 0, + }, + buildPath: function (ctx, shape) { + // 会canvas的应该都能看得懂，shape是从custom传入的 + const xAxisPoint = shape.xAxisPoint; + const c0 = [shape.x + 15, shape.y]; + const c1 = [shape.x + 28, shape.y - 10]; + const c2 = [xAxisPoint[0] + 28, xAxisPoint[1] - 10]; + const c3 = [xAxisPoint[0] + 15, xAxisPoint[1]]; + ctx + .moveTo(c0[0], c0[1]) + .lineTo(c1[0], c1[1]) + .lineTo(c2[0], c2[1]) + .lineTo(c3[0], c3[1]) + .closePath(); + }, +}); +const CubeFront_3 = echarts.graphic.extendShape({ + shape: { + x: 0, + y: 0, + }, + buildPath: function (ctx, shape) { + // 会canvas的应该都能看得懂，shape是从custom传入的 + const xAxisPoint = shape.xAxisPoint; + const c0 = [shape.x + 15, shape.y]; + const c1 = [shape.x + 27, shape.y]; + const c2 = [xAxisPoint[0] + 27, xAxisPoint[1]]; + const c3 = [xAxisPoint[0] + 15, xAxisPoint[1]]; + ctx + .moveTo(c0[0], c0[1]) + .lineTo(c1[0], c1[1]) + .lineTo(c2[0], c2[1]) + .lineTo(c3[0], c3[1]) + .closePath(); + }, +}); +const CubeRight_3 = echarts.graphic.extendShape({ + shape: { + x: 0, + y: 0, + }, + buildPath: function (ctx, shape) { + const xAxisPoint = shape.xAxisPoint; + const c0 = [shape.x + 27, shape.y]; + const c1 = [shape.x + 40, shape.y - 10]; + const c2 = [xAxisPoint[0] + 40, xAxisPoint[1] - 10]; + const c3 = [xAxisPoint[0] + 27, xAxisPoint[1]]; + ctx + .moveTo(c0[0], c0[1]) + .lineTo(c1[0], c1[1]) + .lineTo(c2[0], c2[1]) + .lineTo(c3[0], c3[1]) + .closePath(); + }, +}); +const CubeTop_3 = echarts.graphic.extendShape({ + shape: { + x: 0, + y: 0, + }, + buildPath: function (ctx, shape) { + const c0 = [shape.x + 15, shape.y]; + const c1 = [shape.x + 27, shape.y]; + const c2 = [shape.x + 40, shape.y - 10]; + const c3 = [shape.x + 28, shape.y - 10]; + ctx + .moveTo(c0[0], c0[1]) + .lineTo(c1[0], c1[1]) + .lineTo(c2[0], c2[1]) + .lineTo(c3[0], c3[1]) + .closePath(); + }, +}); +const CubeBottom_3 = echarts.graphic.extendShape({ + shape: { + x: 0, + y: 0, + }, + buildPath: function (ctx, shape) { + // 会canvas的应该都能看得懂，shape是从custom传入的 + const xAxisPoint = shape.xAxisPoint; + + const c0 = [xAxisPoint[0] + 15, xAxisPoint[1]]; + const c1 = [xAxisPoint[0] + 27, xAxisPoint[1]]; + const c2 = [xAxisPoint[0] + 40, xAxisPoint[1] - 10]; + const c3 = [xAxisPoint[0] + 28, xAxisPoint[1] - 10]; + + ctx + .moveTo(c0[0], c0[1]) + .lineTo(c1[0], c1[1]) + .lineTo(c2[0], c2[1]) + .lineTo(c3[0], c3[1]) + .closePath(); + }, +}); + +echarts.graphic.registerShape("CubeLeft_3", CubeLeft_3); +echarts.graphic.registerShape("CubeFront_3", CubeFront_3); +echarts.graphic.registerShape("CubeRight_3", CubeRight_3); +echarts.graphic.registerShape("CubeTop_3", CubeTop_3); +echarts.graphic.registerShape("CubeBottom_3", CubeBottom_3); + +//-------------------------------- const getOption = () => { data.option = { legend: { data: [ - "适龄生育妇女", - "育龄妇女", + "房屋数量", + "入住数量", + "保障性租赁住房" ], top: "0%", - right: "30%", + right: "10%", textStyle: { fontSize: 16, color: "#ffffff", @@ -275,7 +391,7 @@ const getOption = () => { }, tooltip: { trigger: "axis", - formatter: "{b0}:
{a0}:{c0}
{a1}:{c1}", + formatter: "{b0}:
{a0}:{c0}
{a1}:{c1}
{a2}:{c2}", }, grid: { left: 0, @@ -353,7 +469,7 @@ const getOption = () => { series: [ { xAxisIndex: 0, - name: "适龄生育妇女", + name: "房屋数量", type: "custom", renderItem: (params, api) => { const location = api.coord([api.value(0), api.value(1)]); @@ -446,7 +562,7 @@ const getOption = () => { }, { xAxisIndex: 0, - name: "育龄妇女", + name: "入住数量", type: "custom", renderItem: (params, api) => { const location = api.coord([api.value(0), api.value(1)]); @@ -537,44 +653,98 @@ const getOption = () => { }, data: data.valueList2, }, - //顶部字体 { - type: "bar", - xAxisIndex: 1, - label: { + xAxisIndex: 0, + name: "保障性租赁住房", + type: "custom", + renderItem: (params, api) => { + const location = api.coord([api.value(0), api.value(1)]); + + return { + type: "group", + children: [ + { + type: "CubeBottom_3", + shape: { + api, + xValue: api.value(0), + yValue: api.value(1), + x: location[0], + y: location[1], + xAxisPoint: api.coord([api.value(0), 0]), + }, + style: { + fill: colors[2]["bottom"], + }, + }, + { + type: "CubeLeft_3", + shape: { + api, + xValue: api.value(0), + yValue: api.value(1), + x: location[0], + y: location[1], + xAxisPoint: api.coord([api.value(0), 0]), + }, + style: { + fill: colors[2]["left"], + }, + }, + { + type: "CubeFront_3", + shape: { + api, + xValue: api.value(0), + yValue: api.value(1), + x: location[0], + y: location[1], + xAxisPoint: api.coord([api.value(0), 0]), + }, + style: { + fill: colors[2]["front"], + }, + }, + { + type: "CubeRight_3", + shape: { + api, + xValue: api.value(0), + yValue: api.value(1), + x: location[0], + y: location[1], + xAxisPoint: api.coord([api.value(0), 0]), + }, + style: { + fill: colors[2]["right"], + }, + }, + { + type: "CubeTop_3", + shape: { + api, + xValue: api.value(0), + yValue: api.value(1), + x: location[0], + y: location[1], + xAxisPoint: api.coord([api.value(0), 0]), + }, + style: { + fill: colors[2]["top"], + }, + }, + ], + }; + }, + //设置图例颜色 + itemStyle: { show: true, - fontSize: 18, - position: "top", - color: "#ffffff", - formatter: function (data) { - return data.value - 5; + color: { + type: "linear", + colorStops: [{ offset: 1, color: "rgba(60, 143, 255, 1)" }], }, }, - itemStyle: { - color: "rgba(221, 242, 255, 0)", - }, - - data: data.valueList.map((item) => parseInt(item) + 5), - barWidth: 30, - }, - { - type: "bar", - xAxisIndex: 1, - label: { - show: true, - fontSize: 18, - position: "top", - color: "#ffffff", - formatter: function (data) { - return data.value - 5; - }, - }, - itemStyle: { - color: "rgba(221, 242, 255, 0)", - }, - - data: data.valueList2.map((item) => parseInt(item) + 5), - barWidth: 20, + data: data.valueList3, }, ], }; diff --git a/src/view/echarts_jz/eP4.vue b/src/view/echarts_jz/eP4.vue new file mode 100644 index 0000000..ae5de51 --- /dev/null +++ b/src/view/echarts_jz/eP4.vue @@ -0,0 +1,296 @@ + + + + + \ No newline at end of file diff --git a/src/view/echarts_jz/zwfw1.vue b/src/view/echarts_jz/zwfw1.vue index 86908d1..cbe1845 100644 --- a/src/view/echarts_jz/zwfw1.vue +++ b/src/view/echarts_jz/zwfw1.vue @@ -3,7 +3,7 @@ \ No newline at end of file diff --git a/src/view/echarts_jz/zwfw2.vue b/src/view/echarts_jz/zwfw2.vue index 7dd0b5c..a878595 100644 --- a/src/view/echarts_jz/zwfw2.vue +++ b/src/view/echarts_jz/zwfw2.vue @@ -3,7 +3,7 @@ \ No newline at end of file diff --git a/src/view/sy_map.vue b/src/view/sy_map.vue index 229dead..92909de 100644 --- a/src/view/sy_map.vue +++ b/src/view/sy_map.vue @@ -2903,7 +2903,7 @@ const createZyys = (polygon, indexx, name, tooltip) => { } else { zyysCenter.length = 0; zyysDk.length = 0; - await get_dk_zyys(polygon.fgfwrs); + await get_dk_zyys(polygon.fgfwrs,polygon.startAge,polygon.endAge); xr_dk_center_zyys(); } @@ -2955,7 +2955,7 @@ const loadCs_zyys = async (name) => { } } }; -const get_dk_zyys = async (sj) => { +const get_dk_zyys = async (sj,start,end) => { zyys_dk.value.length = 0; zyys_center.value.length = 0; zyys_data.value.point.length = 0; @@ -2966,8 +2966,6 @@ const get_dk_zyys = async (sj) => { zyys_jd.push(itemN.town); } }); - console.log(1111111111111, zyys_jd); - zyys_jd.forEach((item) => { loadCs_zyys(item); }); @@ -2979,7 +2977,7 @@ const get_dk_zyys = async (sj) => { }); zyysCenter.forEach((center) => { if (item.committee == center.name) { - let a = { ...center, num: item.num,town: item.town,committee: item.committee}; + let a = { ...center, num: item.num,town: item.town,committee: item.committee,startAge:start,endAge:end }; zyys_data.value.center.push(a); } }); @@ -3074,10 +3072,10 @@ const Xr_zyysNum = (polygon, indexx) => { zyys_center.value[indexx].addEventListener("click", () => { console.log(polygon); // cfCsZs.value = polygon.name; - open_detail_zyys(polygon.town, polygon.committee); + open_detail_zyys(polygon.town, polygon.committee,polygon.startAge,polygon.endAge); }); }; -const open_detail_zyys = (town,committee) => { +const open_detail_zyys = (town,committee,start,end) => { let age = ""; dialogShow.value = true; http @@ -3086,7 +3084,7 @@ const open_detail_zyys = (town,committee) => { pagination.pageSize }&committee=${committee}&town=${ town - }` + }&startAge=${start}&endAge=${end}` ) .then((res) => { if (res.code == 200) { diff --git a/src/view/table_gk/gk_jz.vue b/src/view/table_gk/gk_jz.vue index dd17ab7..3d0585b 100644 --- a/src/view/table_gk/gk_jz.vue +++ b/src/view/table_gk/gk_jz.vue @@ -1,14 +1,18 @@