investHome2.js 59 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915
  1. let app = new Vue({
  2. el: '#app',
  3. data () {
  4. return {
  5. type: true, // 切换柱状图状态
  6. showTip2: false,
  7. showTip3: false,
  8. echartTitle: '',
  9. year: '2022',
  10. time: '',
  11. timer: '',
  12. mapName: 'shanxi',
  13. geoCoordMap: {},
  14. config1: {
  15. number: [100],
  16. content: '{nt}个',
  17. },
  18. storageRecordConfig: {
  19. // waitTime: '2000000',
  20. header: ['企业集团', '项目名 ', '投资总额'],
  21. // headerBGC: '#05507b33',
  22. // oddRowBGC: '#05507b33',
  23. // evenRowBGC: '#05507b33',
  24. headerBGC: '#05183c',
  25. headerBGC: '#05507b33',
  26. oddRowBGC: '#05183c',
  27. evenRowBGC: '#05183c',
  28. rowNum: 4,
  29. align: ['center'],
  30. data: [
  31. ['国际能源', '娄烦县120MW智慧光伏发电项目+10%储能', "67840.59 "],
  32. ['国际能源', '平朔矿区150MW农光储氢一体化项目', "78403.10 "],
  33. ['汾酒集团', '汾酒2030技改原酒产储能扩建项目(一期)', "910181.50 "],
  34. ['大地控股', '山西大地控股忻州新店矿业有限公司投资建设年产800万吨精品砂石骨料项目', "86691.03 "],
  35. ['潞安化工', '分布式光伏发电项目', "20055.81 "],
  36. ['太重集团', '设立太重(大同)新能源产业投资公司', "3000.00 "],
  37. ['大地控股', '山西大地宏翔环保科技有限公司电厂固废资源化综合利用建设项目', "36000.00 "],
  38. ['大地控股', '山西大地海科环保科技有限公司电厂固废资源化综合利用建设项目', "31061.11 "],
  39. ['汾酒集团', '保健酒园区新增原酒产能项目', "49836.77 "],
  40. ['汾酒集团', '白玉酒厂改扩建项目', "49617.44 "],
  41. ['华阳新材', '5GW高效光伏组件制造项目', "48224.63 "],
  42. ['华新燃气', '吉县—延长输气管道项目(一期工程)', "35400.00 "],
  43. ['太重集团', '建设液压挖掘机配套油缸项目', "26000.00 "],
  44. ['华远陆港', '物产集团参股设立项目公司投资建设山西物产万科(太原)综合物流产业园项目', "66000.00 "]
  45. ],
  46. },
  47. companyList: [
  48. { name: '山西焦煤' },
  49. { name: '晋能控股' },
  50. { name: '华新燃气' },
  51. { name: '山西建投' },
  52. { name: '潞安化工' },
  53. { name: '华远陆港' },
  54. { name: '航产集团' },
  55. { name: '大地控股' },
  56. { name: '国新能源' },
  57. { name: '汾酒集团' },
  58. { name: '云时代' },
  59. { name: '神农科技' },
  60. { name: '华阳新材' },
  61. { name: '华舰体育' },
  62. { name: '交控集团' },
  63. { name: '文旅集团' },
  64. { name: '水控集团' },
  65. { name: '太重集团' },
  66. ],
  67. }
  68. },
  69. created () {
  70. this.time = formatDate()
  71. this.timer = setInterval(() => {
  72. this.time = formatDate()
  73. }, 1000)
  74. },
  75. beforeDestroy () {
  76. if (this.timer) {
  77. clearInterval(this.timer);
  78. }
  79. },
  80. mounted () {
  81. // 左侧图表
  82. setTimeout(() => {
  83. this.initChartL1()
  84. this.initChartL2()
  85. this.initChartL3()
  86. this.initChartL4()
  87. this.initChartL5()
  88. this.initChartL6()
  89. this.initChartL7()
  90. this.initChartR1()
  91. this.initChartR2()
  92. this.initChartR3()
  93. this.initChartR6()
  94. },)
  95. setTimeout(() => {
  96. var swiper = new Swiper(".mySwiper", {
  97. pagination: {
  98. el: ".swiper-pagination",
  99. type: "progressbar",
  100. },
  101. navigation: {
  102. nextEl: ".swiper-button-next",
  103. prevEl: ".swiper-button-prev",
  104. },
  105. });
  106. swiper.el.onmouseout = function () {
  107. swiper.autoplay.start();
  108. }
  109. })
  110. setInterval(() => {
  111. this.type = !this.type
  112. this.initChartL3()
  113. }, 2000)
  114. },
  115. methods: {
  116. convertData (data) {
  117. var res = []
  118. for (var i = 0; i < data.length; i++) {
  119. var geoCoord = this.geoCoordMap[data[i].name]
  120. if (geoCoord) {
  121. res.push({
  122. name: data[i].name,
  123. value: geoCoord.concat(data[i].value),
  124. })
  125. }
  126. }
  127. return res
  128. },
  129. initChinaChart () {
  130. var data = [
  131. { name: '吕梁市', value: 150 },
  132. { name: '大同市', value: 190 },
  133. { name: '忻州市', value: 140 },
  134. { name: '朔州市', value: 160 },
  135. { name: '晋中市', value: 100 },
  136. { name: '太原市', value: 300 },
  137. { name: '临汾市', value: 190 },
  138. { name: '长治市', value: 100 },
  139. { name: '晋城市', value: 280 },
  140. { name: '运城市', value: 180 },
  141. { name: '阳泉市', value: 110 },
  142. ]
  143. var moveLine = {
  144. normal: [
  145. {
  146. fromName: '太原市',
  147. toName: '吕梁市',
  148. coords: [
  149. [112.3352, 37.9413],
  150. [111.3574, 37.7325],
  151. ],
  152. },
  153. {
  154. fromName: '太原市',
  155. toName: '忻州市',
  156. coords: [
  157. [112.3352, 37.9413],
  158. [112.4561, 38.8971],
  159. ],
  160. },
  161. {
  162. fromName: '太原市',
  163. toName: '临汾市',
  164. coords: [
  165. [112.3352, 37.9413],
  166. [111.4783, 36.1615],
  167. ],
  168. },
  169. {
  170. fromName: '太原市',
  171. toName: '阳泉市',
  172. coords: [
  173. [112.3352, 37.9413],
  174. [113.4778, 38.0951],
  175. ],
  176. },
  177. {
  178. fromName: '太原市',
  179. toName: '晋中市',
  180. coords: [
  181. [112.3352, 37.9413],
  182. [112.7747, 37.37],
  183. ],
  184. },
  185. {
  186. fromName: '太原市',
  187. toName: '运城市',
  188. coords: [
  189. [112.3352, 37.9413],
  190. [111.1487, 35.2002],
  191. ],
  192. },
  193. {
  194. fromName: '太原市',
  195. toName: '大同市',
  196. coords: [
  197. [112.3352, 37.9413],
  198. [113.7854, 39.8035],
  199. ],
  200. },
  201. {
  202. fromName: '太原市',
  203. toName: '晋城市',
  204. coords: [
  205. [112.3352, 37.9413],
  206. [112.7856, 35.6342],
  207. ],
  208. },
  209. {
  210. fromName: '太原市',
  211. toName: '长治市',
  212. coords: [
  213. [112.3352, 37.9413],
  214. [112.8625, 36.4746],
  215. ],
  216. },
  217. {
  218. fromName: '太原市',
  219. toName: '朔州市',
  220. coords: [
  221. [112.3352, 37.9413],
  222. [113.0713, 39.6991],
  223. ],
  224. },
  225. ],
  226. }
  227. /*获取地图数据*/
  228. let myChart = echarts.init(this.$refs['echarts-map'])
  229. echarts.registerMap('shanxi', {
  230. type: 'FeatureCollection',
  231. features: [
  232. {
  233. type: 'Feature',
  234. id: '1409',
  235. properties: { name: '忻州市', cp: [112.4561, 38.8971], childNum: 14 },
  236. geometry: {
  237. type: 'Polygon',
  238. coordinates: [
  239. '@@Vx@lnbn¦WlnnUšmš°š²VšV‚VVVnUn„ºlz@l„„@Jƒ@kXWVXl@Lƒa@„ƒKUL„ŽlbnKlLnK‚LnKÆXn°šbVV@bUVl°Un@LnaVJUbW@UX²l‚@ČwlVVIšWnkÆa°„„anV‚Kn°™UW¯@™aVUVk@Un@„aV@ValwUanmWU„k@WVUUanaVwnLVl°@nk@mVU@UVK@w„LVKVU@ƒ„K@UUKVUV@@bnL„a‚V„aôšlIXmlKX_°KVV@bVV„@šzV`kblI„V„Ul‚šL@bnV@V„Ċll„„VlIXW@k„a‚U²blKšVnIlJ„albXXlWVn°JnšnL@l@XlJlaX@„X˜W²@l_VmnKšU„blU@mnkVK„¯@U@ƒma@kX¥VƒmakkƒLƒa@aƒ@WIUUVXWWnk@a°a@kkm@kUUmJm@WUUUIk`m@V—kaWWkX™KmƒXk¯ƒ@WKƒLkak@±bƒw@ƒaƒa@akaƒ@ma¯@ƒL—KÇÅkKWbkmġ™±ÅUƒLUK™VVkƒm¯LUVVbƒ„UwUW¯bm„ƒULƒxWJ—@ƒklmkUm@@KnwVkVK@akwƒ@@a¯bƒKkn›VUI™b¯mmbk@UbmKUL@xUUƒ@klmLUŽlVXI‚VVVUVUœU`mLXVWbXnW`Ų°xmŽxU@mĉƒƒwU@mbU@UƒmbkVW¦kJ™@ƒX@`¯Im@UlUVVnb@bWJXnmbƒJUU™UUaƒ@UamIkaƒxƒ@@x@b',
  240. ],
  241. encodeOffsets: [[113614, 39657]],
  242. },
  243. },
  244. {
  245. type: 'Feature',
  246. id: '1411',
  247. properties: { name: '吕梁市', cp: [111.3574, 37.7325], childNum: 13 },
  248. geometry: {
  249. type: 'Polygon',
  250. coordinates: [
  251. '@@@a@w„@„wlbnJVb„@VbšVVV„InaWmXI@a‚aUmVUVkn@°J@_„Wš@lIX¥lUnaV„V@naV@„xĊ„n‚V@‚wn¯wƱX_WmXaWUnKV_V›VUUUUWJkUVnKlk¯™@@kmKUaŁ±KkU@WmI@WUIlUUmVwXƒ‚w@ƒUlUVwœV‚@„Lnb‚W@anU@UšaVkô@l»n@na˜JnUÈLVaƃUUVm„VKVƒ²L@mU_lK@UVWkU‚a@a@U¯aUaƒÑóÑUb™„ƒKk@@aƒk¯mVaUwVƒÑkWUmK@UUKmXUWÝwUa™LUU@aWJUUU@Ua݄U@WL@VKVaVI@WnU@alIVKƒƒ@kIƒmIkJ@™m@ƒ™@@_™K@xƒ@kaW@U„@Vmn@ŽUK@mIƒJUXV¤XXWlkKƒkkK@XmJVakImJU@ó™¯LWKUV@nUVƒLkxmKkLma@kXKmmƒLƒab™LmK@V@mXVÆUxƒX@`nL„aV@@VmLUVnLlLš˜„b@„šŽ°²nx@b‚VUxlb@V¯bUV@zV‚XVĊXVx@lVn@VnnmŽUš@LlJXVƒz¯VWVXbšV@bmn™VUVk„Çþń@XVxmbUlV„Uln„W„@„Xl‚@VLXÒ@bÞJ°¦„L˜ò„@nU‚b@°„X@ŽXbmVU„V„nb@x‚x',
  252. ],
  253. encodeOffsets: [[113614, 39657]],
  254. },
  255. },
  256. {
  257. type: 'Feature',
  258. id: '1410',
  259. properties: { name: '临汾市', cp: [111.4783, 36.1615], childNum: 17 },
  260. geometry: {
  261. type: 'Polygon',
  262. coordinates: [
  263. '@@nW‚@@UnLšK‚a„b„KnnWL@lnblKnLlw„KVU@mVUXL°KôšV@nIlJUbnI@WlL„llLXkWWU£VW„InJ‚@VL@nm@UVƒX@lb„@@wšL@`‚@„šn@V@lw„@n„VmVX„WmwnUlƒœa@_lK„wVlUn°xVKVXXWlUšVVI@K@K„n°KœwlVlU@kna@V_„Wn‚m„UVm@kXml_@m„LlKXw°m@_ôJVUV@X™l@UaV@Va°I„lk»VwUkVmwUmmVn@V¯@KƒU—wmK@U¯wUVÝ@mJƒU—nWK™@@UnKVa„_lykUmKÛnm@™x@ƒUUlwVk™ƒXW@ƒa@Uƒ@@K@ƒkIV™nammVakUlƒ@wX@@kƒ™¯@ƒVVbml@„„°UbULmlVbnbÅK±VƒKVXUJWa@ULWaUU@@U@aWK@UkxUKƒLUUUJ±UkL@V±kk@kam@UV@l@LWl@n@VVUx„LlUUx@VUV™U@aƒIUl™L@°mLU‚ƒbkUUaWUUaUU@aWK—LWJ@bUL@VUVVbU@m@a@kmKmnĉlUK™XƒWUblb—xmIkƒƒU@xWb@lkšVx™LXŽmzVV@bklVVUzm˜@bk„@Vx@xlŽU„@lUbVnl@„Wxnl@n@ŽUbV„mL‚mƒb@`X@lUX@@xlnkLWaUJnnWV™Vn@l„@bULVV@l™V@XnJVX',
  264. ],
  265. encodeOffsets: [[113063, 37784]],
  266. },
  267. },
  268. {
  269. type: 'Feature',
  270. id: '1407',
  271. properties: { name: '晋中市', cp: [112.7747, 37.37], childNum: 11 },
  272. geometry: {
  273. type: 'Polygon',
  274. coordinates: [
  275. '@@@šlInJ„lJ„@‚„ULkJ@bmV@XUJUb‚L@UXKV@ރVbV@VVXI@bVVšKVbÞxVXnWVL@VnLV‚lX„ÒUŽVxUb°n„l@bl@„LšƒVaô҄ÒVb°b@VnLnnV@lmn@lb„U„V@„‚JœUVV‚Xkl@lUzmJ@xšXkl‚bUn„JVšUb„nU‚lb„V@nlLX@lakšV`Ub°š@XVJnU‚L²KlxnI@KV@lbUbVV„KnVl@„zlm@Uš@nŽšI@WUaVl@@mVU„@XkW@ƒnkVKVƒ„_Vw„y@knwVa‚@XalU„@šVnml@„X@V„L‚KVaÞbnnlJšI„mVKn„VVVInVlU„@„m@™mXK@UmyUI@mWUUakamw@wUwmLkakwVƒmK™w@wUam£y@am_ƒW@™UU@knmm„amU@WUa@knw@ƒUUUUV@nƒJm@mVUkKVUUUkKmwƒKULƒKUImV@lUn™nŽm@mbUK@°™bUnmbUmkkƒWUb@am@UXkK@a±@™V™@ĉř„V‚UXVxUVkLWl¯@@bULUlm@@nm`—XƒlWakIkm›VUbUL@Vm@kIƒ@@Kšm@—VaX‚I@W@aU@kUƒVU_™KƒbƒJkkǎ™b@nkKmL™wÅW@kVUUƒVU@WUIƒJmIXmma@_kyVaUUlkUm@ƒkU›x¯Lƒm@L@LUJ™UkVWXUWUL¯wVmUkƒxkL@`›bk„mVnxƒXUWUnmƒƒ@kxU@',
  276. ],
  277. encodeOffsets: [[114087, 37682]],
  278. },
  279. },
  280. {
  281. type: 'Feature',
  282. id: '1408',
  283. properties: { name: '运城市', cp: [111.1487, 35.2002], childNum: 13 },
  284. geometry: {
  285. type: 'Polygon',
  286. coordinates: [
  287. '@@„Vl„nJ˜wkaVa„XšWVLĊknmnL‚l@@bn‚V@UaVU@UVK@aXI˜KXL@bVVVbXVVblV„aVnK@¯šKVk„J@bšVVU@UVwkVƒKVwUUm@@Xk@K@kVUn@lbl@²l@UlK²VVIVV„KVLlw@VXL@b@VV@VŽXbVK‚@XbVIUW„L‚U²ÆLmaUankVKVaƒ¯@ƒnkUa„U°@„š‚n@@kWa„UVaXUW@IXKVw@U™ƒ„™WU@W@@UUƒU@mn@ƒ`m@UUULkUmJ™IUƒ@@UƒK@U@›anƒ™ak_@wmKUwmakV™kmK™V™k¯b™wƒ`kwUIÇx¯»ÇaŃmn@@™mƒmUkV@wkKW@kxmL™UkĉLÝk™xÝw¯lóVU„mV@ĀVVX¦W¤kz@`Vx°„²ĸ‚š@„Ul@x„êĸNJ°¤V„VlXLWnXxmV@nUl@„',
  288. ],
  289. encodeOffsets: [[113232, 36597]],
  290. },
  291. },
  292. {
  293. type: 'Feature',
  294. id: '1402',
  295. properties: { name: '大同市', cp: [113.7854, 39.8035], childNum: 8 },
  296. geometry: {
  297. type: 'Polygon',
  298. coordinates: [
  299. '@@²£šyl@Ȑ˜Ė@bĸŽĢbĸ„˜X„a‚KŤnn@ŎôllÈx„nVnÞDŽV@b‚nXllL°KšbVb@J@b—„‚„@ŽU„„xlKXLlKlXk„@Ulk„JlkUƒVKXUƒÇVIVm@_nǚLšašl‚w„VnU@UUwma@aƒaÝaLmUk@@Wƒ@U@@X™wVWÝUUUk@@VmLƒKV»nwUw™aUL@`mzƒJUIVƒUaUw™KUaVIlJôanÑlLVUn@ša„@VV„@@UUwVK°Vn_lJÆLœéW@UUUÅ@»lm@aÞIVwXW˜UUkkm@U@aƒU@mwU£VWU_kWmƒXwW_°yUkkK@UÇK@kkUVymóK—U@KWIƒbUak@mJ@bkbmLkŽ™UmƒkVU„W¦@lnb@„@Vƒ°ULml@nkVƒa™VmLUnk`±@—XƒWW@kbǦXŽ¯„WxI@xmbmxXlWV„„@bŎUz@J‚b@bÞb™ŽU@Wbk@ƒxk@WX¯VۙƒWÝbÝUkVUU@alI@a@akLWa™m@U¯UUmÇL@K@aU@¯VUkƒKmX@`@œkJ@nV‚Ub@lbVÆXVW„ULU`VbkLUV@XWl@bXJ˜@VbV@Vl',
  300. ],
  301. encodeOffsets: [[115335, 41209]],
  302. },
  303. },
  304. {
  305. type: 'Feature',
  306. id: '1404',
  307. properties: { name: '长治市', cp: [112.8625, 36.4746], childNum: 12 },
  308. geometry: {
  309. type: 'Polygon',
  310. coordinates: [
  311. '@@Uk™Lky@I‚JVa@mÞaWšy@_W@_WƒXVlUVwš@nw°K@m„UƒVaƒmVkU@mmmnLVUmKXa™U@IlKVUnK@UmWkX@WV_Vƒ@akU@a„KWIXyƒIUVmUn™Ua@WaXUVKVmkUWVkUƒLU@@VƒbƒKbƒIUmƒ@mbVL—x›WUUkn±V¯wƒbÅJUbmLkbmKÅKƒbVnUbƒV™KUb™KUbmLKmƒb™aƒKkUm@UŽnn‚VnxUVlUxl¼ƒk¯JUbU@Vbk@WšU@UVóI@`¯nWxkLƒK@nk`Wn@lUnƒVnm‚ƒXU`@mb@lkV@„VnklVVUblz@`nbWnnJ„IVJ@XUVV„UV@lÆXšxnKlL@mšaȍll„I„ašLV`„UlVV@@b@XJWUb@˜™n@L„@lJn@@UVKVaœUlnlJXb„k˜Wn_@mn@VkVK@a°@XklKVUUwVWUšƒĊƚ@šU²@@blLVWn@@bVa„XllVnnaVmša@¯VLnan@‚šmVm@knUVJ',
  312. ],
  313. encodeOffsets: [[116269, 37637]],
  314. },
  315. },
  316. {
  317. type: 'Feature',
  318. id: '1406',
  319. properties: { name: '朔州市', cp: [113.0713, 39.6991], childNum: 5 },
  320. geometry: {
  321. type: 'Polygon',
  322. coordinates: [
  323. '@@XXWVXVWnnlnn@èƼ@„„xlš„ŽV„nblšššVŽÈUVl‚š@„blnœL܃ĊmUkU@Ua‚—@WI@aXk@WVUlKUaV_VKXƒWUUÅka@VaU@mlI@›@_nW„LVl°UV@@b@LÈKVn°V@VšnXblK@b@bkJ@bVVlUÞVÞa„Xܚ°UXWl@„wl@XaV@šÝa@aa@IVyƍ@aƒƒXUWknwna@w‚JXw°ƒWÈ¥kI@W@kmKm™¯IUmkXWWkaƒbkImJ™UkL±aVƒb@lWXkJƒUkƒĉkƒ@UmU@a™KkƒVƒUkJlaU_™yƒ@UU@aUU¯LW`kLWnkJó™ƒbUƒbmK@aU@UVVL@VƒL@„UVULƒK@xUL@VUV@nml¯@UkmKUxmbVbUV@XƒlXVmnVbkxUbU@ƒbm@@VUlUVšb°@VX¯šm‚',
  324. ],
  325. encodeOffsets: [[114615, 40562]],
  326. },
  327. },
  328. {
  329. type: 'Feature',
  330. id: '1405',
  331. properties: { name: '晋城市', cp: [112.7856, 35.6342], childNum: 6 },
  332. geometry: {
  333. type: 'Polygon',
  334. coordinates: [
  335. '@@lV„Lšb„an‚LnKVašLVašL„UVaUm„aÆLnLlanKVaÆI„a°x²UlmVVœX˜wUKna„@Vn„J‚a„L„a@UV@@alUkKVKnkmmVwUk„w@ƒ™@kxWUXƒW@@mƒk@aUa@a¯aƒLkKmwkUm@kL@K@aWIXmƒVƒXƒWkUVakL@UVKƒw@aUK@UUKmLU@¯n™KUwVƒUIWJUWmka™@UXƒJƒk@UkmW@kLWKVƒx@bmI@VUaVU@a¯@UUmVKmX@±`kÝKVxUL±akL@V™bƒLkKmVƒ@XWVUbƒVXb@lm@@lW@@xk„lVUbnnmbUšlJ@„@L„@@V„b@‚WXš„UlkxVV@„šwn@ÜmnLlVkzƒ`UbmL@Vš@XL˜m„VnIÞ@VU°x@VnL˜x„V@LU°',
  336. ],
  337. encodeOffsets: [[115223, 36895]],
  338. },
  339. },
  340. {
  341. type: 'Feature',
  342. id: '1401',
  343. properties: { name: '太原市', cp: [112.3352, 37.9413], childNum: 5 },
  344. geometry: {
  345. type: 'Polygon',
  346. coordinates: [
  347. '@@„@VV@wVKnLVal@na°nšaVJœUlm„L°a@b„@lx@bULUlmx@Ln@lVkn„l˜@XI„w‚K„Vnƒ°aVXVx„ƒUaVU°K„nUlšUVL„KÆVš²Ģ‚lnXalLÈƘL„KUaVkUanmWU™a@WwkUWU¯y¯Ñ@anIl@@aVU„m„I„ymUƒLUUVakaU@@LmJkw±LKmVUI@W¯™VaU_l™kbW@kK@mƒUkaVƒmVaU™ƒIVmalk™W@wnIVy@klkWUU›VI@ƒƒUƒVkam@knU@mmmK@bblVUX@VkLV`@n±KU„ULƒ‚UnVVńUbÇKmV—Imbm@k¼ó@Ul™b@VmV@bXmaƒK@›UUxkV‚V@„xW„UxVnkVVJ@XnJ@XlV²LƂVbnL@lš@°',
  348. ],
  349. encodeOffsets: [[114503, 39134]],
  350. },
  351. },
  352. {
  353. type: 'Feature',
  354. id: '1403',
  355. properties: { name: '阳泉市', cp: [113.4778, 38.0951], childNum: 3 },
  356. geometry: {
  357. type: 'Polygon',
  358. coordinates: [
  359. '@@°@nb„@lb@b„b„b‚@„x²al@lb„KXU@m‚kUWkkmUUƒVwV@XUW@™naVklKXblKnL‚ƒnLVanImaXKlL„ašV@U@KUKW„alƒXK@£WKXUV@VU„ƒUUVW„_V™@W@@K„@šƒUƒƒIWmXUmƒULƒn™JkImmÝaUbLƒK@UƒWk@mn™Uƒ@kVWb@Ubmx@lƒzUxƒ`U„ULml@„XWlƒ@UV@nk@U‚Vb@X™Jm™@@Vknƒyk@ƒzƒJƒnUV@bk@mJ@b°Ò°zXVlVXx‚@šbXVmnVbUlVb',
  360. ],
  361. encodeOffsets: [[115864, 39336]],
  362. },
  363. },
  364. ],
  365. UTF8Encoding: true,
  366. })
  367. var mapFeatures = echarts.getMap(this.mapName).geoJson.features
  368. mapFeatures.forEach(v => {
  369. // 地区名称
  370. var name = v.properties.name
  371. // 地区经纬度
  372. this.geoCoordMap[name] = v.properties.cp
  373. })
  374. myChart.setOption({
  375. tooltip: {
  376. padding: 15,
  377. enterable: true,
  378. transitionDuration: 1,
  379. formatter: (params, ticket, callback) => {
  380. let tipHtml = `
  381. <div class="tooltip-cont">
  382. <p>新开工:<span>工程建设项目</span></p>
  383. <p>总投资额:<span>${params.data.value}亿</span></p>
  384. <p>当前阶段:<span>可论证阶段</span></p>
  385. <p>时间节点:<span>2021.10-2022.10</span></p>
  386. </div>`
  387. return tipHtml
  388. },
  389. },
  390. visualMap: {
  391. min: 0,
  392. max: 300,
  393. right: 0,
  394. bottom: 0,
  395. text: ['高', '低'],
  396. textStyle: {
  397. color: '#f1f1f1'
  398. },
  399. realtime: false,
  400. calculable: true,
  401. inRange: {
  402. color: ['lightskyblue', '#2754b7']
  403. }
  404. },
  405. geo: {
  406. show: true,
  407. map: 'shanxi',
  408. layoutCenter: ['50%', '50%'], //地图位置
  409. layoutSize: '100%',
  410. label: {
  411. normal: {
  412. show: false,
  413. },
  414. emphasis: {
  415. show: false,
  416. },
  417. },
  418. roam: false,
  419. itemStyle: {
  420. normal: {
  421. areaColor: '#1946a8',
  422. shadowColor: '#1946a8',
  423. borderWidth: 1, //设置外层边框
  424. borderColor: '#1946a8',
  425. shadowOffsetX: 10,
  426. shadowOffsetY: 5,
  427. shadowBlur: 2,
  428. },
  429. emphasis: {
  430. areaColor: '#1946a8',
  431. borderColor: '#d4bc1d',
  432. borderWidth: 2, //设置外层边框
  433. },
  434. },
  435. },
  436. series: [
  437. {
  438. name: '散点',
  439. type: 'scatter',
  440. coordinateSystem: 'geo',
  441. data: this.convertData(data),
  442. symbolSize: function (val) {
  443. return 10
  444. },
  445. label: {
  446. normal: {
  447. formatter: '{b}',
  448. position: [10, 10],
  449. fontSize: 15,
  450. fontWeight: 600,
  451. fontStyle: 'italic',
  452. color: '#fff',
  453. show: true,
  454. },
  455. emphasis: {
  456. show: true,
  457. },
  458. },
  459. itemStyle: {
  460. normal: {
  461. color: '#000',
  462. borderWidth: 2,
  463. borderColor: '#fff',
  464. },
  465. },
  466. },
  467. {
  468. type: 'map',
  469. map: this.mapName,
  470. geoIndex: 0,
  471. aspectScale: 0.75, //长宽比
  472. showLegendSymbol: true, // 存在legend时显示
  473. label: {
  474. normal: {
  475. show: true,
  476. },
  477. emphasis: {
  478. show: false,
  479. textStyle: {
  480. color: '#fff',
  481. },
  482. },
  483. },
  484. roam: true,
  485. itemStyle: {
  486. normal: {
  487. areaColor: '#031525',
  488. borderColor: '#3B5077',
  489. },
  490. emphasis: {
  491. areaColor: '#2B91B7',
  492. },
  493. },
  494. animation: false,
  495. data: data,
  496. },
  497. {
  498. name: '点',
  499. type: 'scatter',
  500. coordinateSystem: 'geo',
  501. zlevel: 6,
  502. },
  503. {
  504. name: 'Top 5',
  505. type: 'effectScatter',
  506. coordinateSystem: 'geo',
  507. data: this.convertData(
  508. data
  509. .sort(function (a, b) {
  510. return b.value - a.value
  511. })
  512. .slice(0, 5)
  513. ),
  514. symbolSize: function (val) {
  515. return 15
  516. },
  517. showEffectOn: 'render',
  518. rippleEffect: {
  519. brushType: 'stroke',
  520. },
  521. hoverAnimation: true,
  522. label: {
  523. normal: {
  524. formatter: '{b}',
  525. position: 'left',
  526. show: false,
  527. },
  528. },
  529. itemStyle: {
  530. normal: {
  531. color: 'yellow',
  532. shadowBlur: 10,
  533. shadowColor: 'yellow',
  534. },
  535. },
  536. zlevel: 1000,
  537. },
  538. {
  539. name: '线路',
  540. type: 'lines',
  541. zlevel: 2,
  542. effect: {
  543. show: true,
  544. period: 4, //箭头指向速度,值越小速度越快
  545. trailLength: 0.02, //特效尾迹长度[0,1]值越大,尾迹越长重
  546. symbol: 'arrow', //箭头图标
  547. symbolSize: 5, //图标大小
  548. },
  549. lineStyle: {
  550. normal: {
  551. color: '#00FFFF',
  552. width: 1,
  553. type: 'dashed',
  554. opacity: 0.5, //尾迹线条透明度
  555. curveness: -0.3, //尾迹线条曲直度
  556. },
  557. },
  558. data: moveLine.normal,
  559. },
  560. ],
  561. })
  562. },
  563. initChartL1 () {
  564. let myChart = echarts.init(document.getElementById("echartL1"));
  565. let option = {
  566. grid: {
  567. top: 35,
  568. right: 40,
  569. left: 60,
  570. bottom: 40,
  571. },
  572. tooltip: {
  573. show: true,
  574. trigger: "axis",
  575. axisPointer: {
  576. // 坐标轴指示器,坐标轴触发有效
  577. type: "shadow", // 默认为直线,可选为:'line' | 'shadow'
  578. },
  579. },
  580. xAxis: {
  581. data: ["山西焦煤", "晋能控股", "华阳新材", "潞安化工", "华新燃气", "太重集团", "国际能源", "华远陆港", "水控集团", "文旅集团", "交控集团", '航产集团', '山西建投', '汾酒集团', '大地控股', '云时代', '华舰体育', '神农科技'],
  582. axisTick: {
  583. show: false,
  584. },
  585. // x轴的字体颜色
  586. axisLabel: {
  587. rotate: 40,
  588. textStyle: {
  589. color: "white",
  590. },
  591. },
  592. //y轴线的颜色以及宽度
  593. axisLine: {
  594. show: true,
  595. lineStyle: {
  596. color: "#1E5389",
  597. width: 1,
  598. type: "solid",
  599. },
  600. },
  601. },
  602. yAxis: {
  603. name: '亿元',
  604. nameTextStyle: {//y轴上方单位的颜色
  605. color: '#fff',
  606. },
  607. axisTick: {
  608. lineStyle: {
  609. color: "#18416F",
  610. },
  611. },
  612. // y轴的字体颜色
  613. axisLabel: {
  614. textStyle: {
  615. color: "white",
  616. },
  617. },
  618. splitLine: {
  619. show: true,
  620. lineStyle: {
  621. color: "#204561",
  622. width: 1,
  623. type: "dotted",
  624. },
  625. },
  626. //y轴线的颜色以及宽度
  627. axisLine: {
  628. show: true,
  629. lineStyle: {
  630. color: "#1E5389",
  631. width: 1,
  632. type: "solid",
  633. },
  634. },
  635. },
  636. series: [
  637. {
  638. name: "2022年额度",
  639. type: "bar",
  640. data: [283.42, 622.16, 251.91, 163.19, 46.44, 14.87, 0.00, 32.07, 9.06, 13.88, 143.16, 0.29, 33.75, 49.99, 7.38, 10.41, 0.00, 0.00],
  641. showBackground: false,
  642. backgroundStyle: {
  643. color: "#18416F",
  644. },
  645. barWidth: "10%",
  646. itemStyle: {
  647. barBorderRadius: [10, 10, 0, 0],
  648. color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
  649. {
  650. offset: 0,
  651. color: '#082550',
  652. },
  653. {
  654. offset: 1,
  655. color: '#69c0ff',
  656. },
  657. ]),
  658. },
  659. },
  660. {
  661. name: "2023年额度",
  662. type: "bar",
  663. data: [285.48, 627.03, 254.41, 164.08, 46.76, 14.93, 0.00, 32.45, 9.17, 14.01, 143.52, 0.27, 34.61, 51.45, 7.53, 10.52, 0.00, 0.00],
  664. showBackground: false,
  665. backgroundStyle: {
  666. color: "#18416F",
  667. },
  668. barWidth: "10%",
  669. itemStyle: {
  670. barBorderRadius: [10, 10, 0, 0],
  671. color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
  672. {
  673. offset: 0,
  674. color: '#082550',
  675. },
  676. {
  677. offset: 1,
  678. color: '#957DFF',
  679. },
  680. ]),
  681. },
  682. },
  683. ],
  684. legend: {
  685. data: ["2022年额度", "2023年额度"],
  686. textStyle: {
  687. // 图列内容样式
  688. color: "#fff", // 字体颜色
  689. // fontSize: "10",
  690. },
  691. right: 'center',
  692. icon: "roundRect",
  693. // 小图标的宽高
  694. itemHeight: 5,
  695. },
  696. };
  697. tools.loopShowTooltip(myChart, option, {
  698. nterval: 2000,
  699. loopSeries: true,
  700. })
  701. let that = this
  702. myChart.on('click', function (param) {
  703. console.log(param)
  704. if (param.name == '晋能控股') {
  705. that.showTip2 = true
  706. setTimeout(() => {
  707. that.initChartR4()
  708. that.initChartR5()
  709. })
  710. }
  711. })
  712. myChart.setOption(option);
  713. },
  714. initChartL2 () {
  715. let myChart = echarts.init(this.$refs['echartL2'])
  716. var value = 0.37;
  717. var data = [value];
  718. let option = {
  719. backgroundColor: 'transparent',
  720. title: [
  721. {
  722. text: '285.48亿',
  723. x: '37%',
  724. y: '80%',
  725. textStyle: {
  726. fontSize: 24,
  727. fontWeight: 'bold',
  728. color: '#2CB7E0',
  729. lineHeight: 16,
  730. textAlign: 'center',
  731. },
  732. }
  733. ],
  734. series: [
  735. {
  736. type: 'liquidFill',
  737. radius: '70%',
  738. center: ['50%', '40%'],
  739. color: [
  740. {
  741. type: 'linear',
  742. x: 0,
  743. y: 0,
  744. x2: 0,
  745. y2: 1,
  746. colorStops: [
  747. {
  748. offset: 0,
  749. color: '#446bf5',
  750. },
  751. {
  752. offset: 1,
  753. color: '#2ca3e2',
  754. },
  755. ],
  756. globalCoord: false,
  757. },
  758. ],
  759. data: [value, value], // data个数代表波浪数
  760. backgroundStyle: {
  761. borderWidth: 1,
  762. color: 'RGBA(51, 66, 127, 0.7)',
  763. },
  764. label: {
  765. normal: {
  766. textStyle: {
  767. fontSize: 30,
  768. color: '#fff',
  769. },
  770. },
  771. },
  772. outline: {
  773. // show: false
  774. borderDistance: 0,
  775. itemStyle: {
  776. borderWidth: 2,
  777. borderColor: 'transparent',
  778. },
  779. },
  780. },
  781. ],
  782. }
  783. myChart.setOption(option)
  784. },
  785. initChartL3 () {
  786. let myChart = echarts.init(this.$refs['echartL3'])
  787. option = {
  788. tooltip: {
  789. trigger: 'axis',
  790. formatter: '指标:' + '{c0}' + '<br/>' + '发展线:' + '{c1}' + '<br/>' + '生存线:' + '{c2}', //+ '<br/>'+ '{a1}:{c1}' + '%',
  791. axisPointer: {
  792. type: 'shadow',
  793. },
  794. },
  795. grid: {
  796. top: '10%',
  797. right: '5%',
  798. left: '10%',
  799. bottom: '15%',
  800. },
  801. xAxis: {
  802. data: ['总投资收益率', '销售利润率', '成本费用利润率', '总资产周转率', '财务内部收益率'],
  803. axisLine: {
  804. show: true, //隐藏X轴轴线
  805. lineStyle: {
  806. color: '#005094',
  807. width: 1,
  808. },
  809. },
  810. axisTick: {
  811. show: true, //隐藏X轴刻度
  812. },
  813. axisLabel: {
  814. show: true,
  815. rotate: 15,
  816. textStyle: {
  817. color: 'rgba(255,255,255,0.6)', //X轴文字颜色
  818. fontSize: 12,
  819. },
  820. },
  821. },
  822. yAxis: [
  823. {
  824. type: 'value',
  825. splitLine: {
  826. show: true,
  827. lineStyle: {
  828. color: '#68b4dd66',
  829. type: 'dashed',
  830. },
  831. },
  832. axisLine: {
  833. show: false
  834. },
  835. axisLabel: {
  836. show: true,
  837. formatter: '{value}',
  838. textStyle: {
  839. color: 'rgba(250,250,250,0.6)',
  840. },
  841. },
  842. nameTextStyle: {
  843. color: '#ebf8ac',
  844. fontSize: 16,
  845. },
  846. },
  847. ],
  848. series: [
  849. {
  850. name: '',
  851. type: 'bar',
  852. barWidth: 15,
  853. itemStyle: {
  854. normal: {
  855. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  856. {
  857. offset: 0,
  858. color: '#69c0ff',
  859. },
  860. {
  861. offset: 1,
  862. color: '#082550',
  863. },
  864. ]),
  865. },
  866. },
  867. data: [70, 52, 33, 41, 52],
  868. // markLine: {
  869. // symbol: ['none', 'none'],
  870. // data: [
  871. // {
  872. // name: '生存线',
  873. // yAxis: 10,
  874. // lineStyle: {
  875. // color: '#FF8F0A',
  876. // },
  877. // label: {
  878. // formatter: '{b}',
  879. // position: 'middle',
  880. // color: '#FF8F0A',
  881. // fontSize: 12,
  882. // },
  883. // },
  884. // {
  885. // name: '发展线',
  886. // yAxis: 15,
  887. // lineStyle: {
  888. // color: '#00EEA2',
  889. // },
  890. // label: {
  891. // formatter: '{b}',
  892. // position: 'middle',
  893. // color: '#00EEA2',
  894. // fontSize: 12,
  895. // },
  896. // },
  897. // ],
  898. // label: {
  899. // distance: [50, 0],
  900. // },
  901. // },
  902. },
  903. {
  904. name: '',
  905. type: 'line',
  906. barWidth: 15,
  907. itemStyle: {
  908. normal: {
  909. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  910. {
  911. offset: 0,
  912. color: '#69c0ff',
  913. },
  914. {
  915. offset: 1,
  916. color: 'green',
  917. },
  918. ]),
  919. },
  920. },
  921. data: [20, 30, 15, 28, 36],
  922. },
  923. {
  924. name: '',
  925. type: 'line',
  926. barWidth: 15,
  927. itemStyle: {
  928. normal: {
  929. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  930. {
  931. offset: 0,
  932. color: '#69c0ff',
  933. },
  934. {
  935. offset: 1,
  936. color: 'yellow',
  937. },
  938. ]),
  939. },
  940. },
  941. data: [15, 22, 17, 33, 14],
  942. },
  943. ],
  944. }
  945. myChart.setOption(option)
  946. // tools.loopShowTooltip(myChart, option, {
  947. // nterval: 2000,
  948. // loopSeries: true,
  949. // })
  950. },
  951. initChartL4 () {
  952. let data = [
  953. { value: [173.43, 129], name: '煤炭产业' },
  954. { value: [23.10, 2], name: '火电产业' },
  955. { value: [22.87, 8], name: '冶金产业' },
  956. { value: [9.71, 5], name: '焦化产业' },
  957. { value: [8.35, 6], name: '其他传统产业' }
  958. ]
  959. let count = 0
  960. data.forEach(item => {
  961. count += item.value[0]
  962. })
  963. let myChart = echarts.init(this.$refs['echartL4'])
  964. let option = {
  965. title: {
  966. text: '产业类型分析',
  967. x: 'center',
  968. y: '0%',
  969. textStyle: {
  970. color: 'rgba(255,255,255,0.6)',
  971. fontSize: 12,
  972. },
  973. },
  974. tooltip: {
  975. trigger: 'item',
  976. formatter: function (params) {
  977. return params.name + ',' + (params.value[0] / count * 100).toFixed(2) + '%' + '</br >' + params.value[1] + '个' + ',' + params.value[0] + '亿'
  978. }
  979. },
  980. color: ['#6682f5', '#8ba2ff', '#69c0ff', '#43ede3'],
  981. legend: {
  982. orient: 'horizontal',
  983. show: false,
  984. icon: 'circle',
  985. top: 'bottom',
  986. orient: 'vertical',
  987. right: '-3%',
  988. textStyle: {
  989. color: '#9DB9EB',
  990. fontSize: '10px'
  991. },
  992. itemWidth: 10,
  993. itemHeight: 10
  994. },
  995. series: [
  996. {
  997. name: '',
  998. type: 'pie',
  999. // radius: ['0%', '70%'],
  1000. radius: ['50%', '65%'],
  1001. center: ['50%', '55%'],
  1002. itemStyle: {
  1003. normal: {
  1004. borderColor: 'rgba(1,31,64,0.7)',
  1005. borderWidth: 6,
  1006. label: {
  1007. show: false,
  1008. },
  1009. },
  1010. },
  1011. labelLine: {
  1012. show: false,
  1013. },
  1014. data,
  1015. },
  1016. ],
  1017. }
  1018. myChart.setOption(option)
  1019. tools.loopShowTooltip(myChart, option, {
  1020. nterval: 2000,
  1021. loopSeries: true,
  1022. })
  1023. let that = this
  1024. myChart.on('click', function (param) {
  1025. console.log(param)
  1026. that.showTip3 = true
  1027. setTimeout(() => {
  1028. that.initChartT1(data, option)
  1029. })
  1030. })
  1031. },
  1032. initChartL5 () {
  1033. let data = [
  1034. { value: [29.26, 102], name: '新一代信息技术产业' },
  1035. { value: [59.11, 38], name: '高端装备制造产业' },
  1036. { value: [3.96, 5], name: '新材料产业' },
  1037. { value: [2.12, 7], name: '生物产业' },
  1038. { value: [0, 0], name: '新能源汽车产业' },
  1039. { value: [100.09, 79], name: '新能源产业' },
  1040. { value: [15.48, 32], name: '节能环保产业' },
  1041. { value: [0, 0], name: '数字创意产业' },
  1042. { value: [3.00, 3], name: '相关服务业' },
  1043. ]
  1044. let count = 0
  1045. data.forEach(item => {
  1046. count += item.value[0]
  1047. })
  1048. let myChart = echarts.init(this.$refs['echartL5'])
  1049. let option = {
  1050. title: {
  1051. text: '战略性新兴产业',
  1052. x: 'center',
  1053. y: '0%',
  1054. textStyle: {
  1055. color: 'rgba(255,255,255,0.6)',
  1056. fontSize: 12,
  1057. },
  1058. },
  1059. tooltip: {
  1060. trigger: 'item',
  1061. formatter: function (params) {
  1062. return params.name + ',' + (params.value[0] / count * 100).toFixed(2) + '%' + '</br >' + params.value[1] + '个' + ',' + params.value[0] + '亿'
  1063. }
  1064. },
  1065. color: ['#6682f5', '#8ba2ff', '#69c0ff', '#43ede3'],
  1066. legend: {
  1067. show: false,
  1068. icon: 'circle',
  1069. top: 'bottom',
  1070. orient: 'vertical',
  1071. right: '-3%',
  1072. textStyle: {
  1073. color: '#9DB9EB',
  1074. fontSize: '10px'
  1075. },
  1076. itemWidth: 10,
  1077. itemHeight: 10
  1078. },
  1079. series: [
  1080. {
  1081. name: '',
  1082. type: 'pie',
  1083. // radius: ['0%', '70%'],
  1084. radius: ['50%', '65%'],
  1085. center: ['50%', '55%'],
  1086. itemStyle: {
  1087. normal: {
  1088. borderColor: 'rgba(1,31,64,0.7)',
  1089. borderWidth: 6,
  1090. label: {
  1091. show: false,
  1092. },
  1093. },
  1094. },
  1095. labelLine: {
  1096. show: false,
  1097. },
  1098. data
  1099. },
  1100. ],
  1101. }
  1102. myChart.setOption(option)
  1103. tools.loopShowTooltip(myChart, option, {
  1104. nterval: 2000,
  1105. loopSeries: true,
  1106. })
  1107. let that = this
  1108. myChart.on('click', function (param) {
  1109. console.log(param)
  1110. that.showTip3 = true
  1111. setTimeout(() => {
  1112. that.initChartT1(data, option)
  1113. })
  1114. })
  1115. },
  1116. initChartL6 () {
  1117. let data = [
  1118. { value: [25.82, 43], name: '化工产业' },
  1119. { value: [17.36, 21], name: '煤层气产业' },
  1120. { value: [0.04, 1], name: '文旅康养' },
  1121. { value: [1.51, 7], name: '体育产业' },
  1122. { value: [9.32, 5], name: '酿造' },
  1123. { value: [71.12, 129], name: '建筑房地产' },
  1124. { value: [9.11, 14], name: '农业' },
  1125. { value: [0, 0], name: '其他' },
  1126. ]
  1127. let count = 0
  1128. data.forEach(item => {
  1129. count += item.value[0]
  1130. })
  1131. let myChart = echarts.init(this.$refs['echartL6'])
  1132. let option = {
  1133. title: {
  1134. text: '特色优势产业',
  1135. x: 'center',
  1136. y: '0%',
  1137. textStyle: {
  1138. color: 'rgba(255,255,255,0.6)',
  1139. fontSize: 12,
  1140. },
  1141. },
  1142. tooltip: {
  1143. trigger: 'item',
  1144. formatter: function (params) {
  1145. return params.name + ',' + (params.value[0] / count * 100).toFixed(2) + '%' + '</br >' + params.value[1] + '个' + ',' + params.value[0] + '亿'
  1146. }
  1147. // position: ['30%', '87%'],
  1148. },
  1149. color: ['#6682f5', '#8ba2ff', '#69c0ff', '#43ede3'],
  1150. legend: {
  1151. show: false,
  1152. icon: 'circle',
  1153. top: 'bottom',
  1154. orient: 'vertical',
  1155. right: '-3%',
  1156. textStyle: {
  1157. color: '#9DB9EB',
  1158. fontSize: '10px'
  1159. },
  1160. itemWidth: 10,
  1161. itemHeight: 10
  1162. },
  1163. series: [
  1164. {
  1165. name: '',
  1166. type: 'pie',
  1167. // radius: ['0%', '70%'],
  1168. radius: ['50%', '65%'],
  1169. center: ['50%', '55%'],
  1170. itemStyle: {
  1171. normal: {
  1172. borderColor: 'rgba(1,31,64,0.7)',
  1173. borderWidth: 6,
  1174. label: {
  1175. show: false,
  1176. },
  1177. },
  1178. },
  1179. labelLine: {
  1180. show: false,
  1181. },
  1182. data,
  1183. },
  1184. ],
  1185. }
  1186. myChart.setOption(option)
  1187. tools.loopShowTooltip(myChart, option, {
  1188. nterval: 2000,
  1189. loopSeries: true,
  1190. })
  1191. let that = this
  1192. myChart.on('click', function (param) {
  1193. console.log(param)
  1194. that.showTip3 = true
  1195. setTimeout(() => {
  1196. that.initChartT1(data, option)
  1197. })
  1198. })
  1199. },
  1200. initChartL7 () {
  1201. let data = [
  1202. { value: [155.82, 51], name: '交通运输业' },
  1203. { value: [0, 0], name: '市政设施' },
  1204. { value: [8.47, 19], name: '煤气层管网' },
  1205. { value: [10.64, 24], name: '物流贸易' },
  1206. { value: [41.05, 46], name: '水务' },
  1207. { value: [2.14, 7], name: '其他' },
  1208. ]
  1209. let count = 0
  1210. data.forEach(item => {
  1211. count += item.value[0]
  1212. })
  1213. let myChart = echarts.init(this.$refs['echartL7'])
  1214. let option = {
  1215. title: {
  1216. text: '公共基础等产业',
  1217. x: 'center',
  1218. y: '0%',
  1219. textStyle: {
  1220. color: 'rgba(255,255,255,0.6)',
  1221. fontSize: 12,
  1222. },
  1223. },
  1224. tooltip: {
  1225. trigger: 'item',
  1226. formatter: function (params) {
  1227. return params.name + ',' + (params.value[0] / count * 100).toFixed(2) + '%' + '</br >' + params.value[1] + '个' + ',' + params.value[0] + '亿'
  1228. }
  1229. },
  1230. color: ['#6682f5', '#8ba2ff', '#69c0ff', '#43ede3'],
  1231. legend: {
  1232. show: false,
  1233. icon: 'circle',
  1234. top: 'bottom',
  1235. orient: 'vertical',
  1236. right: '-3%',
  1237. textStyle: {
  1238. color: '#9DB9EB',
  1239. fontSize: '10px'
  1240. },
  1241. itemWidth: 10,
  1242. itemHeight: 10
  1243. },
  1244. series: [
  1245. {
  1246. name: '',
  1247. type: 'pie',
  1248. // radius: ['0%', '70%'],
  1249. radius: ['50%', '65%'],
  1250. center: ['50%', '55%'],
  1251. itemStyle: {
  1252. normal: {
  1253. borderColor: 'rgba(1,31,64,0.7)',
  1254. borderWidth: 6,
  1255. label: {
  1256. show: false,
  1257. },
  1258. },
  1259. },
  1260. labelLine: {
  1261. show: false,
  1262. },
  1263. data
  1264. },
  1265. ],
  1266. }
  1267. myChart.setOption(option)
  1268. tools.loopShowTooltip(myChart, option, {
  1269. nterval: 2000,
  1270. loopSeries: true,
  1271. })
  1272. let that = this
  1273. myChart.on('click', function (param) {
  1274. console.log(param)
  1275. that.showTip3 = true
  1276. setTimeout(() => {
  1277. that.initChartT1(data, option)
  1278. })
  1279. })
  1280. },
  1281. initChartR4 () {
  1282. let myChart = echarts.init(this.$refs['echartR4'])
  1283. let option = {
  1284. title: {
  1285. text: '2022年的可投资总额',
  1286. x: 'center',
  1287. y: '87%',
  1288. textStyle: {
  1289. color: 'rgba(255,255,255,0.6)',
  1290. fontSize: 12,
  1291. },
  1292. },
  1293. tooltip: {
  1294. trigger: 'item',
  1295. },
  1296. color: ['#69C1FF', '#4B97CC',],
  1297. legend: {
  1298. icon: 'circle',
  1299. top: 'bottom',
  1300. orient: 'vertical',
  1301. right: '1%',
  1302. textStyle: {
  1303. color: '#9DB9EB',
  1304. },
  1305. },
  1306. series: [
  1307. {
  1308. name: '',
  1309. type: 'pie',
  1310. label: {
  1311. normal: {
  1312. show: true,
  1313. position: 'center',
  1314. color: '#4c4a4a',
  1315. formatter: '{total|' + '462.83' + '}' + '\n\r' + '{active|亿元}',
  1316. rich: {
  1317. total: {
  1318. fontSize: 20,
  1319. fontFamily: "微软雅黑",
  1320. color: '#fff'
  1321. },
  1322. active: {
  1323. fontFamily: "微软雅黑",
  1324. fontSize: 15,
  1325. color: '#fff'
  1326. },
  1327. }
  1328. },
  1329. emphasis: {//中间文字显示
  1330. show: true,
  1331. }
  1332. },
  1333. radius: ['40%', '60%'],
  1334. center: ['50%', '45%'],
  1335. itemStyle: {
  1336. normal: {
  1337. label: {
  1338. show: false,
  1339. },
  1340. },
  1341. },
  1342. labelLine: {
  1343. show: false,
  1344. },
  1345. data: [
  1346. { value: 1048, name: '已使用额度' },
  1347. { value: 735, name: '可使用额度' }
  1348. ],
  1349. },
  1350. ],
  1351. }
  1352. myChart.setOption(option)
  1353. tools.loopShowTooltip(myChart, option, {
  1354. nterval: 2000,
  1355. loopSeries: true,
  1356. })
  1357. },
  1358. initChartR5 () {
  1359. let myChart = echarts.init(this.$refs['echartR5'])
  1360. let option = {
  1361. title: {
  1362. text: '2023年的可投资总额',
  1363. x: 'center',
  1364. y: '87%',
  1365. textStyle: {
  1366. color: 'rgba(255,255,255,0.6)',
  1367. fontSize: 12,
  1368. },
  1369. },
  1370. tooltip: {
  1371. trigger: 'item',
  1372. },
  1373. color: ['#69C1FF', '#4B97CC',],
  1374. legend: {
  1375. icon: 'circle',
  1376. top: 'bottom',
  1377. orient: 'vertical',
  1378. right: '1%',
  1379. textStyle: {
  1380. color: '#9DB9EB',
  1381. },
  1382. },
  1383. series: [
  1384. {
  1385. name: '',
  1386. type: 'pie',
  1387. label: {
  1388. normal: {
  1389. show: true,
  1390. position: 'center',
  1391. top: '50',
  1392. color: '#4c4a4a',
  1393. formatter: '{total|' + '462.83' + '}' + '\n\r' + '{active|亿元}',
  1394. rich: {
  1395. total: {
  1396. fontSize: 20,
  1397. fontFamily: "微软雅黑",
  1398. color: '#fff'
  1399. },
  1400. active: {
  1401. fontFamily: "微软雅黑",
  1402. fontSize: 15,
  1403. color: '#fff'
  1404. },
  1405. }
  1406. },
  1407. emphasis: {//中间文字显示
  1408. show: true,
  1409. }
  1410. },
  1411. radius: ['40%', '60%'],
  1412. center: ['50%', '45%'],
  1413. itemStyle: {
  1414. normal: {
  1415. label: {
  1416. show: false,
  1417. },
  1418. },
  1419. },
  1420. labelLine: {
  1421. show: false,
  1422. },
  1423. data: [
  1424. { value: 1048, name: '已使用额度' },
  1425. { value: 735, name: '可使用额度' }
  1426. ],
  1427. },
  1428. ],
  1429. }
  1430. myChart.setOption(option)
  1431. tools.loopShowTooltip(myChart, option, {
  1432. nterval: 2000,
  1433. loopSeries: true,
  1434. })
  1435. },
  1436. initChartR1 () {
  1437. let data = [
  1438. { value: [665.81, 549], name: '主业' },
  1439. { value: [65.17, 84], name: '辅业' },
  1440. { value: [80.94, 164], name: '技改' }
  1441. ]
  1442. let count = 0
  1443. data.forEach(item => {
  1444. count += item.value[0]
  1445. })
  1446. let myChart = echarts.init(this.$refs['echartR1'])
  1447. let option = {
  1448. title: {
  1449. text: '产业类别分析',
  1450. x: 'center',
  1451. y: '87%',
  1452. textStyle: {
  1453. color: 'rgba(255,255,255,0.6)',
  1454. fontSize: 12,
  1455. },
  1456. },
  1457. tooltip: {
  1458. trigger: 'item',
  1459. // formatter: '{b}' + ':' + '{c}' + '<br/>' + '占比:' + '{d}%',
  1460. // position: ['-5%', '95%'],
  1461. formatter: function (params) {
  1462. return '名称:' + params.name + '</br >' + '项目数量:' + params.value[1] + '个' + '</br >' + '投资金额:' + params.value[0] + '亿' + '</br >' + '占比:' + (params.value[0] / count * 100).toFixed(2) + '%'
  1463. }
  1464. },
  1465. color: ['#6682f5', '#8ba2ff', '#69c0ff', '#43ede3'],
  1466. legend: {
  1467. show: true,
  1468. icon: 'circle',
  1469. top: 'bottom',
  1470. orient: 'vertical',
  1471. right: '-3%',
  1472. textStyle: {
  1473. color: '#9DB9EB',
  1474. fontSize: '10px'
  1475. },
  1476. itemWidth: 10,
  1477. itemHeight: 10
  1478. },
  1479. series: [
  1480. {
  1481. name: '',
  1482. type: 'pie',
  1483. radius: ['40%', '60%'],
  1484. center: ['50%', '45%'],
  1485. itemStyle: {
  1486. normal: {
  1487. borderColor: 'rgba(1,31,64,0.7)',
  1488. borderWidth: 6,
  1489. label: {
  1490. show: false,
  1491. },
  1492. },
  1493. },
  1494. labelLine: {
  1495. show: false,
  1496. },
  1497. data,
  1498. },
  1499. ],
  1500. }
  1501. myChart.setOption(option)
  1502. tools.loopShowTooltip(myChart, option, {
  1503. nterval: 2000,
  1504. loopSeries: true,
  1505. })
  1506. },
  1507. initChartR2 () {
  1508. let data = [
  1509. { value: [340.77, 168], name: '特别监管类' },
  1510. { value: [390.22, 465], name: '备案类' }
  1511. ]
  1512. let count = 0
  1513. data.forEach(item => {
  1514. count += item.value[0]
  1515. })
  1516. let myChart = echarts.init(this.$refs['echartR2'])
  1517. let option = {
  1518. title: {
  1519. text: '项目阶段分析',
  1520. x: 'center',
  1521. y: '87%',
  1522. textStyle: {
  1523. color: 'rgba(255,255,255,0.6)',
  1524. fontSize: 12,
  1525. },
  1526. },
  1527. tooltip: {
  1528. trigger: 'item',
  1529. formatter: function (params) {
  1530. return '名称:' + params.name + '</br >' + '项目数量:' + params.value[1] + '个' + '</br >' + '投资金额:' + params.value[0] + '亿' + '</br >' + '占比:' + (params.value[0] / count * 100).toFixed(2) + '%'
  1531. }
  1532. // position: ['-5%', '95%'],
  1533. },
  1534. color: ['#6682f5', '#8ba2ff', '#69c0ff', '#43ede3'],
  1535. legend: {
  1536. show: true,
  1537. icon: 'circle',
  1538. top: 'bottom',
  1539. orient: 'vertical',
  1540. right: '-3%',
  1541. textStyle: {
  1542. color: '#9DB9EB',
  1543. fontSize: '10px'
  1544. },
  1545. itemWidth: 10,
  1546. itemHeight: 10
  1547. },
  1548. series: [
  1549. {
  1550. name: '',
  1551. type: 'pie',
  1552. radius: ['40%', '60%'],
  1553. center: ['50%', '45%'],
  1554. itemStyle: {
  1555. normal: {
  1556. borderColor: 'rgba(1,31,64,0.7)',
  1557. borderWidth: 6,
  1558. label: {
  1559. show: false,
  1560. },
  1561. },
  1562. },
  1563. labelLine: {
  1564. show: false,
  1565. },
  1566. data,
  1567. },
  1568. ],
  1569. }
  1570. myChart.setOption(option)
  1571. tools.loopShowTooltip(myChart, option, {
  1572. nterval: 2000,
  1573. loopSeries: true,
  1574. })
  1575. },
  1576. initChartR3 () {
  1577. let myChart = echarts.init(this.$refs['echartR3'])
  1578. let option = {
  1579. title: {
  1580. text: '股权类',
  1581. textStyle: {
  1582. color: '#69C0FF',
  1583. fontSize: 16,
  1584. fontWeight: 500
  1585. },
  1586. top: '10',
  1587. left: '10'
  1588. },
  1589. textStyle: {
  1590. color: '#fff',
  1591. },
  1592. tooltip: {
  1593. trigger: "axis",
  1594. formatter: function (params) {
  1595. var tip = params[0].axisValue + '<br/>' + params[0].marker + params[0].data[1] + ':' + params[0].data[2] + '个,' + params[0].data[3] + '亿元' + '<br/>' + params[1].marker + params[1].data[1] + ':' + params[1].data[2] + '个,' + params[0].data[3] + '亿元';
  1596. return tip
  1597. },
  1598. axisPointer: {
  1599. lineStyle: {
  1600. type: 'dashed',
  1601. width: 2,
  1602. color: 'rgba(255,255,255,0.6)'
  1603. },
  1604. animation: true
  1605. }
  1606. },
  1607. grid: {
  1608. top: '22%',
  1609. right: '5%',
  1610. left: '15%',
  1611. bottom: '15%',
  1612. },
  1613. yAxis: {
  1614. data: ['备案', '特别监管'],
  1615. splitLine: {
  1616. show: true,
  1617. lineStyle: {
  1618. color: '#68b4dd66',
  1619. type: 'dashed',
  1620. },
  1621. },
  1622. axisLine: {
  1623. show: false
  1624. },
  1625. axisLabel: {
  1626. show: true,
  1627. formatter: '{value}',
  1628. textStyle: {
  1629. color: 'rgba(250,250,250,0.6)',
  1630. },
  1631. },
  1632. nameTextStyle: {
  1633. color: '#ebf8ac',
  1634. fontSize: 16,
  1635. },
  1636. },
  1637. xAxis: {
  1638. data: ['项目储备', '项目立项', '可研论证', '投资决策'],
  1639. axisLine: {
  1640. show: true, //隐藏X轴轴线
  1641. lineStyle: {
  1642. color: '#005094',
  1643. width: 1,
  1644. },
  1645. },
  1646. axisTick: {
  1647. show: false, //隐藏X轴刻度
  1648. },
  1649. axisLabel: {
  1650. show: true,
  1651. textStyle: {
  1652. color: 'rgba(255,255,255,0.6)', //X轴文字颜色
  1653. fontSize: 12,
  1654. },
  1655. },
  1656. },
  1657. series: [
  1658. {
  1659. name: '',
  1660. type: 'scatter',
  1661. symbol: 'circle',
  1662. symbolSize: function (data) {
  1663. return Math.sqrt(data[2]) * 3;
  1664. },
  1665. label: {
  1666. emphasis: {
  1667. show: true,
  1668. formatter: function (param) {
  1669. return param.data[2];
  1670. },
  1671. position: 'top'
  1672. }
  1673. },
  1674. itemStyle: {
  1675. normal: {
  1676. color: '#40A9FF'
  1677. }
  1678. },
  1679. data: [
  1680. ['项目储备', '特别监管', 9, 6.49],
  1681. ['项目立项', '特别监管', 0, 0.00],
  1682. ['可研论证', '特别监管', 2, 0.10],
  1683. ['投资决策', '特别监管', 27, 15.52],
  1684. ]
  1685. },
  1686. {
  1687. name: '',
  1688. type: 'scatter',
  1689. symbol: 'circle',
  1690. symbolSize: function (data) {
  1691. return Math.sqrt(data[2]) * 3;
  1692. },
  1693. label: {
  1694. emphasis: {
  1695. show: true,
  1696. formatter: function (param) {
  1697. return param.data[2];
  1698. },
  1699. position: 'top'
  1700. }
  1701. },
  1702. itemStyle: {
  1703. normal: {
  1704. color: '#45DAD1'
  1705. }
  1706. },
  1707. data: [
  1708. ['项目储备', '备案', 39, 8.08],
  1709. ['项目立项', '备案', 7, 1.83],
  1710. ['可研论证', '备案', 19, 1.01],
  1711. ['投资决策', '备案', 73, 17.65],
  1712. ]
  1713. },
  1714. ]
  1715. }
  1716. myChart.setOption(option)
  1717. tools.loopShowTooltip(myChart, option, {
  1718. nterval: 2000,
  1719. loopSeries: true,
  1720. })
  1721. },
  1722. initChartR6 () {
  1723. let myChart = echarts.init(this.$refs['echartR6'])
  1724. let option = {
  1725. title: {
  1726. text: '固定资产',
  1727. textStyle: {
  1728. color: '#69C0FF',
  1729. fontSize: 16,
  1730. fontWeight: 500
  1731. },
  1732. top: '10',
  1733. left: '10'
  1734. },
  1735. textStyle: {
  1736. color: '#fff',
  1737. },
  1738. tooltip: {
  1739. trigger: "axis",
  1740. formatter: function (params) {
  1741. var tip = params[0].axisValue + '<br/>' + params[0].marker + params[0].data[1] + ':' + params[0].data[2] + '个,' + params[0].data[3] + '亿元' + '<br/>' + params[1].marker + params[1].data[1] + ':' + params[1].data[2] + '个,' + params[0].data[3] + '亿元';
  1742. return tip
  1743. },
  1744. axisPointer: {
  1745. lineStyle: {
  1746. type: 'dashed',
  1747. width: 2,
  1748. color: 'rgba(255,255,255,0.6)'
  1749. },
  1750. animation: true
  1751. }
  1752. },
  1753. grid: {
  1754. top: '25%',
  1755. right: '5%',
  1756. left: '15%',
  1757. bottom: '15%',
  1758. },
  1759. yAxis: {
  1760. data: ['备案', '特别监管'],
  1761. splitLine: {
  1762. show: true,
  1763. lineStyle: {
  1764. color: '#68b4dd66',
  1765. type: 'dashed',
  1766. },
  1767. },
  1768. axisLine: {
  1769. show: false
  1770. },
  1771. axisLabel: {
  1772. show: true,
  1773. formatter: '{value}',
  1774. textStyle: {
  1775. color: 'rgba(250,250,250,0.6)',
  1776. },
  1777. },
  1778. nameTextStyle: {
  1779. color: '#ebf8ac',
  1780. fontSize: 16,
  1781. },
  1782. },
  1783. xAxis: {
  1784. data: ['项目储备', '项目立项', '可研论证', '投资决策'],
  1785. axisLine: {
  1786. show: true, //隐藏X轴轴线
  1787. lineStyle: {
  1788. color: '#005094',
  1789. width: 1,
  1790. },
  1791. },
  1792. axisTick: {
  1793. show: false, //隐藏X轴刻度
  1794. },
  1795. axisLabel: {
  1796. show: true,
  1797. textStyle: {
  1798. color: 'rgba(255,255,255,0.6)', //X轴文字颜色
  1799. fontSize: 12,
  1800. },
  1801. },
  1802. },
  1803. series: [
  1804. {
  1805. name: '特别监管',
  1806. type: 'scatter',
  1807. symbol: 'circle',//'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow'
  1808. symbolSize: function (data) {
  1809. return Math.sqrt(data[2]) * 3;
  1810. },
  1811. label: {
  1812. emphasis: {
  1813. show: true,
  1814. formatter: function (param) {
  1815. return param.data[2];
  1816. },
  1817. position: 'top'
  1818. }
  1819. },
  1820. itemStyle: {
  1821. normal: {
  1822. color: '#40A9FF'
  1823. }
  1824. },
  1825. data: [
  1826. ['项目储备', '特别监管', 14, 12.05],
  1827. ['项目立项', '特别监管', 2, 1.25],
  1828. ['可研论证', '特别监管', 10, 32.69],
  1829. ['投资决策', '特别监管', 15, 28.53],
  1830. ]
  1831. },
  1832. {
  1833. name: '备案',
  1834. type: 'scatter',
  1835. symbol: 'circle',//'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow'
  1836. symbolSize: function (data) {
  1837. return Math.sqrt(data[2]) * 3;
  1838. },
  1839. label: {
  1840. emphasis: {
  1841. show: true,
  1842. formatter: function (param) {
  1843. return param.data[2];
  1844. },
  1845. position: 'top'
  1846. }
  1847. },
  1848. itemStyle: {
  1849. normal: {
  1850. color: '#45DAD1'
  1851. }
  1852. },
  1853. data: [
  1854. ['项目储备', '备案', 27, 23.86],
  1855. ['项目立项', '备案', 1, 1.05],
  1856. ['可研论证', '备案', 14, 18.46],
  1857. ['投资决策', '备案', 40, 38.86],
  1858. ]
  1859. },
  1860. ]
  1861. }
  1862. myChart.setOption(option)
  1863. tools.loopShowTooltip(myChart, option, {
  1864. nterval: 2000,
  1865. loopSeries: true,
  1866. })
  1867. },
  1868. initChartT1(list, info) {
  1869. let count = 0
  1870. console.log(list, info)
  1871. this.echartTitle = info.title.text
  1872. let data = list
  1873. data.forEach(item => {
  1874. count += item.value[0]
  1875. })
  1876. let option = JSON.parse(JSON.stringify(info))
  1877. option.series[0].center = ['50%', '50%']
  1878. option.series[0].radius = ['60%', '75%']
  1879. option.legend = {
  1880. show: true,
  1881. icon: 'circle',
  1882. top: 'bottom',
  1883. orient: 'vertical',
  1884. right: '3%',
  1885. textStyle: {
  1886. color: '#9DB9EB',
  1887. fontSize: 16
  1888. },
  1889. itemWidth: 10,
  1890. itemHeight: 10
  1891. },
  1892. option.title.text = ''
  1893. option.tooltip = {
  1894. trigger: 'item',
  1895. formatter: function (params) {
  1896. return params.name + ',' + (params.value[0] / count * 100).toFixed(2) + '%' + '</br >' + params.value[1] + '个' + ',' + params.value[0] + '亿'
  1897. }
  1898. }
  1899. let myChart = echarts.init(this.$refs['echartT1'])
  1900. myChart.setOption(option)
  1901. tools.loopShowTooltip(myChart, option, {
  1902. nterval: 2000,
  1903. loopSeries: true,
  1904. })
  1905. }
  1906. },
  1907. })