investHome2.js 61 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448144914501451145214531454145514561457145814591460146114621463146414651466146714681469147014711472147314741475147614771478147914801481148214831484148514861487148814891490149114921493149414951496149714981499150015011502150315041505150615071508150915101511151215131514151515161517151815191520152115221523152415251526152715281529153015311532153315341535153615371538153915401541154215431544154515461547154815491550155115521553155415551556155715581559156015611562156315641565156615671568156915701571157215731574157515761577157815791580158115821583158415851586158715881589159015911592159315941595159615971598159916001601160216031604160516061607160816091610161116121613161416151616161716181619162016211622162316241625162616271628162916301631163216331634163516361637163816391640164116421643164416451646164716481649165016511652165316541655165616571658165916601661166216631664166516661667166816691670167116721673167416751676167716781679168016811682168316841685168616871688168916901691169216931694169516961697169816991700170117021703170417051706170717081709171017111712171317141715171617171718171917201721172217231724172517261727172817291730173117321733173417351736173717381739174017411742174317441745174617471748174917501751175217531754175517561757175817591760176117621763176417651766176717681769177017711772177317741775177617771778177917801781178217831784178517861787178817891790179117921793179417951796179717981799180018011802180318041805180618071808180918101811181218131814181518161817181818191820182118221823182418251826182718281829183018311832183318341835183618371838183918401841184218431844184518461847184818491850185118521853185418551856185718581859186018611862186318641865186618671868186918701871187218731874187518761877187818791880188118821883188418851886188718881889189018911892189318941895189618971898189919001901190219031904190519061907190819091910191119121913191419151916191719181919192019211922192319241925192619271928192919301931193219331934193519361937193819391940194119421943194419451946194719481949195019511952195319541955195619571958195919601961196219631964196519661967196819691970197119721973197419751976197719781979198019811982198319841985
  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%储能', "6.78亿元 "],
  32. ['国际能源', '平朔矿区150MW农光储氢一体化项目', "7.84亿元"],
  33. ['汾酒集团', '汾酒2030技改原酒产储能扩建项目(一期)', "91.01亿元 "],
  34. ['大地控股', '山西大地控股忻州新店矿业有限公司投资建设年产800万吨精品砂石骨料项目', "8.66亿元 "],
  35. ['潞安化工', '分布式光伏发电项目', "2.01亿元 "],
  36. ['太重集团', '设立太重(大同)新能源产业投资公司', "0.3亿元 "],
  37. ['大地控股', '山西大地宏翔环保科技有限公司电厂固废资源化综合利用建设项目', "3.60亿元 "],
  38. ['大地控股', '山西大地海科环保科技有限公司电厂固废资源化综合利用建设项目', "3.11亿元 "],
  39. ['汾酒集团', '保健酒园区新增原酒产能项目', "4.98亿元 "],
  40. ['汾酒集团', '白玉酒厂改扩建项目', "4.96亿元 "],
  41. ['华阳新材', '5GW高效光伏组件制造项目', "4.82亿元 "],
  42. ['华新燃气', '吉县—延长输气管道项目(一期工程)', "3.54亿元 "],
  43. ['太重集团', '建设液压挖掘机配套油缸项目', "2.6亿元 "],
  44. ['华远陆港', '物产集团参股设立项目公司投资建设山西物产万科(太原)综合物流产业园项目', "6.60亿元 "]
  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. that.initChartL2b()
  710. })
  711. }
  712. })
  713. myChart.setOption(option);
  714. },
  715. initChartL2b () {
  716. let myChart = echarts.init(this.$refs['echartL2b'])
  717. var value = 0.37;
  718. var data = [value];
  719. let option = {
  720. backgroundColor: 'transparent',
  721. title: [
  722. {
  723. // text: '总额度285.48亿',
  724. // formatter: `<span>总额度</span>285.48亿`,
  725. x: '37%',
  726. y: '80%',
  727. textStyle: {
  728. fontSize: 24,
  729. fontWeight: 'bold',
  730. color: '#2CB7E0',
  731. lineHeight: 16,
  732. textAlign: 'center',
  733. },
  734. }
  735. ],
  736. series: [
  737. {
  738. type: 'liquidFill',
  739. radius: '70%',
  740. center: ['50%', '40%'],
  741. color: [
  742. {
  743. type: 'linear',
  744. x: 0,
  745. y: 0,
  746. x2: 0,
  747. y2: 1,
  748. colorStops: [
  749. {
  750. offset: 0,
  751. color: '#446bf5',
  752. },
  753. {
  754. offset: 1,
  755. color: '#2ca3e2',
  756. },
  757. ],
  758. globalCoord: false,
  759. },
  760. ],
  761. data: [value, value], // data个数代表波浪数
  762. backgroundStyle: {
  763. borderWidth: 1,
  764. color: 'RGBA(51, 66, 127, 0.7)',
  765. },
  766. label: {
  767. normal: {
  768. textStyle: {
  769. fontSize: 30,
  770. color: '#fff',
  771. },
  772. },
  773. },
  774. outline: {
  775. // show: false
  776. borderDistance: 0,
  777. itemStyle: {
  778. borderWidth: 2,
  779. borderColor: 'transparent',
  780. },
  781. },
  782. },
  783. ],
  784. }
  785. myChart.setOption(option)
  786. },
  787. initChartL2 () {
  788. let myChart = echarts.init(this.$refs['echartL2'])
  789. var value = 0.37;
  790. var data = [value];
  791. let option = {
  792. backgroundColor: 'transparent',
  793. title: [
  794. {
  795. // text: '总额度285.48亿',
  796. // formatter: `<span>总额度</span>285.48亿`,
  797. x: '37%',
  798. y: '80%',
  799. textStyle: {
  800. fontSize: 24,
  801. fontWeight: 'bold',
  802. color: '#2CB7E0',
  803. lineHeight: 16,
  804. textAlign: 'center',
  805. },
  806. }
  807. ],
  808. series: [
  809. {
  810. type: 'liquidFill',
  811. radius: '70%',
  812. center: ['50%', '40%'],
  813. color: [
  814. {
  815. type: 'linear',
  816. x: 0,
  817. y: 0,
  818. x2: 0,
  819. y2: 1,
  820. colorStops: [
  821. {
  822. offset: 0,
  823. color: '#446bf5',
  824. },
  825. {
  826. offset: 1,
  827. color: '#2ca3e2',
  828. },
  829. ],
  830. globalCoord: false,
  831. },
  832. ],
  833. data: [value, value], // data个数代表波浪数
  834. backgroundStyle: {
  835. borderWidth: 1,
  836. color: 'RGBA(51, 66, 127, 0.7)',
  837. },
  838. label: {
  839. normal: {
  840. textStyle: {
  841. fontSize: 30,
  842. color: '#fff',
  843. },
  844. },
  845. },
  846. outline: {
  847. // show: false
  848. borderDistance: 0,
  849. itemStyle: {
  850. borderWidth: 2,
  851. borderColor: 'transparent',
  852. },
  853. },
  854. },
  855. ],
  856. }
  857. myChart.setOption(option)
  858. },
  859. initChartL3 () {
  860. let myChart = echarts.init(this.$refs['echartL3'])
  861. option = {
  862. tooltip: {
  863. trigger: 'axis',
  864. formatter: '指标:' + '{c0}' + '<br/>' + '发展线:' + '{c1}' + '<br/>' + '生存线:' + '{c2}', //+ '<br/>'+ '{a1}:{c1}' + '%',
  865. axisPointer: {
  866. type: 'shadow',
  867. },
  868. },
  869. grid: {
  870. top: '10%',
  871. right: '5%',
  872. left: '10%',
  873. bottom: '15%',
  874. },
  875. xAxis: {
  876. data: ['总投资收益率', '销售利润率', '成本费用利润率', '总资产周转率', '财务内部收益率'],
  877. axisLine: {
  878. show: true, //隐藏X轴轴线
  879. lineStyle: {
  880. color: '#005094',
  881. width: 1,
  882. },
  883. },
  884. axisTick: {
  885. show: true, //隐藏X轴刻度
  886. },
  887. axisLabel: {
  888. show: true,
  889. rotate: 15,
  890. textStyle: {
  891. color: 'rgba(255,255,255,0.6)', //X轴文字颜色
  892. fontSize: 12,
  893. },
  894. },
  895. },
  896. yAxis: [
  897. {
  898. type: 'value',
  899. splitLine: {
  900. show: true,
  901. lineStyle: {
  902. color: '#68b4dd66',
  903. type: 'dashed',
  904. },
  905. },
  906. axisLine: {
  907. show: false
  908. },
  909. axisLabel: {
  910. show: true,
  911. formatter: '{value}',
  912. textStyle: {
  913. color: 'rgba(250,250,250,0.6)',
  914. },
  915. },
  916. nameTextStyle: {
  917. color: '#ebf8ac',
  918. fontSize: 16,
  919. },
  920. },
  921. ],
  922. series: [
  923. {
  924. name: '',
  925. type: 'bar',
  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: '#082550',
  937. },
  938. ]),
  939. },
  940. },
  941. data: [70, 52, 33, 41, 52],
  942. // markLine: {
  943. // symbol: ['none', 'none'],
  944. // data: [
  945. // {
  946. // name: '生存线',
  947. // yAxis: 10,
  948. // lineStyle: {
  949. // color: '#FF8F0A',
  950. // },
  951. // label: {
  952. // formatter: '{b}',
  953. // position: 'middle',
  954. // color: '#FF8F0A',
  955. // fontSize: 12,
  956. // },
  957. // },
  958. // {
  959. // name: '发展线',
  960. // yAxis: 15,
  961. // lineStyle: {
  962. // color: '#00EEA2',
  963. // },
  964. // label: {
  965. // formatter: '{b}',
  966. // position: 'middle',
  967. // color: '#00EEA2',
  968. // fontSize: 12,
  969. // },
  970. // },
  971. // ],
  972. // label: {
  973. // distance: [50, 0],
  974. // },
  975. // },
  976. },
  977. {
  978. name: '',
  979. type: 'line',
  980. barWidth: 15,
  981. itemStyle: {
  982. normal: {
  983. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  984. {
  985. offset: 0,
  986. color: '#69c0ff',
  987. },
  988. {
  989. offset: 1,
  990. color: 'green',
  991. },
  992. ]),
  993. },
  994. },
  995. data: [20, 30, 15, 28, 36],
  996. },
  997. {
  998. name: '',
  999. type: 'line',
  1000. barWidth: 15,
  1001. itemStyle: {
  1002. normal: {
  1003. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  1004. {
  1005. offset: 0,
  1006. color: '#69c0ff',
  1007. },
  1008. {
  1009. offset: 1,
  1010. color: 'yellow',
  1011. },
  1012. ]),
  1013. },
  1014. },
  1015. data: [15, 22, 17, 33, 14],
  1016. },
  1017. ],
  1018. }
  1019. myChart.setOption(option)
  1020. // tools.loopShowTooltip(myChart, option, {
  1021. // nterval: 2000,
  1022. // loopSeries: true,
  1023. // })
  1024. },
  1025. initChartL4 () {
  1026. let data = [
  1027. { value: [173.43, 129], name: '煤炭' },
  1028. { value: [23.10, 2], name: '火电' },
  1029. { value: [22.87, 8], name: '冶金' },
  1030. { value: [9.71, 5], name: '焦化' },
  1031. { value: [8.35, 6], name: '其他传统产业' }
  1032. ]
  1033. let count = 0
  1034. data.forEach(item => {
  1035. count += item.value[0]
  1036. })
  1037. let myChart = echarts.init(this.$refs['echartL4'])
  1038. let option = {
  1039. title: {
  1040. text: '产业类型分析',
  1041. x: 'center',
  1042. y: '0%',
  1043. textStyle: {
  1044. color: 'rgba(255,255,255,0.6)',
  1045. fontSize: 12,
  1046. },
  1047. },
  1048. tooltip: {
  1049. trigger: 'item',
  1050. formatter: function (params) {
  1051. return params.name + ',' + (params.value[0] / count * 100).toFixed(2) + '%' + '</br >' + params.value[1] + '个' + ',' + params.value[0] + '亿'
  1052. }
  1053. },
  1054. color: ['#6682f5', '#8ba2ff', '#69c0ff', '#43ede3', '#897DFF', '#FED95B', '#D87AFF'],
  1055. legend: {
  1056. orient: 'horizontal',
  1057. show: false,
  1058. icon: 'circle',
  1059. top: 'bottom',
  1060. orient: 'vertical',
  1061. right: '-3%',
  1062. textStyle: {
  1063. color: '#9DB9EB',
  1064. fontSize: '10px'
  1065. },
  1066. itemWidth: 10,
  1067. itemHeight: 10
  1068. },
  1069. series: [
  1070. {
  1071. name: '',
  1072. type: 'pie',
  1073. // radius: ['0%', '70%'],
  1074. radius: ['50%', '65%'],
  1075. center: ['50%', '55%'],
  1076. itemStyle: {
  1077. normal: {
  1078. borderColor: 'rgba(1,31,64,0.7)',
  1079. borderWidth: 6,
  1080. label: {
  1081. show: false,
  1082. },
  1083. },
  1084. },
  1085. labelLine: {
  1086. show: false,
  1087. },
  1088. data,
  1089. },
  1090. ],
  1091. }
  1092. myChart.setOption(option)
  1093. tools.loopShowTooltip(myChart, option, {
  1094. nterval: 2000,
  1095. loopSeries: true,
  1096. })
  1097. let that = this
  1098. myChart.on('click', function (param) {
  1099. console.log(param)
  1100. that.showTip3 = true
  1101. setTimeout(() => {
  1102. that.initChartT1(data, option)
  1103. })
  1104. })
  1105. },
  1106. initChartL5 () {
  1107. let data = [
  1108. { value: [29.26, 102], name: '新一代信息技术' },
  1109. { value: [59.11, 38], name: '高端装备制造' },
  1110. { value: [3.96, 5], name: '新材料' },
  1111. { value: [2.12, 7], name: '生物' },
  1112. { value: [100.09, 79], name: '新能源' },
  1113. { value: [15.48, 32], name: '节能环保' },
  1114. { value: [3.00, 3], name: '相关服务业' },
  1115. ]
  1116. let count = 0
  1117. data.forEach(item => {
  1118. count += item.value[0]
  1119. })
  1120. let myChart = echarts.init(this.$refs['echartL5'])
  1121. let option = {
  1122. title: {
  1123. text: '战略性新兴产业',
  1124. x: 'center',
  1125. y: '0%',
  1126. textStyle: {
  1127. color: 'rgba(255,255,255,0.6)',
  1128. fontSize: 12,
  1129. },
  1130. },
  1131. tooltip: {
  1132. trigger: 'item',
  1133. formatter: function (params) {
  1134. return params.name + ',' + (params.value[0] / count * 100).toFixed(2) + '%' + '</br >' + params.value[1] + '个' + ',' + params.value[0] + '亿'
  1135. }
  1136. },
  1137. color: ['#6682f5', '#8ba2ff', '#69c0ff', '#43ede3', '#897DFF', '#FED95B', '#D87AFF'],
  1138. legend: {
  1139. show: false,
  1140. icon: 'circle',
  1141. top: 'bottom',
  1142. orient: 'vertical',
  1143. right: '-3%',
  1144. textStyle: {
  1145. color: '#9DB9EB',
  1146. fontSize: '10px'
  1147. },
  1148. itemWidth: 10,
  1149. itemHeight: 10
  1150. },
  1151. series: [
  1152. {
  1153. name: '',
  1154. type: 'pie',
  1155. // radius: ['0%', '70%'],
  1156. radius: ['50%', '65%'],
  1157. center: ['50%', '55%'],
  1158. itemStyle: {
  1159. normal: {
  1160. borderColor: 'rgba(1,31,64,0.7)',
  1161. borderWidth: 6,
  1162. label: {
  1163. show: false,
  1164. },
  1165. },
  1166. },
  1167. labelLine: {
  1168. show: false,
  1169. },
  1170. data
  1171. },
  1172. ],
  1173. }
  1174. myChart.setOption(option)
  1175. tools.loopShowTooltip(myChart, option, {
  1176. nterval: 2000,
  1177. loopSeries: true,
  1178. })
  1179. let that = this
  1180. myChart.on('click', function (param) {
  1181. console.log(param)
  1182. that.showTip3 = true
  1183. setTimeout(() => {
  1184. that.initChartT1(data, option)
  1185. })
  1186. })
  1187. },
  1188. initChartL6 () {
  1189. let data = [
  1190. { value: [25.82, 43], name: '化工' },
  1191. { value: [17.36, 21], name: '煤层气' },
  1192. { value: [0.04, 1], name: '文旅康养' },
  1193. { value: [1.51, 7], name: '体育' },
  1194. { value: [9.32, 5], name: '酿造' },
  1195. { value: [71.12, 129], name: '建筑房地产' },
  1196. { value: [9.11, 14], name: '农业' },
  1197. ]
  1198. let count = 0
  1199. data.forEach(item => {
  1200. count += item.value[0]
  1201. })
  1202. let myChart = echarts.init(this.$refs['echartL6'])
  1203. let option = {
  1204. title: {
  1205. text: '特色优势产业',
  1206. x: 'center',
  1207. y: '0%',
  1208. textStyle: {
  1209. color: 'rgba(255,255,255,0.6)',
  1210. fontSize: 12,
  1211. },
  1212. },
  1213. tooltip: {
  1214. trigger: 'item',
  1215. formatter: function (params) {
  1216. return params.name + ',' + (params.value[0] / count * 100).toFixed(2) + '%' + '</br >' + params.value[1] + '个' + ',' + params.value[0] + '亿'
  1217. }
  1218. // position: ['30%', '87%'],
  1219. },
  1220. color: ['#6682f5', '#8ba2ff', '#69c0ff', '#43ede3', '#897DFF', '#FED95B', '#D87AFF'],
  1221. legend: {
  1222. show: false,
  1223. icon: 'circle',
  1224. top: 'bottom',
  1225. orient: 'vertical',
  1226. right: '-3%',
  1227. textStyle: {
  1228. color: '#9DB9EB',
  1229. fontSize: '10px'
  1230. },
  1231. itemWidth: 10,
  1232. itemHeight: 10
  1233. },
  1234. series: [
  1235. {
  1236. name: '',
  1237. type: 'pie',
  1238. // radius: ['0%', '70%'],
  1239. radius: ['50%', '65%'],
  1240. center: ['50%', '55%'],
  1241. itemStyle: {
  1242. normal: {
  1243. borderColor: 'rgba(1,31,64,0.7)',
  1244. borderWidth: 6,
  1245. label: {
  1246. show: false,
  1247. },
  1248. },
  1249. },
  1250. labelLine: {
  1251. show: false,
  1252. },
  1253. data,
  1254. },
  1255. ],
  1256. }
  1257. myChart.setOption(option)
  1258. tools.loopShowTooltip(myChart, option, {
  1259. nterval: 2000,
  1260. loopSeries: true,
  1261. })
  1262. let that = this
  1263. myChart.on('click', function (param) {
  1264. console.log(param)
  1265. that.showTip3 = true
  1266. setTimeout(() => {
  1267. that.initChartT1(data, option)
  1268. })
  1269. })
  1270. },
  1271. initChartL7 () {
  1272. let data = [
  1273. { value: [155.82, 51], name: '交通运输业' },
  1274. { value: [8.47, 19], name: '煤气层管网' },
  1275. { value: [10.64, 24], name: '物流贸易' },
  1276. { value: [41.05, 46], name: '水务' },
  1277. { value: [2.14, 7], name: '其他' },
  1278. ]
  1279. let count = 0
  1280. data.forEach(item => {
  1281. count += item.value[0]
  1282. })
  1283. let myChart = echarts.init(this.$refs['echartL7'])
  1284. let option = {
  1285. title: {
  1286. text: '公共基础等产业',
  1287. x: 'center',
  1288. y: '0%',
  1289. textStyle: {
  1290. color: 'rgba(255,255,255,0.6)',
  1291. fontSize: 12,
  1292. },
  1293. },
  1294. tooltip: {
  1295. trigger: 'item',
  1296. formatter: function (params) {
  1297. return params.name + ',' + (params.value[0] / count * 100).toFixed(2) + '%' + '</br >' + params.value[1] + '个' + ',' + params.value[0] + '亿'
  1298. }
  1299. },
  1300. color: ['#6682f5', '#8ba2ff', '#69c0ff', '#43ede3', '#897DFF', '#FED95B', '#D87AFF'],
  1301. legend: {
  1302. show: false,
  1303. icon: 'circle',
  1304. top: 'bottom',
  1305. orient: 'vertical',
  1306. right: '-3%',
  1307. textStyle: {
  1308. color: '#9DB9EB',
  1309. fontSize: '10px'
  1310. },
  1311. itemWidth: 10,
  1312. itemHeight: 10
  1313. },
  1314. series: [
  1315. {
  1316. name: '',
  1317. type: 'pie',
  1318. // radius: ['0%', '70%'],
  1319. radius: ['50%', '65%'],
  1320. center: ['50%', '55%'],
  1321. itemStyle: {
  1322. normal: {
  1323. borderColor: 'rgba(1,31,64,0.7)',
  1324. borderWidth: 6,
  1325. label: {
  1326. show: false,
  1327. },
  1328. },
  1329. },
  1330. labelLine: {
  1331. show: false,
  1332. },
  1333. data
  1334. },
  1335. ],
  1336. }
  1337. myChart.setOption(option)
  1338. tools.loopShowTooltip(myChart, option, {
  1339. nterval: 2000,
  1340. loopSeries: true,
  1341. })
  1342. let that = this
  1343. myChart.on('click', function (param) {
  1344. console.log(param)
  1345. that.showTip3 = true
  1346. setTimeout(() => {
  1347. that.initChartT1(data, option)
  1348. })
  1349. })
  1350. },
  1351. initChartR4 () {
  1352. let myChart = echarts.init(this.$refs['echartR4'])
  1353. let option = {
  1354. title: {
  1355. text: '2022年的可投资总额',
  1356. x: 'center',
  1357. y: '87%',
  1358. textStyle: {
  1359. color: 'rgba(255,255,255,0.6)',
  1360. fontSize: 12,
  1361. },
  1362. },
  1363. tooltip: {
  1364. trigger: 'item',
  1365. },
  1366. color: ['#69C1FF', '#4B97CC',],
  1367. legend: {
  1368. icon: 'circle',
  1369. top: 'bottom',
  1370. orient: 'vertical',
  1371. right: '1%',
  1372. textStyle: {
  1373. color: '#9DB9EB',
  1374. },
  1375. },
  1376. series: [
  1377. {
  1378. name: '',
  1379. type: 'pie',
  1380. label: {
  1381. normal: {
  1382. show: true,
  1383. position: 'center',
  1384. color: '#4c4a4a',
  1385. formatter: '{total|' + '462.83' + '}' + '\n\r' + '{active|亿元}',
  1386. rich: {
  1387. total: {
  1388. fontSize: 20,
  1389. fontFamily: "微软雅黑",
  1390. color: '#fff'
  1391. },
  1392. active: {
  1393. fontFamily: "微软雅黑",
  1394. fontSize: 15,
  1395. color: '#fff'
  1396. },
  1397. }
  1398. },
  1399. emphasis: {//中间文字显示
  1400. show: true,
  1401. }
  1402. },
  1403. radius: ['40%', '60%'],
  1404. center: ['50%', '45%'],
  1405. itemStyle: {
  1406. normal: {
  1407. label: {
  1408. show: false,
  1409. },
  1410. },
  1411. },
  1412. labelLine: {
  1413. show: false,
  1414. },
  1415. data: [
  1416. { value: 1048, name: '已使用额度' },
  1417. { value: 735, name: '可使用额度' }
  1418. ],
  1419. },
  1420. ],
  1421. }
  1422. myChart.setOption(option)
  1423. tools.loopShowTooltip(myChart, option, {
  1424. nterval: 2000,
  1425. loopSeries: true,
  1426. })
  1427. },
  1428. initChartR5 () {
  1429. let myChart = echarts.init(this.$refs['echartR5'])
  1430. let option = {
  1431. title: {
  1432. text: '2023年的可投资总额',
  1433. x: 'center',
  1434. y: '87%',
  1435. textStyle: {
  1436. color: 'rgba(255,255,255,0.6)',
  1437. fontSize: 12,
  1438. },
  1439. },
  1440. tooltip: {
  1441. trigger: 'item',
  1442. },
  1443. color: ['#69C1FF', '#4B97CC',],
  1444. legend: {
  1445. icon: 'circle',
  1446. top: 'bottom',
  1447. orient: 'vertical',
  1448. right: '1%',
  1449. textStyle: {
  1450. color: '#9DB9EB',
  1451. },
  1452. },
  1453. series: [
  1454. {
  1455. name: '',
  1456. type: 'pie',
  1457. label: {
  1458. normal: {
  1459. show: true,
  1460. position: 'center',
  1461. top: '50',
  1462. color: '#4c4a4a',
  1463. formatter: '{total|' + '462.83' + '}' + '\n\r' + '{active|亿元}',
  1464. rich: {
  1465. total: {
  1466. fontSize: 20,
  1467. fontFamily: "微软雅黑",
  1468. color: '#fff'
  1469. },
  1470. active: {
  1471. fontFamily: "微软雅黑",
  1472. fontSize: 15,
  1473. color: '#fff'
  1474. },
  1475. }
  1476. },
  1477. emphasis: {//中间文字显示
  1478. show: true,
  1479. }
  1480. },
  1481. radius: ['40%', '60%'],
  1482. center: ['50%', '45%'],
  1483. itemStyle: {
  1484. normal: {
  1485. label: {
  1486. show: false,
  1487. },
  1488. },
  1489. },
  1490. labelLine: {
  1491. show: false,
  1492. },
  1493. data: [
  1494. { value: 1048, name: '已使用额度' },
  1495. { value: 735, name: '可使用额度' }
  1496. ],
  1497. },
  1498. ],
  1499. }
  1500. myChart.setOption(option)
  1501. tools.loopShowTooltip(myChart, option, {
  1502. nterval: 2000,
  1503. loopSeries: true,
  1504. })
  1505. },
  1506. initChartR1 () {
  1507. let data = [
  1508. { value: [665.81, 549], name: '主业' },
  1509. { value: [65.17, 84], name: '辅业' },
  1510. { value: [423.36, 164], name: '技改' }
  1511. ]
  1512. let count = 0
  1513. data.forEach(item => {
  1514. count += item.value[0]
  1515. })
  1516. let myChart = echarts.init(this.$refs['echartR1'])
  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: '{b}' + ':' + '{c}' + '<br/>' + '占比:' + '{d}%',
  1530. // position: ['-5%', '95%'],
  1531. formatter: function (params) {
  1532. return params.name + ',' + (params.value[0] / count * 100).toFixed(2) + '%' + '</br >' + params.value[1] + '个' + ',' + params.value[0] + '亿'
  1533. }
  1534. },
  1535. color: ['#6682f5', '#8ba2ff', '#69c0ff', '#43ede3', '#897DFF', '#FED95B', '#D87AFF'],
  1536. legend: {
  1537. show: false,
  1538. icon: 'circle',
  1539. top: 'bottom',
  1540. orient: 'vertical',
  1541. right: '-3%',
  1542. textStyle: {
  1543. color: '#9DB9EB',
  1544. fontSize: '10px'
  1545. },
  1546. itemWidth: 10,
  1547. itemHeight: 10
  1548. },
  1549. series: [
  1550. {
  1551. name: '',
  1552. type: 'pie',
  1553. radius: ['40%', '60%'],
  1554. center: ['50%', '45%'],
  1555. itemStyle: {
  1556. normal: {
  1557. borderColor: 'rgba(1,31,64,0.7)',
  1558. borderWidth: 6,
  1559. label: {
  1560. show: false,
  1561. },
  1562. },
  1563. },
  1564. labelLine: {
  1565. show: false,
  1566. },
  1567. data,
  1568. },
  1569. ],
  1570. }
  1571. myChart.setOption(option)
  1572. tools.loopShowTooltip(myChart, option, {
  1573. nterval: 2000,
  1574. loopSeries: true,
  1575. })
  1576. },
  1577. initChartR2 () {
  1578. let data = [
  1579. { value: [340.77, 168], name: '特别监管类' },
  1580. { value: [390.22, 465], name: '备案类' }
  1581. ]
  1582. let count = 0
  1583. data.forEach(item => {
  1584. count += item.value[0]
  1585. })
  1586. let myChart = echarts.init(this.$refs['echartR2'])
  1587. let option = {
  1588. title: {
  1589. text: '项目管理类型',
  1590. x: 'center',
  1591. y: '87%',
  1592. textStyle: {
  1593. color: 'rgba(255,255,255,0.6)',
  1594. fontSize: 12,
  1595. },
  1596. },
  1597. tooltip: {
  1598. trigger: 'item',
  1599. formatter: function (params) {
  1600. return params.name + ',' + (params.value[0] / count * 100).toFixed(2) + '%' + '</br >' + params.value[1] + '个' + ',' + params.value[0] + '亿'
  1601. }
  1602. // position: ['-5%', '95%'],
  1603. },
  1604. color: ['#6682f5', '#8ba2ff', '#69c0ff', '#43ede3', '#897DFF', '#FED95B', '#D87AFF'],
  1605. legend: {
  1606. show: false,
  1607. icon: 'circle',
  1608. top: 'bottom',
  1609. orient: 'vertical',
  1610. right: '-3%',
  1611. textStyle: {
  1612. color: '#9DB9EB',
  1613. fontSize: '10px'
  1614. },
  1615. itemWidth: 10,
  1616. itemHeight: 10
  1617. },
  1618. series: [
  1619. {
  1620. name: '',
  1621. type: 'pie',
  1622. radius: ['40%', '60%'],
  1623. center: ['50%', '45%'],
  1624. itemStyle: {
  1625. normal: {
  1626. borderColor: 'rgba(1,31,64,0.7)',
  1627. borderWidth: 6,
  1628. label: {
  1629. show: false,
  1630. },
  1631. },
  1632. },
  1633. labelLine: {
  1634. show: false,
  1635. },
  1636. data,
  1637. },
  1638. ],
  1639. }
  1640. myChart.setOption(option)
  1641. tools.loopShowTooltip(myChart, option, {
  1642. nterval: 2000,
  1643. loopSeries: true,
  1644. })
  1645. },
  1646. initChartR3 () {
  1647. let myChart = echarts.init(this.$refs['echartR3'])
  1648. let option = {
  1649. title: {
  1650. text: '股权类',
  1651. textStyle: {
  1652. color: '#69C0FF',
  1653. fontSize: 16,
  1654. fontWeight: 500
  1655. },
  1656. top: '10',
  1657. left: '10'
  1658. },
  1659. textStyle: {
  1660. color: '#fff',
  1661. },
  1662. tooltip: {
  1663. trigger: "axis",
  1664. formatter: function (params) {
  1665. 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] + '亿元';
  1666. return tip
  1667. },
  1668. axisPointer: {
  1669. lineStyle: {
  1670. type: 'dashed',
  1671. width: 2,
  1672. color: 'rgba(255,255,255,0.6)'
  1673. },
  1674. animation: true
  1675. }
  1676. },
  1677. grid: {
  1678. top: '22%',
  1679. right: '5%',
  1680. left: '15%',
  1681. bottom: '15%',
  1682. },
  1683. yAxis: {
  1684. data: ['备案', '特别监管'],
  1685. splitLine: {
  1686. show: true,
  1687. lineStyle: {
  1688. color: '#68b4dd66',
  1689. type: 'dashed',
  1690. },
  1691. },
  1692. axisLine: {
  1693. show: false
  1694. },
  1695. axisLabel: {
  1696. show: true,
  1697. formatter: '{value}',
  1698. textStyle: {
  1699. color: 'rgba(250,250,250,0.6)',
  1700. },
  1701. },
  1702. nameTextStyle: {
  1703. color: '#ebf8ac',
  1704. fontSize: 16,
  1705. },
  1706. },
  1707. xAxis: {
  1708. data: ['项目储备', '项目立项', '可研论证', '投资决策'],
  1709. axisLine: {
  1710. show: true, //隐藏X轴轴线
  1711. lineStyle: {
  1712. color: '#005094',
  1713. width: 1,
  1714. },
  1715. },
  1716. axisTick: {
  1717. show: false, //隐藏X轴刻度
  1718. },
  1719. axisLabel: {
  1720. show: true,
  1721. textStyle: {
  1722. color: 'rgba(255,255,255,0.6)', //X轴文字颜色
  1723. fontSize: 12,
  1724. },
  1725. },
  1726. },
  1727. series: [
  1728. {
  1729. name: '',
  1730. type: 'scatter',
  1731. symbol: 'circle',
  1732. symbolSize: function (data) {
  1733. return Math.sqrt(data[2]) * 3;
  1734. },
  1735. label: {
  1736. emphasis: {
  1737. show: true,
  1738. formatter: function (param) {
  1739. return param.data[2];
  1740. },
  1741. position: 'top'
  1742. }
  1743. },
  1744. itemStyle: {
  1745. normal: {
  1746. color: '#40A9FF'
  1747. }
  1748. },
  1749. data: [
  1750. ['项目储备', '特别监管', 9, 6.49],
  1751. ['项目立项', '特别监管', 0, 0.00],
  1752. ['可研论证', '特别监管', 2, 0.10],
  1753. ['投资决策', '特别监管', 27, 15.52],
  1754. ]
  1755. },
  1756. {
  1757. name: '',
  1758. type: 'scatter',
  1759. symbol: 'circle',
  1760. symbolSize: function (data) {
  1761. return Math.sqrt(data[2]) * 3;
  1762. },
  1763. label: {
  1764. emphasis: {
  1765. show: true,
  1766. formatter: function (param) {
  1767. return param.data[2];
  1768. },
  1769. position: 'top'
  1770. }
  1771. },
  1772. itemStyle: {
  1773. normal: {
  1774. color: '#45DAD1'
  1775. }
  1776. },
  1777. data: [
  1778. ['项目储备', '备案', 39, 8.08],
  1779. ['项目立项', '备案', 7, 1.83],
  1780. ['可研论证', '备案', 19, 1.01],
  1781. ['投资决策', '备案', 73, 17.65],
  1782. ]
  1783. },
  1784. ]
  1785. }
  1786. myChart.setOption(option)
  1787. tools.loopShowTooltip(myChart, option, {
  1788. nterval: 2000,
  1789. loopSeries: true,
  1790. })
  1791. },
  1792. initChartR6 () {
  1793. let myChart = echarts.init(this.$refs['echartR6'])
  1794. let option = {
  1795. title: {
  1796. text: '固定资产',
  1797. textStyle: {
  1798. color: '#69C0FF',
  1799. fontSize: 16,
  1800. fontWeight: 500
  1801. },
  1802. top: '10',
  1803. left: '10'
  1804. },
  1805. textStyle: {
  1806. color: '#fff',
  1807. },
  1808. tooltip: {
  1809. trigger: "axis",
  1810. formatter: function (params) {
  1811. 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] + '亿元';
  1812. return tip
  1813. },
  1814. axisPointer: {
  1815. lineStyle: {
  1816. type: 'dashed',
  1817. width: 2,
  1818. color: 'rgba(255,255,255,0.6)'
  1819. },
  1820. animation: true
  1821. }
  1822. },
  1823. grid: {
  1824. top: '25%',
  1825. right: '5%',
  1826. left: '15%',
  1827. bottom: '15%',
  1828. },
  1829. yAxis: {
  1830. data: ['备案', '特别监管'],
  1831. splitLine: {
  1832. show: true,
  1833. lineStyle: {
  1834. color: '#68b4dd66',
  1835. type: 'dashed',
  1836. },
  1837. },
  1838. axisLine: {
  1839. show: false
  1840. },
  1841. axisLabel: {
  1842. show: true,
  1843. formatter: '{value}',
  1844. textStyle: {
  1845. color: 'rgba(250,250,250,0.6)',
  1846. },
  1847. },
  1848. nameTextStyle: {
  1849. color: '#ebf8ac',
  1850. fontSize: 16,
  1851. },
  1852. },
  1853. xAxis: {
  1854. data: ['项目储备', '项目立项', '可研论证', '投资决策'],
  1855. axisLine: {
  1856. show: true, //隐藏X轴轴线
  1857. lineStyle: {
  1858. color: '#005094',
  1859. width: 1,
  1860. },
  1861. },
  1862. axisTick: {
  1863. show: false, //隐藏X轴刻度
  1864. },
  1865. axisLabel: {
  1866. show: true,
  1867. textStyle: {
  1868. color: 'rgba(255,255,255,0.6)', //X轴文字颜色
  1869. fontSize: 12,
  1870. },
  1871. },
  1872. },
  1873. series: [
  1874. {
  1875. name: '特别监管',
  1876. type: 'scatter',
  1877. symbol: 'circle',//'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow'
  1878. symbolSize: function (data) {
  1879. return Math.sqrt(data[2]) * 3;
  1880. },
  1881. label: {
  1882. emphasis: {
  1883. show: true,
  1884. formatter: function (param) {
  1885. return param.data[2];
  1886. },
  1887. position: 'top'
  1888. }
  1889. },
  1890. itemStyle: {
  1891. normal: {
  1892. color: '#40A9FF'
  1893. }
  1894. },
  1895. data: [
  1896. ['项目储备', '特别监管', 14, 12.05],
  1897. ['项目立项', '特别监管', 2, 1.25],
  1898. ['可研论证', '特别监管', 10, 32.69],
  1899. ['投资决策', '特别监管', 15, 28.53],
  1900. ]
  1901. },
  1902. {
  1903. name: '备案',
  1904. type: 'scatter',
  1905. symbol: 'circle',//'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow'
  1906. symbolSize: function (data) {
  1907. return Math.sqrt(data[2]) * 3;
  1908. },
  1909. label: {
  1910. emphasis: {
  1911. show: true,
  1912. formatter: function (param) {
  1913. return param.data[2];
  1914. },
  1915. position: 'top'
  1916. }
  1917. },
  1918. itemStyle: {
  1919. normal: {
  1920. color: '#45DAD1'
  1921. }
  1922. },
  1923. data: [
  1924. ['项目储备', '备案', 27, 23.86],
  1925. ['项目立项', '备案', 1, 1.05],
  1926. ['可研论证', '备案', 14, 18.46],
  1927. ['投资决策', '备案', 40, 38.86],
  1928. ]
  1929. },
  1930. ]
  1931. }
  1932. myChart.setOption(option)
  1933. tools.loopShowTooltip(myChart, option, {
  1934. nterval: 2000,
  1935. loopSeries: true,
  1936. })
  1937. },
  1938. initChartT1 (list, info) {
  1939. let count = 0
  1940. console.log(list, info)
  1941. this.echartTitle = info.title.text
  1942. let data = list
  1943. data.forEach(item => {
  1944. count += item.value[0]
  1945. })
  1946. let option = JSON.parse(JSON.stringify(info))
  1947. option.series[0].center = ['50%', '50%']
  1948. option.series[0].radius = ['60%', '75%']
  1949. option.legend = {
  1950. show: true,
  1951. icon: 'circle',
  1952. top: 'bottom',
  1953. orient: 'vertical',
  1954. right: '3%',
  1955. textStyle: {
  1956. color: '#9DB9EB',
  1957. fontSize: 16
  1958. },
  1959. itemWidth: 10,
  1960. itemHeight: 10
  1961. },
  1962. option.title.text = ''
  1963. option.tooltip = {
  1964. trigger: 'item',
  1965. formatter: function (params) {
  1966. return params.name + ',' + (params.value[0] / count * 100).toFixed(2) + '%' + '</br >' + params.value[1] + '个' + ',' + params.value[0] + '亿'
  1967. }
  1968. }
  1969. let myChart = echarts.init(this.$refs['echartT1'])
  1970. myChart.setOption(option)
  1971. tools.loopShowTooltip(myChart, option, {
  1972. nterval: 2000,
  1973. loopSeries: true,
  1974. })
  1975. }
  1976. },
  1977. })