investHome2.js 65 KB

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