investHome2.js 63 KB

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