investHome2.js 63 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915191619171918191919201921192219231924192519261927192819291930193119321933193419351936193719381939194019411942194319441945194619471948194919501951195219531954195519561957195819591960196119621963196419651966196719681969197019711972197319741975197619771978197919801981198219831984198519861987198819891990199119921993199419951996199719981999200020012002200320042005200620072008200920102011201220132014201520162017201820192020202120222023202420252026202720282029203020312032203320342035203620372038
  1. let app = new Vue({
  2. el: '#app',
  3. data () {
  4. return {
  5. count: 1,
  6. countType: 0,
  7. type: true, // 切换柱状图状态
  8. showTip2: false,
  9. showTip3: false,
  10. timer2: '',
  11. echartTitle: '',
  12. year: '2022',
  13. time: '',
  14. timer: '',
  15. mapName: 'shanxi',
  16. geoCoordMap: {},
  17. config1: {
  18. number: [100],
  19. content: '{nt}个',
  20. },
  21. storageRecordConfig: {
  22. // waitTime: '2000000',
  23. hoverPause: false,
  24. header: ['企业集团', '项目名 ', '投资总额'],
  25. // headerBGC: '#05507b33',
  26. // oddRowBGC: '#05507b33',
  27. // evenRowBGC: '#05507b33',
  28. headerBGC: '#05183c',
  29. headerBGC: '#05507b33',
  30. oddRowBGC: '#05183c',
  31. evenRowBGC: '#05183c',
  32. rowNum: 4,
  33. align: ['center'],
  34. data: [
  35. ['国际能源', '娄烦县120MW智慧光伏发电项目+10%储能', "6.78亿元 "],
  36. ['国际能源', '平朔矿区150MW农光储氢一体化项目', "7.84亿元"],
  37. ['汾酒集团', '汾酒2030技改原酒产储能扩建项目(一期)', "91.02亿元 "],
  38. ['大地控股', '山西大地控股忻州新店矿业有限公司投资建设年产800万吨精品砂石骨料项目', "8.67亿元 "],
  39. ['潞安化工', '分布式光伏发电项目', "2.00亿元 "],
  40. ['太重集团', '设立太重(大同)新能源产业投资公司', "0.30亿元 "],
  41. ['大地控股', '山西大地宏翔环保科技有限公司电厂固废资源化综合利用建设项目', "3.60亿元 "],
  42. ['大地控股', '山西大地海科环保科技有限公司电厂固废资源化综合利用建设项目', "3.11亿元 "],
  43. ['汾酒集团', '保健酒园区新增原酒产能项目', "4.98亿元 "],
  44. ['汾酒集团', '白玉酒厂改扩建项目', "4.96亿元 "],
  45. ['华阳新材', '5GW高效光伏组件制造项目', "4.82亿元 "],
  46. ['华新燃气', '吉县—延长输气管道项目(一期工程)', "3.54亿元 "],
  47. ['太重集团', '建设液压挖掘机配套油缸项目', "2.60亿元 "],
  48. ['华远陆港', '物产集团参股设立项目公司投资建设山西物产万科(太原)综合物流产业园项目', "6.60亿元 "],
  49. ['太重集团', '设立昔阳县晶能新能源有限公司', "0.50亿元 "],
  50. ['山西建投', '设立山西低碳环保产业集团有限公司', "30.00亿元 "],
  51. ['山西建投', '设立山西省太忻经济一体化发展投资集团有限公司', "30.00亿元 "],
  52. ['华新燃气', '设立山西华新液化天然气集团有限公司', "3.00亿元 "],
  53. ['交控集团', '设立山西交控新能源发展有限公司', "3.00亿元 "],
  54. ],
  55. },
  56. companyList: [
  57. { name: '山西焦煤' },
  58. { name: '晋能控股' },
  59. { name: '华新燃气' },
  60. { name: '山西建投' },
  61. { name: '潞安化工' },
  62. { name: '华远陆港' },
  63. { name: '航产集团' },
  64. { name: '大地控股' },
  65. { name: '国新能源' },
  66. { name: '汾酒集团' },
  67. { name: '云时代' },
  68. { name: '神农科技' },
  69. { name: '华阳新材' },
  70. { name: '华舰体育' },
  71. { name: '交控集团' },
  72. { name: '文旅集团' },
  73. { name: '水控集团' },
  74. { name: '太重集团' },
  75. ],
  76. }
  77. },
  78. created () {
  79. this.time = formatDate()
  80. this.timer = setInterval(() => {
  81. this.time = formatDate()
  82. }, 1000)
  83. },
  84. beforeDestroy () {
  85. if (this.timer) {
  86. clearInterval(this.timer);
  87. }
  88. this.timer2 && clearInterval(this.timer2);
  89. },
  90. mounted () {
  91. // 左侧图表
  92. setTimeout(() => {
  93. this.initChartL1()
  94. this.initChartL2()
  95. this.initChartL3()
  96. this.initChartL4()
  97. this.initChartL5()
  98. this.initChartL6()
  99. this.initChartL7()
  100. this.initChartR1()
  101. this.initChartR2()
  102. this.initChartR3()
  103. this.initChartR6()
  104. },)
  105. setTimeout(() => {
  106. this.timer2 = setInterval(() => {
  107. if (this.count < dataList.length - 1) {
  108. this.count++
  109. } else {
  110. this.count = 1
  111. }
  112. if (this.count > 14) {
  113. this.countType = 1
  114. } else {
  115. this.countType = 0
  116. }
  117. this.initChartL3()
  118. }, 2000)
  119. }, 300)
  120. // setTimeout(() => {
  121. // var swiper = new Swiper(".mySwiper", {
  122. // pagination: {
  123. // el: ".swiper-pagination",
  124. // type: "progressbar",
  125. // },
  126. // navigation: {
  127. // nextEl: ".swiper-button-next",
  128. // prevEl: ".swiper-button-prev",
  129. // },
  130. // });
  131. // swiper.el.onmouseout = function () {
  132. // swiper.autoplay.start();
  133. // }
  134. // })
  135. },
  136. methods: {
  137. convertData (data) {
  138. var res = []
  139. for (var i = 0; i < data.length; i++) {
  140. var geoCoord = this.geoCoordMap[data[i].name]
  141. if (geoCoord) {
  142. res.push({
  143. name: data[i].name,
  144. value: geoCoord.concat(data[i].value),
  145. })
  146. }
  147. }
  148. return res
  149. },
  150. initChinaChart () {
  151. var data = [
  152. { name: '吕梁市', value: 150 },
  153. { name: '大同市', value: 190 },
  154. { name: '忻州市', value: 140 },
  155. { name: '朔州市', value: 160 },
  156. { name: '晋中市', value: 100 },
  157. { name: '太原市', value: 300 },
  158. { name: '临汾市', value: 190 },
  159. { name: '长治市', value: 100 },
  160. { name: '晋城市', value: 280 },
  161. { name: '运城市', value: 180 },
  162. { name: '阳泉市', value: 110 },
  163. ]
  164. var moveLine = {
  165. normal: [
  166. {
  167. fromName: '太原市',
  168. toName: '吕梁市',
  169. coords: [
  170. [112.3352, 37.9413],
  171. [111.3574, 37.7325],
  172. ],
  173. },
  174. {
  175. fromName: '太原市',
  176. toName: '忻州市',
  177. coords: [
  178. [112.3352, 37.9413],
  179. [112.4561, 38.8971],
  180. ],
  181. },
  182. {
  183. fromName: '太原市',
  184. toName: '临汾市',
  185. coords: [
  186. [112.3352, 37.9413],
  187. [111.4783, 36.1615],
  188. ],
  189. },
  190. {
  191. fromName: '太原市',
  192. toName: '阳泉市',
  193. coords: [
  194. [112.3352, 37.9413],
  195. [113.4778, 38.0951],
  196. ],
  197. },
  198. {
  199. fromName: '太原市',
  200. toName: '晋中市',
  201. coords: [
  202. [112.3352, 37.9413],
  203. [112.7747, 37.37],
  204. ],
  205. },
  206. {
  207. fromName: '太原市',
  208. toName: '运城市',
  209. coords: [
  210. [112.3352, 37.9413],
  211. [111.1487, 35.2002],
  212. ],
  213. },
  214. {
  215. fromName: '太原市',
  216. toName: '大同市',
  217. coords: [
  218. [112.3352, 37.9413],
  219. [113.7854, 39.8035],
  220. ],
  221. },
  222. {
  223. fromName: '太原市',
  224. toName: '晋城市',
  225. coords: [
  226. [112.3352, 37.9413],
  227. [112.7856, 35.6342],
  228. ],
  229. },
  230. {
  231. fromName: '太原市',
  232. toName: '长治市',
  233. coords: [
  234. [112.3352, 37.9413],
  235. [112.8625, 36.4746],
  236. ],
  237. },
  238. {
  239. fromName: '太原市',
  240. toName: '朔州市',
  241. coords: [
  242. [112.3352, 37.9413],
  243. [113.0713, 39.6991],
  244. ],
  245. },
  246. ],
  247. }
  248. /*获取地图数据*/
  249. let myChart = echarts.init(this.$refs['echarts-map'])
  250. echarts.registerMap('shanxi', {
  251. type: 'FeatureCollection',
  252. features: [
  253. {
  254. type: 'Feature',
  255. id: '1409',
  256. properties: { name: '忻州市', cp: [112.4561, 38.8971], childNum: 14 },
  257. geometry: {
  258. type: 'Polygon',
  259. coordinates: [
  260. '@@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',
  261. ],
  262. encodeOffsets: [[113614, 39657]],
  263. },
  264. },
  265. {
  266. type: 'Feature',
  267. id: '1411',
  268. properties: { name: '吕梁市', cp: [111.3574, 37.7325], childNum: 13 },
  269. geometry: {
  270. type: 'Polygon',
  271. coordinates: [
  272. '@@@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',
  273. ],
  274. encodeOffsets: [[113614, 39657]],
  275. },
  276. },
  277. {
  278. type: 'Feature',
  279. id: '1410',
  280. properties: { name: '临汾市', cp: [111.4783, 36.1615], childNum: 17 },
  281. geometry: {
  282. type: 'Polygon',
  283. coordinates: [
  284. '@@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',
  285. ],
  286. encodeOffsets: [[113063, 37784]],
  287. },
  288. },
  289. {
  290. type: 'Feature',
  291. id: '1407',
  292. properties: { name: '晋中市', cp: [112.7747, 37.37], childNum: 11 },
  293. geometry: {
  294. type: 'Polygon',
  295. coordinates: [
  296. '@@@š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@',
  297. ],
  298. encodeOffsets: [[114087, 37682]],
  299. },
  300. },
  301. {
  302. type: 'Feature',
  303. id: '1408',
  304. properties: { name: '运城市', cp: [111.1487, 35.2002], childNum: 13 },
  305. geometry: {
  306. type: 'Polygon',
  307. coordinates: [
  308. '@@„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@„',
  309. ],
  310. encodeOffsets: [[113232, 36597]],
  311. },
  312. },
  313. {
  314. type: 'Feature',
  315. id: '1402',
  316. properties: { name: '大同市', cp: [113.7854, 39.8035], childNum: 8 },
  317. geometry: {
  318. type: 'Polygon',
  319. coordinates: [
  320. '@@²£š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',
  321. ],
  322. encodeOffsets: [[115335, 41209]],
  323. },
  324. },
  325. {
  326. type: 'Feature',
  327. id: '1404',
  328. properties: { name: '长治市', cp: [112.8625, 36.4746], childNum: 12 },
  329. geometry: {
  330. type: 'Polygon',
  331. coordinates: [
  332. '@@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',
  333. ],
  334. encodeOffsets: [[116269, 37637]],
  335. },
  336. },
  337. {
  338. type: 'Feature',
  339. id: '1406',
  340. properties: { name: '朔州市', cp: [113.0713, 39.6991], childNum: 5 },
  341. geometry: {
  342. type: 'Polygon',
  343. coordinates: [
  344. '@@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‚',
  345. ],
  346. encodeOffsets: [[114615, 40562]],
  347. },
  348. },
  349. {
  350. type: 'Feature',
  351. id: '1405',
  352. properties: { name: '晋城市', cp: [112.7856, 35.6342], childNum: 6 },
  353. geometry: {
  354. type: 'Polygon',
  355. coordinates: [
  356. '@@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°',
  357. ],
  358. encodeOffsets: [[115223, 36895]],
  359. },
  360. },
  361. {
  362. type: 'Feature',
  363. id: '1401',
  364. properties: { name: '太原市', cp: [112.3352, 37.9413], childNum: 5 },
  365. geometry: {
  366. type: 'Polygon',
  367. coordinates: [
  368. '@@„@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š@°',
  369. ],
  370. encodeOffsets: [[114503, 39134]],
  371. },
  372. },
  373. {
  374. type: 'Feature',
  375. id: '1403',
  376. properties: { name: '阳泉市', cp: [113.4778, 38.0951], childNum: 3 },
  377. geometry: {
  378. type: 'Polygon',
  379. coordinates: [
  380. '@@°@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',
  381. ],
  382. encodeOffsets: [[115864, 39336]],
  383. },
  384. },
  385. ],
  386. UTF8Encoding: true,
  387. })
  388. var mapFeatures = echarts.getMap(this.mapName).geoJson.features
  389. mapFeatures.forEach(v => {
  390. // 地区名称
  391. var name = v.properties.name
  392. // 地区经纬度
  393. this.geoCoordMap[name] = v.properties.cp
  394. })
  395. myChart.setOption({
  396. tooltip: {
  397. padding: 15,
  398. enterable: true,
  399. transitionDuration: 1,
  400. formatter: (params, ticket, callback) => {
  401. let tipHtml = `
  402. <div class="tooltip-cont">
  403. <p>新开工:<span>工程建设项目</span></p>
  404. <p>总投资额:<span>${params.data.value}亿</span></p>
  405. <p>当前阶段:<span>可论证阶段</span></p>
  406. <p>时间节点:<span>2021.10-2022.10</span></p>
  407. </div>`
  408. return tipHtml
  409. },
  410. },
  411. visualMap: {
  412. min: 0,
  413. max: 300,
  414. right: 0,
  415. bottom: 0,
  416. text: ['高', '低'],
  417. textStyle: {
  418. color: '#f1f1f1'
  419. },
  420. realtime: false,
  421. calculable: true,
  422. inRange: {
  423. color: ['lightskyblue', '#2754b7']
  424. }
  425. },
  426. geo: {
  427. show: true,
  428. map: 'shanxi',
  429. layoutCenter: ['50%', '50%'], //地图位置
  430. layoutSize: '100%',
  431. label: {
  432. normal: {
  433. show: false,
  434. },
  435. emphasis: {
  436. show: false,
  437. },
  438. },
  439. roam: false,
  440. itemStyle: {
  441. normal: {
  442. areaColor: '#1946a8',
  443. shadowColor: '#1946a8',
  444. borderWidth: 1, //设置外层边框
  445. borderColor: '#1946a8',
  446. shadowOffsetX: 10,
  447. shadowOffsetY: 5,
  448. shadowBlur: 2,
  449. },
  450. emphasis: {
  451. areaColor: '#1946a8',
  452. borderColor: '#d4bc1d',
  453. borderWidth: 2, //设置外层边框
  454. },
  455. },
  456. },
  457. series: [
  458. {
  459. name: '散点',
  460. type: 'scatter',
  461. coordinateSystem: 'geo',
  462. data: this.convertData(data),
  463. symbolSize: function (val) {
  464. return 10
  465. },
  466. label: {
  467. normal: {
  468. formatter: '{b}',
  469. position: [10, 10],
  470. fontSize: 15,
  471. fontWeight: 600,
  472. fontStyle: 'italic',
  473. color: '#fff',
  474. show: true,
  475. },
  476. emphasis: {
  477. show: true,
  478. },
  479. },
  480. itemStyle: {
  481. normal: {
  482. color: '#000',
  483. borderWidth: 2,
  484. borderColor: '#fff',
  485. },
  486. },
  487. },
  488. {
  489. type: 'map',
  490. map: this.mapName,
  491. geoIndex: 0,
  492. aspectScale: 0.75, //长宽比
  493. showLegendSymbol: true, // 存在legend时显示
  494. label: {
  495. normal: {
  496. show: true,
  497. },
  498. emphasis: {
  499. show: false,
  500. textStyle: {
  501. color: '#fff',
  502. },
  503. },
  504. },
  505. roam: true,
  506. itemStyle: {
  507. normal: {
  508. areaColor: '#031525',
  509. borderColor: '#3B5077',
  510. },
  511. emphasis: {
  512. areaColor: '#2B91B7',
  513. },
  514. },
  515. animation: false,
  516. data: data,
  517. },
  518. {
  519. name: '点',
  520. type: 'scatter',
  521. coordinateSystem: 'geo',
  522. zlevel: 6,
  523. },
  524. {
  525. name: 'Top 5',
  526. type: 'effectScatter',
  527. coordinateSystem: 'geo',
  528. data: this.convertData(
  529. data
  530. .sort(function (a, b) {
  531. return b.value - a.value
  532. })
  533. .slice(0, 5)
  534. ),
  535. symbolSize: function (val) {
  536. return 15
  537. },
  538. showEffectOn: 'render',
  539. rippleEffect: {
  540. brushType: 'stroke',
  541. },
  542. hoverAnimation: true,
  543. label: {
  544. normal: {
  545. formatter: '{b}',
  546. position: 'left',
  547. show: false,
  548. },
  549. },
  550. itemStyle: {
  551. normal: {
  552. color: 'yellow',
  553. shadowBlur: 10,
  554. shadowColor: 'yellow',
  555. },
  556. },
  557. zlevel: 1000,
  558. },
  559. {
  560. name: '线路',
  561. type: 'lines',
  562. zlevel: 2,
  563. effect: {
  564. show: true,
  565. period: 4, //箭头指向速度,值越小速度越快
  566. trailLength: 0.02, //特效尾迹长度[0,1]值越大,尾迹越长重
  567. symbol: 'arrow', //箭头图标
  568. symbolSize: 5, //图标大小
  569. },
  570. lineStyle: {
  571. normal: {
  572. color: '#00FFFF',
  573. width: 1,
  574. type: 'dashed',
  575. opacity: 0.5, //尾迹线条透明度
  576. curveness: -0.3, //尾迹线条曲直度
  577. },
  578. },
  579. data: moveLine.normal,
  580. },
  581. ],
  582. })
  583. },
  584. initChartL1 () {
  585. let myChart = echarts.init(document.getElementById("echartL1"));
  586. let option = {
  587. grid: {
  588. top: 35,
  589. right: 40,
  590. left: 60,
  591. bottom: 40,
  592. },
  593. tooltip: {
  594. show: true,
  595. trigger: "axis",
  596. axisPointer: {
  597. // 坐标轴指示器,坐标轴触发有效
  598. type: "shadow", // 默认为直线,可选为:'line' | 'shadow'
  599. },
  600. },
  601. xAxis: {
  602. data: ["山西焦煤", "晋能控股", "华阳新材", "潞安化工", "华新燃气", "太重集团", "国际能源", "华远陆港", "水控集团", "文旅集团", "交控集团", '航产集团', '山西建投', '汾酒集团', '大地控股', '云时代', '华舰体育', '神农科技'],
  603. axisTick: {
  604. show: false,
  605. },
  606. // x轴的字体颜色
  607. axisLabel: {
  608. rotate: 40,
  609. textStyle: {
  610. color: "white",
  611. },
  612. },
  613. //y轴线的颜色以及宽度
  614. axisLine: {
  615. show: true,
  616. lineStyle: {
  617. color: "#1E5389",
  618. width: 1,
  619. type: "solid",
  620. },
  621. },
  622. },
  623. yAxis: {
  624. name: '亿元',
  625. nameTextStyle: {//y轴上方单位的颜色
  626. color: '#fff',
  627. },
  628. axisTick: {
  629. lineStyle: {
  630. color: "#18416F",
  631. },
  632. },
  633. // y轴的字体颜色
  634. axisLabel: {
  635. textStyle: {
  636. color: "white",
  637. },
  638. },
  639. splitLine: {
  640. show: true,
  641. lineStyle: {
  642. color: "#204561",
  643. width: 1,
  644. type: "dotted",
  645. },
  646. },
  647. //y轴线的颜色以及宽度
  648. axisLine: {
  649. show: true,
  650. lineStyle: {
  651. color: "#1E5389",
  652. width: 1,
  653. type: "solid",
  654. },
  655. },
  656. },
  657. series: [
  658. {
  659. name: "2022年额度",
  660. type: "bar",
  661. data: [263.23, 402.18, 73.28, 144.80, 25.56, 8.23, 0, 12.97, 8.56, -1.72, 0, 0, 0, 76.90, 5.03, 9.14, 0, 0],
  662. showBackground: false,
  663. backgroundStyle: {
  664. color: "#18416F",
  665. },
  666. barWidth: "10%",
  667. itemStyle: {
  668. barBorderRadius: [10, 10, 0, 0],
  669. color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
  670. {
  671. offset: 0,
  672. color: '#082550',
  673. },
  674. {
  675. offset: 1,
  676. color: '#69c0ff',
  677. },
  678. ]),
  679. },
  680. },
  681. {
  682. name: "2023年额度",
  683. type: "bar",
  684. data: [373.22, 462.83, 243.27, 214.79, 49.55, 13.23, 22.16, 32.97, 8.56, 9.28, 127.32, -1.39, 44.12, 76.90, 7.03, 12.14, -0.20, 0.37],
  685. showBackground: false,
  686. backgroundStyle: {
  687. color: "#18416F",
  688. },
  689. barWidth: "10%",
  690. itemStyle: {
  691. barBorderRadius: [10, 10, 0, 0],
  692. color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
  693. {
  694. offset: 0,
  695. color: '#082550',
  696. },
  697. {
  698. offset: 1,
  699. color: '#957DFF',
  700. },
  701. ]),
  702. },
  703. },
  704. ],
  705. legend: {
  706. // data: ["2022年额度", "2023年额度"],
  707. data: ["2023年额度"],
  708. textStyle: {
  709. // 图列内容样式
  710. color: "#fff", // 字体颜色
  711. // fontSize: "10",
  712. },
  713. right: 'center',
  714. icon: "roundRect",
  715. // 小图标的宽高
  716. itemHeight: 5,
  717. },
  718. };
  719. tools.loopShowTooltip(myChart, option, {
  720. nterval: 2000,
  721. loopSeries: true,
  722. })
  723. let that = this
  724. myChart.on('click', function (param) {
  725. console.log(param)
  726. if (param.name == '晋能控股') {
  727. that.showTip2 = true
  728. setTimeout(() => {
  729. // that.initChartR4()
  730. // that.initChartR5()
  731. that.initChartL2b()
  732. })
  733. }
  734. })
  735. myChart.setOption(option);
  736. },
  737. initChartL2b () {
  738. let myChart = echarts.init(this.$refs['echartL2b'])
  739. var value = 0.13;
  740. var data = [value];
  741. let option = {
  742. backgroundColor: 'transparent',
  743. title: [
  744. {
  745. // text: '总额度285.48亿',
  746. // formatter: `<span>总额度</span>285.48亿`,
  747. x: '37%',
  748. y: '80%',
  749. textStyle: {
  750. fontSize: 24,
  751. fontWeight: 'bold',
  752. color: '#2CB7E0',
  753. lineHeight: 16,
  754. textAlign: 'center',
  755. },
  756. }
  757. ],
  758. series: [
  759. {
  760. type: 'liquidFill',
  761. radius: '70%',
  762. center: ['50%', '40%'],
  763. color: [
  764. {
  765. type: 'linear',
  766. x: 0,
  767. y: 0,
  768. x2: 0,
  769. y2: 1,
  770. colorStops: [
  771. {
  772. offset: 0,
  773. color: '#446bf5',
  774. },
  775. {
  776. offset: 1,
  777. color: '#2ca3e2',
  778. },
  779. ],
  780. globalCoord: false,
  781. },
  782. ],
  783. data: [value, value], // data个数代表波浪数
  784. backgroundStyle: {
  785. borderWidth: 1,
  786. color: 'RGBA(51, 66, 127, 0.7)',
  787. },
  788. label: {
  789. normal: {
  790. textStyle: {
  791. fontSize: 30,
  792. color: '#fff',
  793. },
  794. },
  795. },
  796. outline: {
  797. // show: false
  798. borderDistance: 0,
  799. itemStyle: {
  800. borderWidth: 2,
  801. borderColor: 'transparent',
  802. },
  803. },
  804. },
  805. ],
  806. }
  807. myChart.setOption(option)
  808. },
  809. initChartL2 () {
  810. let myChart = echarts.init(this.$refs['echartL2'])
  811. var value = 0.067;
  812. var data = [value];
  813. let option = {
  814. backgroundColor: 'transparent',
  815. title: [
  816. {
  817. // text: '总额度285.48亿',
  818. // formatter: `<span>总额度</span>285.48亿`,
  819. x: '37%',
  820. y: '80%',
  821. textStyle: {
  822. fontSize: 24,
  823. fontWeight: 'bold',
  824. color: '#2CB7E0',
  825. lineHeight: 16,
  826. textAlign: 'center',
  827. },
  828. }
  829. ],
  830. series: [
  831. {
  832. type: 'liquidFill',
  833. radius: '70%',
  834. center: ['50%', '40%'],
  835. color: [
  836. {
  837. type: 'linear',
  838. x: 0,
  839. y: 0,
  840. x2: 0,
  841. y2: 1,
  842. colorStops: [
  843. {
  844. offset: 0,
  845. color: '#446bf5',
  846. },
  847. {
  848. offset: 1,
  849. color: '#2ca3e2',
  850. },
  851. ],
  852. globalCoord: false,
  853. },
  854. ],
  855. data: [value, value], // data个数代表波浪数
  856. backgroundStyle: {
  857. borderWidth: 1,
  858. color: 'RGBA(51, 66, 127, 0.7)',
  859. },
  860. label: {
  861. normal: {
  862. textStyle: {
  863. fontSize: 30,
  864. color: '#fff',
  865. },
  866. },
  867. },
  868. outline: {
  869. // show: false
  870. borderDistance: 0,
  871. itemStyle: {
  872. borderWidth: 2,
  873. borderColor: 'transparent',
  874. },
  875. },
  876. },
  877. ],
  878. }
  879. myChart.setOption(option)
  880. },
  881. initChartL3 () {
  882. let myChart = echarts.init(this.$refs['echartL3'])
  883. option = {
  884. tooltip: {
  885. trigger: 'axis',
  886. formatter: '指标:' + '{c0}' + '<br/>' + '发展线:' + '{c1}' + '<br/>' + '生存线:' + '{c2}', //+ '<br/>'+ '{a1}:{c1}' + '%',
  887. axisPointer: {
  888. type: 'shadow',
  889. },
  890. },
  891. grid: {
  892. top: '10%',
  893. right: '5%',
  894. left: '10%',
  895. bottom: '15%',
  896. },
  897. xAxis: {
  898. // data: ['总投资收益率', '销售利润率', '成本费用利润率', '总资产周转率', '财务内部收益率'],
  899. data: dataType[this.countType],
  900. axisLine: {
  901. show: true, //隐藏X轴轴线
  902. lineStyle: {
  903. color: '#005094',
  904. width: 1,
  905. },
  906. },
  907. axisTick: {
  908. show: true, //隐藏X轴刻度
  909. },
  910. axisLabel: {
  911. show: true,
  912. rotate: 15,
  913. textStyle: {
  914. color: 'rgba(255,255,255,0.6)', //X轴文字颜色
  915. fontSize: 12,
  916. },
  917. },
  918. },
  919. yAxis: [
  920. {
  921. type: 'value',
  922. splitLine: {
  923. show: true,
  924. lineStyle: {
  925. color: '#68b4dd66',
  926. type: 'dashed',
  927. },
  928. },
  929. axisLine: {
  930. show: false
  931. },
  932. axisLabel: {
  933. show: true,
  934. formatter: '{value}',
  935. textStyle: {
  936. color: 'rgba(250,250,250,0.6)',
  937. },
  938. },
  939. nameTextStyle: {
  940. color: '#ebf8ac',
  941. fontSize: 16,
  942. },
  943. },
  944. ],
  945. series: [
  946. {
  947. name: '',
  948. type: 'bar',
  949. barWidth: 15,
  950. itemStyle: {
  951. normal: {
  952. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  953. {
  954. offset: 0,
  955. color: '#69c0ff',
  956. },
  957. {
  958. offset: 1,
  959. color: '#082550',
  960. },
  961. ]),
  962. },
  963. },
  964. // data: [70, 52, 33, 41, 52],
  965. data: dataList[this.count][0]
  966. // markLine: {
  967. // symbol: ['none', 'none'],
  968. // data: [
  969. // {
  970. // name: '生存线',
  971. // yAxis: 10,
  972. // lineStyle: {
  973. // color: '#FF8F0A',
  974. // },
  975. // label: {
  976. // formatter: '{b}',
  977. // position: 'middle',
  978. // color: '#FF8F0A',
  979. // fontSize: 12,
  980. // },
  981. // },
  982. // {
  983. // name: '发展线',
  984. // yAxis: 15,
  985. // lineStyle: {
  986. // color: '#00EEA2',
  987. // },
  988. // label: {
  989. // formatter: '{b}',
  990. // position: 'middle',
  991. // color: '#00EEA2',
  992. // fontSize: 12,
  993. // },
  994. // },
  995. // ],
  996. // label: {
  997. // distance: [50, 0],
  998. // },
  999. // },
  1000. },
  1001. {
  1002. name: '',
  1003. type: 'line',
  1004. barWidth: 15,
  1005. itemStyle: {
  1006. normal: {
  1007. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  1008. {
  1009. offset: 0,
  1010. color: '#69c0ff',
  1011. },
  1012. {
  1013. offset: 1,
  1014. color: 'green',
  1015. },
  1016. ]),
  1017. },
  1018. },
  1019. // data: [20, 30, 15, 28, 36],
  1020. data: dataList[this.count][1]
  1021. },
  1022. {
  1023. name: '',
  1024. type: 'line',
  1025. barWidth: 15,
  1026. itemStyle: {
  1027. normal: {
  1028. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  1029. {
  1030. offset: 0,
  1031. color: '#69c0ff',
  1032. },
  1033. {
  1034. offset: 1,
  1035. color: 'yellow',
  1036. },
  1037. ]),
  1038. },
  1039. },
  1040. // data: [15, 22, 17, 33, 14],
  1041. data: dataList[this.count][2]
  1042. },
  1043. ],
  1044. }
  1045. myChart.setOption(option)
  1046. // tools.loopShowTooltip(myChart, option, {
  1047. // nterval: 2000,
  1048. // loopSeries: true,
  1049. // })
  1050. },
  1051. initChartL4 () {
  1052. let data = [
  1053. { value: [173.43, 129], name: '煤炭' },
  1054. { value: [23.10, 2], name: '火电' },
  1055. { value: [22.87, 8], name: '冶金' },
  1056. { value: [9.71, 5], name: '焦化' },
  1057. { value: [8.35, 6], name: '其他传统产业' }
  1058. ]
  1059. let count = 0
  1060. data.forEach(item => {
  1061. count += item.value[0]
  1062. })
  1063. let myChart = echarts.init(this.$refs['echartL4'])
  1064. let option = {
  1065. title: {
  1066. text: '产业类型分析',
  1067. x: 'center',
  1068. y: '0%',
  1069. textStyle: {
  1070. color: 'rgba(255,255,255,0.6)',
  1071. fontSize: 12,
  1072. },
  1073. },
  1074. tooltip: {
  1075. trigger: 'item',
  1076. formatter: function (params) {
  1077. return params.name + ',' + (params.value[0] / count * 100).toFixed(2) + '%' + '</br >' + params.value[1] + '个' + ',' + params.value[0] + '亿'
  1078. }
  1079. },
  1080. color: ['#6682f5', '#8ba2ff', '#69c0ff', '#43ede3', '#897DFF', '#b6a045', '#D87AFF'],
  1081. legend: {
  1082. orient: 'horizontal',
  1083. show: false,
  1084. icon: 'circle',
  1085. top: 'bottom',
  1086. orient: 'vertical',
  1087. right: '-3%',
  1088. textStyle: {
  1089. color: '#9DB9EB',
  1090. fontSize: '10px'
  1091. },
  1092. itemWidth: 10,
  1093. itemHeight: 10
  1094. },
  1095. series: [
  1096. {
  1097. name: '',
  1098. type: 'pie',
  1099. // radius: ['0%', '70%'],
  1100. radius: ['50%', '65%'],
  1101. center: ['50%', '55%'],
  1102. itemStyle: {
  1103. normal: {
  1104. borderColor: 'rgba(1,31,64,0.7)',
  1105. borderWidth: 6,
  1106. label: {
  1107. show: false
  1108. },
  1109. },
  1110. },
  1111. labelLine: {
  1112. show: false,
  1113. },
  1114. data,
  1115. },
  1116. ],
  1117. }
  1118. myChart.setOption(option)
  1119. tools.loopShowTooltip(myChart, option, {
  1120. nterval: 2000,
  1121. loopSeries: true,
  1122. })
  1123. let that = this
  1124. myChart.on('click', function (param) {
  1125. console.log(param)
  1126. that.showTip3 = true
  1127. setTimeout(() => {
  1128. that.initChartT1(data, option)
  1129. })
  1130. })
  1131. },
  1132. initChartL5 () {
  1133. let data = [
  1134. { value: [29.26, 102], name: '新一代信息技术' },
  1135. { value: [59.11, 38], name: '高端装备制造' },
  1136. { value: [3.96, 5], name: '新材料' },
  1137. { value: [2.12, 7], name: '生物' },
  1138. { value: [100.09, 79], name: '新能源' },
  1139. { value: [15.48, 32], name: '节能环保' },
  1140. { value: [3.00, 3], name: '相关服务业' },
  1141. ]
  1142. let count = 0
  1143. data.forEach(item => {
  1144. count += item.value[0]
  1145. })
  1146. let myChart = echarts.init(this.$refs['echartL5'])
  1147. let option = {
  1148. title: {
  1149. text: '战略性新兴产业',
  1150. x: 'center',
  1151. y: '0%',
  1152. textStyle: {
  1153. color: 'rgba(255,255,255,0.6)',
  1154. fontSize: 12,
  1155. },
  1156. },
  1157. tooltip: {
  1158. trigger: 'item',
  1159. formatter: function (params) {
  1160. return params.name + ',' + (params.value[0] / count * 100).toFixed(2) + '%' + '</br >' + params.value[1] + '个' + ',' + params.value[0] + '亿'
  1161. }
  1162. },
  1163. color: ['#6682f5', '#8ba2ff', '#69c0ff', '#43ede3', '#897DFF', '#b6a045', '#D87AFF'],
  1164. legend: {
  1165. show: false,
  1166. icon: 'circle',
  1167. top: 'bottom',
  1168. orient: 'vertical',
  1169. right: '-3%',
  1170. textStyle: {
  1171. color: '#9DB9EB',
  1172. fontSize: '10px'
  1173. },
  1174. itemWidth: 10,
  1175. itemHeight: 10
  1176. },
  1177. series: [
  1178. {
  1179. name: '',
  1180. type: 'pie',
  1181. // radius: ['0%', '70%'],
  1182. radius: ['50%', '65%'],
  1183. center: ['50%', '55%'],
  1184. itemStyle: {
  1185. normal: {
  1186. borderColor: 'rgba(1,31,64,0.7)',
  1187. borderWidth: 6,
  1188. label: {
  1189. show: false,
  1190. },
  1191. },
  1192. },
  1193. labelLine: {
  1194. show: false,
  1195. },
  1196. data
  1197. },
  1198. ],
  1199. }
  1200. myChart.setOption(option)
  1201. tools.loopShowTooltip(myChart, option, {
  1202. nterval: 2000,
  1203. loopSeries: true,
  1204. })
  1205. let that = this
  1206. myChart.on('click', function (param) {
  1207. console.log(param)
  1208. that.showTip3 = true
  1209. setTimeout(() => {
  1210. that.initChartT1(data, option)
  1211. })
  1212. })
  1213. },
  1214. initChartL6 () {
  1215. let data = [
  1216. { value: [25.82, 43], name: '化工' },
  1217. { value: [17.36, 21], name: '煤层气' },
  1218. { value: [0.04, 1], name: '文旅康养' },
  1219. { value: [1.51, 7], name: '体育' },
  1220. { value: [9.32, 5], name: '酿造' },
  1221. { value: [71.12, 129], name: '建筑房地产' },
  1222. { value: [9.11, 14], name: '农业' },
  1223. ]
  1224. let count = 0
  1225. data.forEach(item => {
  1226. count += item.value[0]
  1227. })
  1228. let myChart = echarts.init(this.$refs['echartL6'])
  1229. let option = {
  1230. title: {
  1231. text: '特色优势产业',
  1232. x: 'center',
  1233. y: '0%',
  1234. textStyle: {
  1235. color: 'rgba(255,255,255,0.6)',
  1236. fontSize: 12,
  1237. },
  1238. },
  1239. tooltip: {
  1240. trigger: 'item',
  1241. formatter: function (params) {
  1242. return params.name + ',' + (params.value[0] / count * 100).toFixed(2) + '%' + '</br >' + params.value[1] + '个' + ',' + params.value[0] + '亿'
  1243. }
  1244. // position: ['30%', '87%'],
  1245. },
  1246. color: ['#6682f5', '#8ba2ff', '#69c0ff', '#43ede3', '#897DFF', '#b6a045', '#D87AFF'],
  1247. legend: {
  1248. show: false,
  1249. icon: 'circle',
  1250. top: 'bottom',
  1251. orient: 'vertical',
  1252. right: '-3%',
  1253. textStyle: {
  1254. color: '#9DB9EB',
  1255. fontSize: '10px'
  1256. },
  1257. itemWidth: 10,
  1258. itemHeight: 10
  1259. },
  1260. series: [
  1261. {
  1262. name: '',
  1263. type: 'pie',
  1264. // radius: ['0%', '70%'],
  1265. radius: ['50%', '65%'],
  1266. center: ['50%', '55%'],
  1267. itemStyle: {
  1268. normal: {
  1269. borderColor: 'rgba(1,31,64,0.7)',
  1270. borderWidth: 6,
  1271. label: {
  1272. show: false,
  1273. },
  1274. },
  1275. },
  1276. labelLine: {
  1277. show: false,
  1278. },
  1279. data,
  1280. },
  1281. ],
  1282. }
  1283. myChart.setOption(option)
  1284. tools.loopShowTooltip(myChart, option, {
  1285. nterval: 2000,
  1286. loopSeries: true,
  1287. })
  1288. let that = this
  1289. myChart.on('click', function (param) {
  1290. console.log(param)
  1291. that.showTip3 = true
  1292. setTimeout(() => {
  1293. that.initChartT1(data, option)
  1294. })
  1295. })
  1296. },
  1297. initChartL7 () {
  1298. let data = [
  1299. { value: [155.82, 51], name: '交通运输业' },
  1300. { value: [8.47, 19], name: '煤气层管网' },
  1301. { value: [10.64, 24], name: '物流贸易' },
  1302. { value: [41.05, 46], name: '水务' },
  1303. { value: [2.14, 7], name: '其他' },
  1304. ]
  1305. let count = 0
  1306. data.forEach(item => {
  1307. count += item.value[0]
  1308. })
  1309. let myChart = echarts.init(this.$refs['echartL7'])
  1310. let option = {
  1311. title: {
  1312. text: '公共基础等产业',
  1313. x: 'center',
  1314. y: '0%',
  1315. textStyle: {
  1316. color: 'rgba(255,255,255,0.6)',
  1317. fontSize: 12,
  1318. },
  1319. },
  1320. tooltip: {
  1321. trigger: 'item',
  1322. formatter: function (params) {
  1323. return params.name + ',' + (params.value[0] / count * 100).toFixed(2) + '%' + '</br >' + params.value[1] + '个' + ',' + params.value[0] + '亿'
  1324. }
  1325. },
  1326. color: ['#6682f5', '#8ba2ff', '#69c0ff', '#43ede3', '#897DFF', '#b6a045', '#D87AFF'],
  1327. legend: {
  1328. show: false,
  1329. icon: 'circle',
  1330. top: 'bottom',
  1331. orient: 'vertical',
  1332. right: '-3%',
  1333. textStyle: {
  1334. color: '#9DB9EB',
  1335. fontSize: '10px'
  1336. },
  1337. itemWidth: 10,
  1338. itemHeight: 10
  1339. },
  1340. series: [
  1341. {
  1342. name: '',
  1343. type: 'pie',
  1344. // radius: ['0%', '70%'],
  1345. radius: ['50%', '65%'],
  1346. center: ['50%', '55%'],
  1347. itemStyle: {
  1348. normal: {
  1349. borderColor: 'rgba(1,31,64,0.7)',
  1350. borderWidth: 6,
  1351. label: {
  1352. show: false,
  1353. },
  1354. },
  1355. },
  1356. labelLine: {
  1357. show: false,
  1358. },
  1359. data
  1360. },
  1361. ],
  1362. }
  1363. myChart.setOption(option)
  1364. tools.loopShowTooltip(myChart, option, {
  1365. nterval: 2000,
  1366. loopSeries: true,
  1367. })
  1368. let that = this
  1369. myChart.on('click', function (param) {
  1370. console.log(param)
  1371. that.showTip3 = true
  1372. setTimeout(() => {
  1373. that.initChartT1(data, option)
  1374. })
  1375. })
  1376. },
  1377. initChartR4 () {
  1378. let myChart = echarts.init(this.$refs['echartR4'])
  1379. let option = {
  1380. title: {
  1381. text: '2022年的可投资总额',
  1382. x: 'center',
  1383. y: '87%',
  1384. textStyle: {
  1385. color: 'rgba(255,255,255,0.6)',
  1386. fontSize: 12,
  1387. },
  1388. },
  1389. tooltip: {
  1390. trigger: 'item',
  1391. },
  1392. color: ['#69C1FF', '#4B97CC',],
  1393. legend: {
  1394. icon: 'circle',
  1395. top: 'bottom',
  1396. orient: 'vertical',
  1397. right: '1%',
  1398. textStyle: {
  1399. color: '#9DB9EB',
  1400. },
  1401. },
  1402. series: [
  1403. {
  1404. name: '',
  1405. type: 'pie',
  1406. label: {
  1407. normal: {
  1408. show: true,
  1409. position: 'center',
  1410. color: '#4c4a4a',
  1411. formatter: '{total|' + '462.83' + '}' + '\n\r' + '{active|亿元}',
  1412. rich: {
  1413. total: {
  1414. fontSize: 20,
  1415. fontFamily: "微软雅黑",
  1416. color: '#fff'
  1417. },
  1418. active: {
  1419. fontFamily: "微软雅黑",
  1420. fontSize: 15,
  1421. color: '#fff'
  1422. },
  1423. }
  1424. },
  1425. emphasis: {//中间文字显示
  1426. show: true,
  1427. }
  1428. },
  1429. radius: ['40%', '60%'],
  1430. center: ['50%', '45%'],
  1431. itemStyle: {
  1432. normal: {
  1433. label: {
  1434. show: false,
  1435. },
  1436. },
  1437. },
  1438. labelLine: {
  1439. show: false,
  1440. },
  1441. data: [
  1442. { value: 1048, name: '已使用额度' },
  1443. { value: 735, name: '可使用额度' }
  1444. ],
  1445. },
  1446. ],
  1447. }
  1448. myChart.setOption(option)
  1449. tools.loopShowTooltip(myChart, option, {
  1450. nterval: 2000,
  1451. loopSeries: true,
  1452. })
  1453. },
  1454. initChartR5 () {
  1455. let myChart = echarts.init(this.$refs['echartR5'])
  1456. let option = {
  1457. title: {
  1458. text: '2023年的可投资总额',
  1459. x: 'center',
  1460. y: '87%',
  1461. textStyle: {
  1462. color: 'rgba(255,255,255,0.6)',
  1463. fontSize: 12,
  1464. },
  1465. },
  1466. tooltip: {
  1467. trigger: 'item',
  1468. },
  1469. color: ['#69C1FF', '#4B97CC',],
  1470. legend: {
  1471. icon: 'circle',
  1472. top: 'bottom',
  1473. orient: 'vertical',
  1474. right: '1%',
  1475. textStyle: {
  1476. color: '#9DB9EB',
  1477. },
  1478. },
  1479. series: [
  1480. {
  1481. name: '',
  1482. type: 'pie',
  1483. label: {
  1484. normal: {
  1485. show: true,
  1486. position: 'center',
  1487. top: '50',
  1488. color: '#4c4a4a',
  1489. formatter: '{total|' + '462.83' + '}' + '\n\r' + '{active|亿元}',
  1490. rich: {
  1491. total: {
  1492. fontSize: 20,
  1493. fontFamily: "微软雅黑",
  1494. color: '#fff'
  1495. },
  1496. active: {
  1497. fontFamily: "微软雅黑",
  1498. fontSize: 15,
  1499. color: '#fff'
  1500. },
  1501. }
  1502. },
  1503. emphasis: {//中间文字显示
  1504. show: true,
  1505. }
  1506. },
  1507. radius: ['40%', '60%'],
  1508. center: ['50%', '45%'],
  1509. itemStyle: {
  1510. normal: {
  1511. label: {
  1512. show: false,
  1513. },
  1514. },
  1515. },
  1516. labelLine: {
  1517. show: false,
  1518. },
  1519. data: [
  1520. { value: 1048, name: '已使用额度' },
  1521. { value: 735, name: '可使用额度' }
  1522. ],
  1523. },
  1524. ],
  1525. }
  1526. myChart.setOption(option)
  1527. tools.loopShowTooltip(myChart, option, {
  1528. nterval: 2000,
  1529. loopSeries: true,
  1530. })
  1531. },
  1532. initChartR1 () {
  1533. let data = [
  1534. { value: [665.81, 549], name: '主业' },
  1535. { value: [65.17, 84], name: '辅业' },
  1536. { value: [423.36, 164], name: '技改' }
  1537. ]
  1538. let count = 0
  1539. data.forEach(item => {
  1540. count += item.value[0]
  1541. })
  1542. let myChart = echarts.init(this.$refs['echartR1'])
  1543. let option = {
  1544. title: {
  1545. text: '主辅业计划占比',
  1546. x: 'center',
  1547. y: '87%',
  1548. textStyle: {
  1549. color: 'rgba(255,255,255,0.6)',
  1550. fontSize: 12,
  1551. },
  1552. },
  1553. tooltip: {
  1554. trigger: 'item',
  1555. // formatter: '{b}' + ':' + '{c}' + '<br/>' + '占比:' + '{d}%',
  1556. // position: ['-5%', '95%'],
  1557. formatter: function (params) {
  1558. return params.name + ',' + (params.value[0] / count * 100).toFixed(2) + '%' + '</br >' + params.value[1] + '个' + ',' + params.value[0] + '亿'
  1559. }
  1560. },
  1561. color: ['#6682f5', '#8ba2ff', '#69c0ff', '#43ede3', '#897DFF', '#b6a045', '#D87AFF'],
  1562. legend: {
  1563. show: false,
  1564. icon: 'circle',
  1565. top: 'bottom',
  1566. orient: 'vertical',
  1567. right: '-3%',
  1568. textStyle: {
  1569. color: '#9DB9EB',
  1570. fontSize: '10px'
  1571. },
  1572. itemWidth: 10,
  1573. itemHeight: 10
  1574. },
  1575. series: [
  1576. {
  1577. name: '',
  1578. type: 'pie',
  1579. radius: ['40%', '60%'],
  1580. center: ['50%', '45%'],
  1581. itemStyle: {
  1582. normal: {
  1583. borderColor: 'rgba(1,31,64,0.7)',
  1584. borderWidth: 6,
  1585. label: {
  1586. show: false,
  1587. },
  1588. },
  1589. },
  1590. labelLine: {
  1591. show: false,
  1592. },
  1593. data,
  1594. },
  1595. ],
  1596. }
  1597. myChart.setOption(option)
  1598. tools.loopShowTooltip(myChart, option, {
  1599. nterval: 2000,
  1600. loopSeries: true,
  1601. })
  1602. let that = this
  1603. myChart.on('click', function (param) {
  1604. console.log(param)
  1605. that.showTip3 = true
  1606. setTimeout(() => {
  1607. that.initChartT1(data, option)
  1608. })
  1609. })
  1610. },
  1611. initChartR2 () {
  1612. let data = [
  1613. { value: [340.77, 168], name: '特别监管类' },
  1614. { value: [390.22, 465], name: '备案类' }
  1615. ]
  1616. let count = 0
  1617. data.forEach(item => {
  1618. count += item.value[0]
  1619. })
  1620. let myChart = echarts.init(this.$refs['echartR2'])
  1621. let option = {
  1622. title: {
  1623. text: '项目管理类型',
  1624. x: 'center',
  1625. y: '87%',
  1626. textStyle: {
  1627. color: 'rgba(255,255,255,0.6)',
  1628. fontSize: 12,
  1629. },
  1630. },
  1631. tooltip: {
  1632. trigger: 'item',
  1633. formatter: function (params) {
  1634. return params.name + ',' + (params.value[0] / count * 100).toFixed(2) + '%' + '</br >' + params.value[1] + '个' + ',' + params.value[0] + '亿'
  1635. }
  1636. // position: ['-5%', '95%'],
  1637. },
  1638. color: ['#6682f5', '#8ba2ff', '#69c0ff', '#43ede3', '#897DFF', '#b6a045', '#D87AFF'],
  1639. legend: {
  1640. show: false,
  1641. icon: 'circle',
  1642. top: 'bottom',
  1643. orient: 'vertical',
  1644. right: '-3%',
  1645. textStyle: {
  1646. color: '#9DB9EB',
  1647. fontSize: '10px'
  1648. },
  1649. itemWidth: 10,
  1650. itemHeight: 10
  1651. },
  1652. series: [
  1653. {
  1654. name: '',
  1655. type: 'pie',
  1656. radius: ['40%', '60%'],
  1657. center: ['50%', '45%'],
  1658. itemStyle: {
  1659. normal: {
  1660. borderColor: 'rgba(1,31,64,0.7)',
  1661. borderWidth: 6,
  1662. label: {
  1663. show: false,
  1664. },
  1665. },
  1666. },
  1667. labelLine: {
  1668. show: false,
  1669. },
  1670. data,
  1671. },
  1672. ],
  1673. }
  1674. myChart.setOption(option)
  1675. tools.loopShowTooltip(myChart, option, {
  1676. nterval: 2000,
  1677. loopSeries: true,
  1678. })
  1679. let that = this
  1680. myChart.on('click', function (param) {
  1681. console.log(param)
  1682. that.showTip3 = true
  1683. setTimeout(() => {
  1684. that.initChartT1(data, option)
  1685. })
  1686. })
  1687. },
  1688. initChartR3 () {
  1689. let myChart = echarts.init(this.$refs['echartR3'])
  1690. let option = {
  1691. title: {
  1692. text: '股权类',
  1693. textStyle: {
  1694. color: '#69C0FF',
  1695. fontSize: 16,
  1696. fontWeight: 500
  1697. },
  1698. top: '10',
  1699. left: '10'
  1700. },
  1701. textStyle: {
  1702. color: '#fff',
  1703. },
  1704. tooltip: {
  1705. trigger: "axis",
  1706. formatter: function (params) {
  1707. 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[1].data[3] + '亿元';
  1708. return tip
  1709. },
  1710. axisPointer: {
  1711. lineStyle: {
  1712. type: 'dashed',
  1713. width: 2,
  1714. color: 'rgba(255,255,255,0.6)'
  1715. },
  1716. animation: true
  1717. }
  1718. },
  1719. grid: {
  1720. top: '22%',
  1721. right: '5%',
  1722. left: '15%',
  1723. bottom: '15%',
  1724. },
  1725. yAxis: {
  1726. data: ['备案', '特别监管'],
  1727. splitLine: {
  1728. show: true,
  1729. lineStyle: {
  1730. color: '#68b4dd66',
  1731. type: 'dashed',
  1732. },
  1733. },
  1734. axisLine: {
  1735. show: false
  1736. },
  1737. axisLabel: {
  1738. show: true,
  1739. formatter: '{value}',
  1740. textStyle: {
  1741. color: 'rgba(250,250,250,0.6)',
  1742. },
  1743. },
  1744. nameTextStyle: {
  1745. color: '#ebf8ac',
  1746. fontSize: 16,
  1747. },
  1748. },
  1749. xAxis: {
  1750. data: ['项目储备', '项目立项', '可研论证', '投资决策'],
  1751. axisLine: {
  1752. show: true, //隐藏X轴轴线
  1753. lineStyle: {
  1754. color: '#005094',
  1755. width: 1,
  1756. },
  1757. },
  1758. axisTick: {
  1759. show: false, //隐藏X轴刻度
  1760. },
  1761. axisLabel: {
  1762. show: true,
  1763. textStyle: {
  1764. color: 'rgba(255,255,255,0.6)', //X轴文字颜色
  1765. fontSize: 12,
  1766. },
  1767. },
  1768. },
  1769. series: [
  1770. {
  1771. name: '',
  1772. type: 'scatter',
  1773. symbol: 'circle',
  1774. symbolSize: function (data) {
  1775. return Math.sqrt(data[2]) * 3;
  1776. },
  1777. label: {
  1778. emphasis: {
  1779. show: true,
  1780. formatter: function (param) {
  1781. return param.data[2];
  1782. },
  1783. position: 'top'
  1784. }
  1785. },
  1786. itemStyle: {
  1787. normal: {
  1788. color: '#40A9FF'
  1789. }
  1790. },
  1791. data: [
  1792. ['项目储备', '特别监管', 9, 6.49],
  1793. ['项目立项', '特别监管', 0, 0.00],
  1794. ['可研论证', '特别监管', 2, 0.10],
  1795. ['投资决策', '特别监管', 27, 15.52],
  1796. ]
  1797. },
  1798. {
  1799. name: '',
  1800. type: 'scatter',
  1801. symbol: 'circle',
  1802. symbolSize: function (data) {
  1803. return Math.sqrt(data[2]) * 3;
  1804. },
  1805. label: {
  1806. emphasis: {
  1807. show: true,
  1808. formatter: function (param) {
  1809. return param.data[2];
  1810. },
  1811. position: 'top'
  1812. }
  1813. },
  1814. itemStyle: {
  1815. normal: {
  1816. color: '#45DAD1'
  1817. }
  1818. },
  1819. data: [
  1820. ['项目储备', '备案', 39, 8.08],
  1821. ['项目立项', '备案', 7, 1.83],
  1822. ['可研论证', '备案', 19, 1.01],
  1823. ['投资决策', '备案', 73, 17.65],
  1824. ]
  1825. },
  1826. ]
  1827. }
  1828. myChart.setOption(option)
  1829. tools.loopShowTooltip(myChart, option, {
  1830. nterval: 2000,
  1831. loopSeries: true,
  1832. })
  1833. },
  1834. initChartR6 () {
  1835. let myChart = echarts.init(this.$refs['echartR6'])
  1836. let option = {
  1837. title: {
  1838. text: '固定资产',
  1839. textStyle: {
  1840. color: '#69C0FF',
  1841. fontSize: 16,
  1842. fontWeight: 500
  1843. },
  1844. top: '10',
  1845. left: '10'
  1846. },
  1847. textStyle: {
  1848. color: '#fff',
  1849. },
  1850. tooltip: {
  1851. trigger: "axis",
  1852. formatter: function (params) {
  1853. 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[1].data[3] + '亿元';
  1854. return tip
  1855. },
  1856. axisPointer: {
  1857. lineStyle: {
  1858. type: 'dashed',
  1859. width: 2,
  1860. color: 'rgba(255,255,255,0.6)'
  1861. },
  1862. animation: true
  1863. }
  1864. },
  1865. grid: {
  1866. top: '25%',
  1867. right: '5%',
  1868. left: '15%',
  1869. bottom: '15%',
  1870. },
  1871. yAxis: {
  1872. data: ['备案', '特别监管'],
  1873. splitLine: {
  1874. show: true,
  1875. lineStyle: {
  1876. color: '#68b4dd66',
  1877. type: 'dashed',
  1878. },
  1879. },
  1880. axisLine: {
  1881. show: false
  1882. },
  1883. axisLabel: {
  1884. show: true,
  1885. formatter: '{value}',
  1886. textStyle: {
  1887. color: 'rgba(250,250,250,0.6)',
  1888. },
  1889. },
  1890. nameTextStyle: {
  1891. color: '#ebf8ac',
  1892. fontSize: 16,
  1893. },
  1894. },
  1895. xAxis: {
  1896. data: ['项目储备', '项目立项', '可研论证', '投资决策'],
  1897. axisLine: {
  1898. show: true, //隐藏X轴轴线
  1899. lineStyle: {
  1900. color: '#005094',
  1901. width: 1,
  1902. },
  1903. },
  1904. axisTick: {
  1905. show: false, //隐藏X轴刻度
  1906. },
  1907. axisLabel: {
  1908. show: true,
  1909. textStyle: {
  1910. color: 'rgba(255,255,255,0.6)', //X轴文字颜色
  1911. fontSize: 12,
  1912. },
  1913. },
  1914. },
  1915. series: [
  1916. {
  1917. name: '特别监管',
  1918. type: 'scatter',
  1919. symbol: 'circle',//'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow'
  1920. symbolSize: function (data) {
  1921. return Math.sqrt(data[2]) * 3;
  1922. },
  1923. label: {
  1924. emphasis: {
  1925. show: true,
  1926. formatter: function (param) {
  1927. return param.data[2];
  1928. },
  1929. position: 'top'
  1930. }
  1931. },
  1932. itemStyle: {
  1933. normal: {
  1934. color: '#40A9FF'
  1935. }
  1936. },
  1937. data: [
  1938. ['项目储备', '特别监管', 14, 12.05],
  1939. ['项目立项', '特别监管', 2, 1.25],
  1940. ['可研论证', '特别监管', 10, 32.69],
  1941. ['投资决策', '特别监管', 15, 28.53],
  1942. ]
  1943. },
  1944. {
  1945. name: '备案',
  1946. type: 'scatter',
  1947. symbol: 'circle',//'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow'
  1948. symbolSize: function (data) {
  1949. return Math.sqrt(data[2]) * 3;
  1950. },
  1951. label: {
  1952. emphasis: {
  1953. show: true,
  1954. formatter: function (param) {
  1955. return param.data[2];
  1956. },
  1957. position: 'top'
  1958. }
  1959. },
  1960. itemStyle: {
  1961. normal: {
  1962. color: '#45DAD1'
  1963. }
  1964. },
  1965. data: [
  1966. ['项目储备', '备案', 27, 23.86],
  1967. ['项目立项', '备案', 1, 1.05],
  1968. ['可研论证', '备案', 14, 18.46],
  1969. ['投资决策', '备案', 40, 38.86],
  1970. ]
  1971. },
  1972. ]
  1973. }
  1974. myChart.setOption(option)
  1975. tools.loopShowTooltip(myChart, option, {
  1976. nterval: 2000,
  1977. loopSeries: true,
  1978. })
  1979. },
  1980. initChartT1 (list, info) {
  1981. let count = 0
  1982. console.log(list, info)
  1983. this.echartTitle = info.title.text
  1984. let data = list
  1985. data.forEach(item => {
  1986. count += item.value[0]
  1987. })
  1988. let option = JSON.parse(JSON.stringify(info))
  1989. option.series[0].center = ['50%', '50%']
  1990. option.series[0].radius = ['60%', '75%']
  1991. option.legend = {
  1992. show: false,
  1993. icon: 'circle',
  1994. top: 'bottom',
  1995. orient: 'vertical',
  1996. right: '2%',
  1997. textStyle: {
  1998. color: '#9DB9EB',
  1999. fontSize: 16
  2000. },
  2001. itemWidth: 10,
  2002. itemHeight: 10
  2003. },
  2004. option.title.text = ''
  2005. option.tooltip = {
  2006. trigger: 'item',
  2007. formatter: function (params) {
  2008. return params.name + ',' + (params.value[0] / count * 100).toFixed(2) + '%' + '</br >' + params.value[1] + '个' + ',' + params.value[0] + '亿'
  2009. }
  2010. }
  2011. option.series[0].itemStyle.normal.label = {
  2012. show: true,
  2013. formatter: function (params) {
  2014. return params.name + ',' + (params.value[0] / count * 100).toFixed(2) + '%' + '\n' + params.value[1] + '个' + ',' + params.value[0] + '亿'
  2015. }
  2016. }
  2017. option.series[0].labelLine.show = true
  2018. let myChart = echarts.init(this.$refs['echartT1'])
  2019. myChart.setOption(option)
  2020. // tools.loopShowTooltip(myChart, option, {
  2021. // nterval: 2000,
  2022. // loopSeries: true,
  2023. // })
  2024. }
  2025. },
  2026. })