From 57e920aab9a1ac1f7b6eb57cfcfc7034516436df Mon Sep 17 00:00:00 2001 From: juwei001 <974220104@qq.com> Date: Tue, 9 Apr 2024 18:23:12 +0800 Subject: [PATCH] =?UTF-8?q?=E9=87=8D=E7=82=B9=E4=BC=81=E4=B8=9A=EF=BC=8C?= =?UTF-8?q?=E7=A7=8D=E9=83=BD=E5=9C=B0=E5=9B=BE=E6=89=93=E7=82=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/assets/images/map/keyQy/jiagong.png | Bin 0 -> 2051 bytes src/assets/images/map/keyQy/yumiao.png | Bin 0 -> 2123 bytes src/assets/images/map/keyQy/yuzhong.png | Bin 0 -> 2647 bytes src/assets/images/map/keyQy/zhongzhi.png | Bin 0 -> 2299 bytes src/components/screen-map-legeng/index.vue | 95 +- .../next/screen-content-map/cpt/point.json | 823 ++++++++++++++++-- .../next/screen-content-map/cpt/zdyf-map.vue | 252 ++++-- .../screen-content-right/home-right/index.vue | 2 +- 8 files changed, 994 insertions(+), 178 deletions(-) create mode 100644 src/assets/images/map/keyQy/jiagong.png create mode 100644 src/assets/images/map/keyQy/yumiao.png create mode 100644 src/assets/images/map/keyQy/yuzhong.png create mode 100644 src/assets/images/map/keyQy/zhongzhi.png diff --git a/src/assets/images/map/keyQy/jiagong.png b/src/assets/images/map/keyQy/jiagong.png new file mode 100644 index 0000000000000000000000000000000000000000..8822189536f3ff98a915cd0fd3447a57bbc5f727 GIT binary patch literal 2051 zcmaJ?c~ld39*?MCkV9*zs1=7n1WHLVAcRCgk_7I>1Iil}&iMj9(q(llP+8(kWvtooJJz4)oP;Jjfg5lB#27IG+arpt}YnDMVTm5@iZNG|RF*r@dwd9}PA(I?kq>jF;NhAGg>}cyCkL=XN1ho$cK8 zh}bpp8R?)^RffiYN2~nM?3y&2$?7yq>&}y*0qMCRAYRw4`;MPFtV10bfmZgx4rY&a zoTj}EPT9dl4dss?CVvZsH|Dc8dOObgkhKZcSGswHt`7d~Vt;DCrT)W! z4N=Y2{myzf{npHTHM5=WQW^XGj+sm57a*=5x5Q2>weEW6R~jz# zez+>@TvmKe!%Cl_!>cxoc2iGPtdO2-9&wn7eQCSF%!;pd(z6u}ZLMAPJ8o^!Sp?>c z{(R`_1F89EumAeIxo!ODnFO23M_=gnO1i?u|H%JB*!Z~fbWZf<*3lel;x!sAaeR2h zX48$*Uj}@NBFq0C#PAxTT|VFKj6{81QHakt-!f(L?bYdre|uj3i3k}hc~+b`d1D=aH0QEiC3l!Je53kE zM z7P6Xq4^0ie7<)SUW76D~)$FZvWe(N}l84@D`OT&0C8t+q3+7DJck?dv%_oy0Y)ew| z=JvlB;~pNT-ub6BKTqsU*^~VgnbQXF8;d_LJ&x$h(r^E}eSSQF&$YFv-D-U&fJi2u zsw}MUHf|BIrUR_Eq#caQ4UNkMt}JRFOhKR=A99$U-boHRdp9`!=9$=vdk68aO2Y2X zIE9^J96T64aFRGAE?zVm>A&f4o!enyd)?+v{%7Q%Y=3G=0V6Hk(JrmG5O^{_ZrqgF z7Lsx?u_@CsBt_g8ufL`35>x!`%Yuc@_1_bQ*AM15aDI55I`3hAY|w~}UoTyTxP*_D*k#O??|&1GDkIrX!W{D`p}h|oMM(;B$!jHr$g>dWBVHZ#bY;`{(k(z zf=!8AUyw;(kN3-hBG<3m|FY0S9tMW|Z)EpDv6tE(PdxkeSg!pHH)UkO;WqB#Y7Txy S>tKc9x6JYlgfB6owEqEKgj3r9 literal 0 HcmV?d00001 diff --git a/src/assets/images/map/keyQy/yumiao.png b/src/assets/images/map/keyQy/yumiao.png new file mode 100644 index 0000000000000000000000000000000000000000..b0b43ce437bb8ab2f9151456c9d5534bb1ab0d69 GIT binary patch literal 2123 zcmaJ?do-JQ8qT0)Q>LP-t|LMfGjby#-v~!;1W7bPjawVZhaeY8NE98_w7W*8)0Q&? zHA}m0t2eu}t8(Co7Qn{0)~$FQ<8XtGh#qm>cTB&CWk2VsFiX(EVZiuuVP7vu}G zGj4%?FqomUh!?GlW`zL)sTj>)$Dq|>8N`Oc`~uW6z90=$A``)6k%WwTcC`bA6bZ?w zeFPSkC8L5VqTqvaFybJaCpefUAPG?c{zyMH011deB_F94r%M!onv8m@3qb4jV+;!U z7NSfeqkc0L%?d|SrE(BSKodO$IB#F14+)JUdSktapCIvA90`N<#o)X=u{Z!r1PDIJ zcOMFhCKo0FTpHtDENDkYr6`p$0E1DfRA`kKS}IS*;7BA$1CPPuJt2grB3q*5t34$O z=M4oKs1V3SGNni=L9Q$E6Q!9-G756~TMA;?ds&I%U74VQVbpvX28YJ3r?dfNvHm|) zEPjtxD7oP8e*dSif|o4=F03%B1I}g z;vq{&w|ydsP^wb6za_9(08^q+@+AV0Nh6~m3A9Kg1gJzh)|*bFGl)164o9a4Qm}y( zXe5%TbPC=(aDz*e3Npo@M7hBg{?27=%3bdTu?&h#1LdMDP{@!=#mKig1ES5nP&d_k z#}#hwg|;ad1DV0B-|Qc5dgBOcpY`SYzJ)gLJ0Fxl?JkG<+D#)GhQW;5nY2KjdPE-` zn-&*onJ|slg<7QbH_RA;jjfcO&YlTB6&INJXa9VppyS$}OK++vW4W_A2uDk!lQkwg zX?tB#xjX+B6V&M{ZYtGR>X=iN<1uwxm`iWx-~V80y@Hm(qLiU;CSd!1hR;!Wz8E&>U=&7?@N)JHWH5Eh5kI^7SRB zhI+0_k$ zJD-ei>DsQ{PG&z_=bq1wv>*@h8lG}g*G$Qpxxh(}y`9H@g+ zIQ3_|&QN=?$8qh+xo4+r@JH89yg_cVd0VZfCc>d2H3PKWA+}e&NX&)kP5`ts`F08F$R2(4xq~M4p>B z!IT*Z^E6BTr8rKneEp|{Co_K$&Q0Dd97OjUHb>Q!5|A>^{){zFzz$eM>`WcupN3fv z8UJ8M)NAu5t|lF^ZH{^wdav5Kzs;z%{pj<6oZMkAA9B&Fo^nP^f;hZ+qz?V*{Lu9G z9zUc~3Y!L2Cq~gOo%bpu2b=qNaS!51al$7N<6G@VLiaoz@2slgOtBArN0i*%2Zf#- z9rL>-Gn$rgO>Q++R87S)9tM9wfPRAIFL_?VNIvvolqXcy8YvHDIt|t`E zk@H)#iYX*FO;052^bZ5}x9;_(kfPm)LW2Q@sHOb)j+nTL$aV(Ufk)|T2@9XV+$mwprl%=Il%2iLB>s`#b!c-mi2MYy#%2qd=8O;W=qL_dxVEN2Bf zSlM|yy}GmSed}h`8J6PF`1mh2}o!8c%cP5=pJ5M=K@LvqvV5|TD literal 0 HcmV?d00001 diff --git a/src/assets/images/map/keyQy/yuzhong.png b/src/assets/images/map/keyQy/yuzhong.png new file mode 100644 index 0000000000000000000000000000000000000000..ccc70bd04972f46520d0cde525dfc85e06a26ed1 GIT binary patch literal 2647 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
-
+
- {{ - item.num - }} - {{ - item.units - }} + {{ item.num }} + {{ item.units }}
{{ item.name }}
@@ -27,34 +29,53 @@ export default { { imgSrc: require('@/assets/images/map/legeng/qq.png'), units: '家', - num: '10', + num: '14', name: '育种企业' }, { imgSrc: require('@/assets/images/map/legeng/pz.png'), units: '家', - num: '9', + num: '5', name: '育苗企业' }, { imgSrc: require('@/assets/images/map/legeng/zz.png'), units: '家', - num: '52', + num: '20', name: '种植企业' }, { imgSrc: require('@/assets/images/map/legeng/sc.png'), units: '家', - num: '30', + num: '6', name: '加工企业' } - ] + ], + selectArr: ['育种企业', '育苗企业', '种植企业', '加工企业'] } }, - created () {}, + mounted () { + setTimeout(() => { + this.setMapPoint(this.selectArr) + }, 1000) + }, methods: { - setMapPoint () { - this.$EventBus.$emit('switcMapType', 'unit') + setMapPoint (selectArr) { + this.$EventBus.$emit('switcMapType1', selectArr) + }, + selectQy (name) { + if (this.selectArr.some((item) => name === item)) { + this.selectArr = this.selectArr.filter(item => item !== name) + } else { + this.selectArr = [...this.selectArr, name] + } + this.setMapPoint(this.selectArr) + }, + ifShow (name) { + if (this.selectArr.some((item) => name === item)) { + return 'selectd' + } + return '' } }, components: {}, @@ -99,5 +120,49 @@ export default { } } } + .selectd0 { + section { + .num { + color: rgba(255, 98, 67, 1); + } + + .units { + color: rgba(255, 98, 67, 0.74); + } + } + } + .selectd1 { + section { + .num { + color: rgba(50, 204, 255, 1); + } + + .units { + color: rgba(50, 204, 255, 0.74); + } + } + } + .selectd2 { + section { + .num { + color: rgba(253, 202, 120, 1); + } + + .units { + color: rgba(253, 202, 120, 0.74); + } + } + } + .selectd3 { + section { + .num { + color: rgba(39, 228, 184, 1); + } + + .units { + color: rgba(39, 228, 184, 0.74); + } + } + } } diff --git a/src/views/next/screen-content-map/cpt/point.json b/src/views/next/screen-content-map/cpt/point.json index 4ba0c78..0635739 100644 --- a/src/views/next/screen-content-map/cpt/point.json +++ b/src/views/next/screen-content-map/cpt/point.json @@ -1,71 +1,762 @@ { - "type": "FeatureCollection", - "name": "", - "features": [ - { - "type": "Feature", - "properties": { - "name": "青岛德龙种子研发中心", - "type": "marker", - "category":"unit", - "id":"1" - }, - "geometry": { - "type": "Point", - "coordinates": [120.215568,36.517836] - } - }, - { - "type": "Feature", - "properties": { - "name": "瑞克斯旺农业科技有限公司", - "type": "marker", - "category":"unit", - "id":"2" - }, - "geometry": { - "type": "Point", - "coordinates":[120.2245,36.542161] + "育种企业": { + "type": "FeatureCollection", + "name": "", + "features": [ + { + "type": "Feature", + "properties": { + "name": "瑞克斯旺（中国）农业科技有限公司", + "type": "marker", + "category": "unit", + "id": "11" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.224506, + 36.542165 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "青岛硕丰源种业有限公司", + "type": "marker", + "category": "unit", + "id": "11" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.207301, + 36.559783 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "青岛国际种苗有限公司", + "type": "marker", + "category": "unit", + "id": "11" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.206376, + 36.555345 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "青岛世农种苗有限公司", + "type": "marker", + "category": "unit", + "id": "11" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.219312, + 36.565069 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "青岛黄泷种子有限公司", + "type": "marker", + "category": "unit", + "id": "11" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.203251, + 36.468723 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "青岛德龙种子有限公司", + "type": "marker", + "category": "unit", + "id": "11" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.215301, + 36.517811 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "青岛美田花木有限公司", + "type": "marker", + "category": "unit", + "id": "11" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.207032, + 36.565412 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "青岛浩丰生物科技有限公司", + "type": "marker", + "category": "unit", + "id": "11" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.243555, + 36.483133 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "青岛海育种业有限公司", + "type": "marker", + "category": "unit", + "id": "11" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.24024, + 36.465497 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "青岛顺发种业有限公司", + "type": "marker", + "category": "unit", + "id": "11" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.208949, + 36.58008 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "青岛信利来种业有限公司", + "type": "marker", + "category": "unit", + "id": "11" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.227448, + 36.451863 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "青岛海育种业有限公司", + "type": "marker", + "category": "unit", + "id": "11" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.20024, + 36.465497 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "青岛顺发种业有限公司", + "type": "marker", + "category": "unit", + "id": "11" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.254949, + 36.54008 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "青岛信利来种业有限公司", + "type": "marker", + "category": "unit", + "id": "11" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.247448, + 36.451863 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "青岛正大种鸡场", + "type": "marker", + "category": "unit", + "id": "11" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.217448, + 36.551863 + ] + } } - }, - { - "type": "Feature", - "properties": { - "name": "国家农业科技园", - "type": "marker", - "category":"garden", - "id":"3" - }, - "geometry": { - "type": "Point", - "coordinates":[120.204031,36.553108] + ] + }, + "育苗企业": { + "type": "FeatureCollection", + "name": "", + "features": [ + { + "type": "Feature", + "properties": { + "name": "青岛润之禾农业科技有限公司", + "type": "marker", + "category": "unit", + "id": "1" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.202739, + 36.558909 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "青岛旺禾农业科技有限公司", + "type": "marker", + "category": "unit", + "id": "1" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.18472, + 36.564018 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "青岛旺禾农业科技有限公司", + "type": "marker", + "category": "unit", + "id": "1" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.18472, + 36.504018 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "青岛润之禾农业科技有限公司", + "type": "marker", + "category": "unit", + "id": "1" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.282739, + 36.528909 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "青岛旺禾农业科技有限公司", + "type": "marker", + "category": "unit", + "id": "1" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.24472, + 36.564018 + ] + } } - }, - { - "type": "Feature", - "properties": { - "name": "吉茂源农业科技有限公司", - "type": "marker", - "category":"garden", - "id":"4" - }, - "geometry": { - "type": "Point", - "coordinates":[120.230002,36.582204] + ] + }, + "种植企业": { + "type": "FeatureCollection", + "name": "", + "features": [ + { + "type": "Feature", + "properties": { + "name": "青岛润涵食品有限公司", + "type": "marker", + "category": "unit", + "id": "1" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.18903, + 36.552448 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "青岛备康蔬菜种植专业合作社", + "type": "marker", + "category": "unit", + "id": "1" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.259635, + 36.502938 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "青岛地平线蔬菜专业合作社", + "type": "marker", + "category": "unit", + "id": "1" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.188286, + 36.563778 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "青岛诚一果蔬现代农业专业合作社", + "type": "marker", + "category": "unit", + "id": "1" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.207973, + 36.538222 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "青岛浩丰生物科技有限公司", + "type": "marker", + "category": "unit", + "id": "1" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.240555, + 36.483133 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "青岛贸润蔬菜瓜果专业合作社", + "type": "marker", + "category": "unit", + "id": "1" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.162582, + 36.54486 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "青岛沽河青青蔬菜专业合作社", + "type": "marker", + "category": "unit", + "id": "1" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.188286, + 36.563778 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "青岛恒源顺生态果蔬种植专业合作社", + "type": "marker", + "category": "unit", + "id": "1" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.196259, + 36.51241 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "青岛佳蔬蔬菜专业合作社", + "type": "marker", + "category": "unit", + "id": "1" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.16755, + 36.531503 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "青岛春花秋实蔬菜专业合作社", + "type": "marker", + "category": "unit", + "id": "1" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.267973, + 36.538222 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "青岛大丰收蔬菜专业合作社", + "type": "marker", + "category": "unit", + "id": "1" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.20645, + 36.489536 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "青岛大欧庄户绿色食品有限公司", + "type": "marker", + "category": "unit", + "id": "1" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.189507, + 36.456081 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "即墨区兆硕家庭农场", + "type": "marker", + "category": "unit", + "id": "1" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.208705, + 36.481948 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "青岛湍湾生态农业科技发展有限公司", + "type": "marker", + "category": "unit", + "id": "1" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.264708, + 36.477422 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "青岛佳蔬蔬菜专业合作社", + "type": "marker", + "category": "unit", + "id": "1" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.18755, + 36.501503 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "青岛春花秋实蔬菜专业合作社", + "type": "marker", + "category": "unit", + "id": "1" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.187973, + 36.508222 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "青岛大丰收蔬菜专业合作社", + "type": "marker", + "category": "unit", + "id": "1" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.25645, + 36.489536 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "青岛大欧庄户绿色食品有限公司", + "type": "marker", + "category": "unit", + "id": "1" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.189507, + 36.486081 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "即墨区兆硕家庭农场", + "type": "marker", + "category": "unit", + "id": "1" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.248705, + 36.481948 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "青岛湍湾生态农业科技发展有限公司", + "type": "marker", + "category": "unit", + "id": "1" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.264708, + 36.483422 + ] + } } - }, - { - "type": "Feature", - "properties": { - "name": "德龙种子有限公司", - "type": "marker", - "category":"garden", - "id":"5" - }, - "geometry": { - "type": "Point", - "coordinates":[120.221626,36.468795] + ] + }, + "加工企业": { + "type": "FeatureCollection", + "name": "", + "features": [ + { + "type": "Feature", + "properties": { + "name": "青岛龙之园绿色食品有限公司", + "type": "marker", + "category": "unit", + "id": "1" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.208239, + 36.565807 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "青岛银杏家食品有限公司", + "type": "marker", + "category": "unit", + "id": "1" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.22248, + 36.550282 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "即墨区女儿村生态园食品厂", + "type": "marker", + "category": "unit", + "id": "1" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.170083, + 36.496712 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "青岛润涵食品有限公司", + "type": "marker", + "category": "unit", + "id": "1" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.18903, + 36.552448 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "移康（山东）农副产品有限公司", + "type": "marker", + "category": "unit", + "id": "1" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.208412, + 36.585586 + ] + } + }, + { + "type": "Feature", + "properties": { + "name": "青岛麦飘香面粉有限公司", + "type": "marker", + "category": "unit", + "id": "1" + }, + "geometry": { + "type": "Point", + "coordinates": [ + 120.212169, + 36.59127 + ] + } } - } - ] -} + ] + } +} \ No newline at end of file diff --git a/src/views/next/screen-content-map/cpt/zdyf-map.vue b/src/views/next/screen-content-map/cpt/zdyf-map.vue index 6f5acef..ffbb567 100644 --- a/src/views/next/screen-content-map/cpt/zdyf-map.vue +++ b/src/views/next/screen-content-map/cpt/zdyf-map.vue @@ -48,6 +48,9 @@ let lineLayer let textLayer let dotTextLayer let dotLayer +let dotLayer1 +let dotLayer2 +let dotLayer3 export default { data () { return { @@ -125,6 +128,9 @@ export default { this.$EventBus.$on('switcMapType', (data) => { this.switcMapType(data) }) + this.$EventBus.$on('switcMapType1', (data) => { + this.switcMapType1(data) + }) }) selectConfigList({ type: 2 }).then((res) => { this.headerList = this.headerList.map((item) => { @@ -140,6 +146,10 @@ export default { ...mapActions({ set_qyjj: 'SET_QYJJ' }), + async switcMapType1 (arr) { + this.removeDotLayers() + this.initDot(point, arr) + }, async switcMapType (type) { if (type === 'Emap') { this.mapType = null @@ -206,9 +216,9 @@ export default { this.initFlow(type) } }) - scene.on('click', (feature) => { - // console.log(feature); - }) + // scene.on('click', (feature) => { + // // console.log(feature); + // }) }, initCircle () { circleLayerSmall = new ImageLayer({}) @@ -245,10 +255,10 @@ export default { scene.addLayer(polygonLayer) const that = this - circleLayerSmall.on('click', (ev) => { - // 处理点击事件的逻辑 - that.initRoadLayer() - }) + // circleLayerSmall.on('click', (ev) => { + // // 处理点击事件的逻辑 + // that.initRoadLayer() + // }) }, initRoadLayer () { if (circleLayerSmall) { @@ -267,10 +277,10 @@ export default { }) scene.addLayer(roadLayer) const that = this - roadLayer.on('click', (ev) => { - // 处理点击事件的逻辑 - that.initPolygonLayer() - }) + // roadLayer.on('click', (ev) => { + // // 处理点击事件的逻辑 + // that.initPolygonLayer() + // }) }, initFlow () { if (circleLayerSmall) { @@ -332,11 +342,10 @@ export default { polygonLayer = new PolygonLayer({ autoFit: true }) - .size(1000) + .size(1) .source(data) .color('name', ['rgba(0,106,235, .9)']) .shape('extrude') - // .shape("fill") .style({ opacityLinear: { enable: true, // true - false @@ -349,16 +358,8 @@ export default { // targetColor: '#4ee8fc' }) scene.addLayer(polygonLayer) - - polygonLayer.on('mousemove', (e) => { - // console.log(e); - // if (e.feature.properties.content) { - // const popup = new Popup({ - // offsets: [0, -0], - // closeButton: false - // }) - // scene.addPopup(popup) - // }? + polygonLayer.on('click', (e) => { + console.log('111') }) // 画区域边 lineLayer = new LineLayer({ @@ -370,8 +371,7 @@ export default { .size(1) .color('name', styleConfig.lineColor) .style({ - opacity: 1, - raisingHeight: 300 + opacity: 1 }) .animate({ interval: 1, // 间隔 @@ -379,86 +379,147 @@ export default { trailLength: 2 // 流线长度 }) scene.addLayer(lineLayer) - - // textLayer = new PolygonLayer({ - // zIndex: 20 + lineLayer.on('click', (e) => { + console.log('222') + }) + // lineLayer.on('mousemove', (e) => { + // console.log('e::', e) + // }) + }, + initDot (data, arr) { + scene.addImage( + 'yuzhong', + require('@/assets/images/map/keyQy/yuzhong.png') + ) + scene.addImage('yumiao', require('@/assets/images/map/keyQy/yumiao.png')) + scene.addImage( + 'zhongzhi', + require('@/assets/images/map/keyQy/zhongzhi.png') + ) + scene.addImage( + 'jiagong', + require('@/assets/images/map/keyQy/jiagong.png') + ) + // textOffset改为动态的 this.buttonIndex == 3 [10,60] 否则就是 [-30 60] + scene.removeLayer(dotLayer) + scene.removeLayer(dotLayer1) + scene.removeLayer(dotLayer2) + scene.removeLayer(dotLayer3) + // dotTextLayer = new PointLayer({ + // zIndex: 21000000000 // }) - // .source(data) - // .color('name', styleConfig.textColor) + // .source(data['育种企业']) // .shape('name', 'text') - // .size(14) + // .color('#000') + // .size(11) // .style({ - // textAnchor: 'center', // 文本相对锚点的位置 center|left|right|top|bottom|top-left - // textOffset: [0, 40], // 文本相对锚点的偏移量 [水平, 垂直] - // spacing: 2, // 字符间距 - // padding: [2, 2], // 文本包围盒 padding [水平，垂直]，影响碰撞检测结果，避免相邻文本靠的太近 - // stroke: styleConfig.textStrokeColor, // 描边颜色 - // strokeWidth: 0.1, // 描边宽度 - // strokeOpacity: 0.8, + // strokeWidth: 1, + // strokeOpacity: 0.1, + // fontWeight: '500', + // stroke: '#fff', + // textOffset: [20, 0], // raisingHeight: 300, - // textAllowOverlap: true + // heightfixed: true, + // textAnchor: 'left' // }) - // .active(true) - // scene.addLayer(textLayer) - const _this = this - polygonLayer.on('click', (e) => {}) - }, - initDot (data) { - scene.addImage('dotBto', require('@/assets/images/map/dot.png')) - scene.addImage('textBg', require('@/assets/images/map/textBg.png')) - // textOffset改为动态的 this.buttonIndex == 3 [10,60] 否则就是 [-30 60] - scene.removeLayer(dotTextLayer) - scene.removeLayer(dotLayer) - dotTextLayer = new PointLayer({ - zIndex: 21 - }) - .source(data) - .shape('name', 'text') - .color('#000') - .size(11) - .style({ - strokeWidth: 1, - strokeOpacity: 0.1, - fontWeight: '500', - stroke: '#fff', - textOffset: [10, 0], - raisingHeight: 300, - heightfixed: true, - textAnchor: 'center-left' + // scene.addLayer(dotTextLayer) + const images = { + 育种企业: 'yuzhong', + 育苗企业: 'yumiao', + 种植企业: 'zhongzhi', + 加工企业: 'jiagong' + } + if (arr.some((item) => item === '育种企业')) { + dotLayer = new PointLayer({ + zIndex: 20000000 }) - scene.addLayer(dotTextLayer) + .source(data['育种企业']) + .shape(images['育种企业']) + .size(10) + .style({ + layerType: 'fillImage', + heightfixed: true + }) + scene.addLayer(dotLayer) + // dotTextLayer = new PointLayer({ + // zIndex: 2000000021 + // }) + // .source(data['种植企业']) + // .shape('name', 'text') + // .color('#000') + // .size(11) + // .style({ + // strokeWidth: 1, + // strokeOpacity: 0.1, + // fontWeight: '500', + // stroke: '#fff', + // textOffset: [10, 0], + // raisingHeight: 300, + // heightfixed: true, + // textAnchor: 'center-left' + // }) + // scene.addLayer(dotTextLayer) - dotLayer = new PointLayer({ - zIndex: 20 - }) - .source(data) - .shape('textBg') - .size(80) - .style({ - layerType: 'fillImage', - raisingHeight: 300, - heightfixed: true + // dotTextLayer.on('click', (e) => { + // console.log('eee1111') + // }) + dotLayer.on('click', (e) => { + console.log('eee') + that.set_qyjj(true) }) - scene.addLayer(dotLayer) + } + if (arr.some((item) => item === '育苗企业')) { + dotLayer1 = new PointLayer({ + zIndex: 20000000 + }) + .source(data['育苗企业']) + .shape(images['育苗企业']) + .size(10) + .style({ + layerType: 'fillImage', + heightfixed: true + }) + scene.addLayer(dotLayer1) + } + if (arr.some((item) => item === '种植企业')) { + dotLayer2 = new PointLayer({ + zIndex: 20000000 + }) + .source(data['种植企业']) + .shape(images['种植企业']) + .size(10) + .style({ + layerType: 'fillImage', + heightfixed: true + }) + scene.addLayer(dotLayer2) + } + if (arr.some((item) => item === '加工企业')) { + dotLayer3 = new PointLayer({ + zIndex: 20000000 + }) + .source(data['加工企业']) + .shape(images['加工企业']) + .size(10) + .style({ + layerType: 'fillImage', + heightfixed: true + }) + scene.addLayer(dotLayer3) + } const that = this - dotTextLayer.on('click', (e) => { + dotLayer1.on('click', (e) => { + console.log('eee1') + that.set_qyjj(true) + }) + dotLayer2.on('click', (e) => { + console.log('eee2') + that.set_qyjj(true) + }) + dotLayer3.on('click', (e) => { + console.log('eee3') that.set_qyjj(true) }) - - // dotTextLayer.on("mousemove", (e) => { - // // console.log(e); - // if (e.feature.properties.content) { - // const popup = new Popup({ - // offsets: [0, -0], - // closeButton: false, - // }) - // .setLnglat(e.feature.geometry.coordinates) - // .setHTML(`${e.feature.properties.content}`); - // scene.addPopup(popup); - // } - // }); - - // dotTextLayer.on("unmousemove", (e) => { }); } }, components: { chinaMap }, @@ -486,7 +547,7 @@ export default { left: 554px; transform: translate(-50%); width: 140px; - height: 220px; + height: 260px; z-index: 10; } @@ -586,7 +647,6 @@ export default { opacity: 0.8; /* 控制透明度 */ animation: meteor-fall 5s linear infinite; transform: rotate(186deg); - } /* 动画关键帧 */ diff --git a/src/views/next/screen-content-right/home-right/index.vue b/src/views/next/screen-content-right/home-right/index.vue index 778c148..890c265 100644 --- a/src/views/next/screen-content-right/home-right/index.vue +++ b/src/views/next/screen-content-right/home-right/index.vue @@ -163,7 +163,7 @@ export default { this.videoStatus = 'pause' }, handelClickTalents () { - this.set_szyfTalents(true) + // this.set_szyfTalents(true) } }, components: {},