index.js 171 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915191619171918191919201921192219231924192519261927192819291930193119321933193419351936193719381939194019411942194319441945194619471948194919501951195219531954195519561957195819591960196119621963196419651966196719681969197019711972197319741975197619771978197919801981198219831984198519861987198819891990199119921993199419951996199719981999200020012002200320042005200620072008200920102011201220132014201520162017201820192020202120222023202420252026202720282029203020312032203320342035203620372038203920402041204220432044204520462047204820492050205120522053205420552056205720582059206020612062206320642065206620672068206920702071207220732074207520762077207820792080208120822083208420852086208720882089209020912092209320942095209620972098209921002101210221032104210521062107210821092110211121122113211421152116211721182119212021212122212321242125212621272128212921302131213221332134213521362137213821392140214121422143214421452146214721482149215021512152215321542155215621572158215921602161216221632164216521662167216821692170217121722173217421752176217721782179218021812182218321842185218621872188218921902191219221932194219521962197219821992200220122022203220422052206220722082209221022112212221322142215221622172218221922202221222222232224222522262227222822292230223122322233223422352236223722382239224022412242224322442245224622472248224922502251225222532254225522562257225822592260226122622263226422652266226722682269227022712272227322742275227622772278227922802281228222832284228522862287228822892290229122922293229422952296229722982299230023012302230323042305230623072308230923102311231223132314231523162317231823192320232123222323232423252326232723282329233023312332233323342335233623372338233923402341234223432344234523462347234823492350235123522353235423552356235723582359236023612362236323642365236623672368236923702371237223732374237523762377237823792380238123822383238423852386238723882389239023912392239323942395239623972398239924002401240224032404240524062407240824092410241124122413241424152416241724182419242024212422242324242425242624272428242924302431243224332434243524362437243824392440244124422443244424452446244724482449245024512452245324542455245624572458245924602461246224632464246524662467246824692470247124722473247424752476247724782479248024812482248324842485248624872488248924902491249224932494249524962497249824992500250125022503250425052506250725082509251025112512251325142515251625172518251925202521252225232524252525262527252825292530253125322533253425352536253725382539254025412542254325442545254625472548254925502551255225532554255525562557255825592560256125622563256425652566256725682569257025712572257325742575257625772578257925802581258225832584258525862587258825892590259125922593259425952596259725982599260026012602260326042605260626072608260926102611261226132614261526162617261826192620262126222623262426252626262726282629263026312632263326342635263626372638263926402641264226432644264526462647264826492650265126522653265426552656265726582659266026612662266326642665266626672668266926702671267226732674267526762677267826792680268126822683268426852686268726882689269026912692269326942695269626972698269927002701270227032704270527062707270827092710271127122713271427152716271727182719272027212722272327242725272627272728272927302731273227332734273527362737273827392740274127422743274427452746274727482749275027512752275327542755275627572758275927602761276227632764276527662767276827692770277127722773277427752776277727782779278027812782278327842785278627872788278927902791279227932794279527962797279827992800280128022803280428052806280728082809281028112812281328142815281628172818281928202821282228232824282528262827282828292830283128322833283428352836283728382839284028412842284328442845284628472848284928502851285228532854285528562857285828592860286128622863286428652866286728682869287028712872287328742875287628772878287928802881288228832884288528862887288828892890289128922893289428952896289728982899290029012902290329042905290629072908290929102911291229132914291529162917291829192920292129222923292429252926292729282929293029312932293329342935293629372938293929402941294229432944294529462947294829492950295129522953295429552956295729582959296029612962296329642965296629672968296929702971297229732974297529762977297829792980298129822983298429852986298729882989299029912992299329942995299629972998299930003001300230033004300530063007300830093010301130123013301430153016301730183019302030213022302330243025302630273028302930303031303230333034303530363037303830393040304130423043304430453046304730483049305030513052305330543055305630573058305930603061306230633064306530663067306830693070307130723073307430753076307730783079308030813082308330843085308630873088308930903091309230933094309530963097309830993100310131023103310431053106310731083109311031113112311331143115311631173118311931203121312231233124312531263127312831293130313131323133313431353136313731383139314031413142314331443145314631473148314931503151315231533154315531563157315831593160316131623163316431653166316731683169317031713172317331743175317631773178317931803181318231833184318531863187318831893190319131923193319431953196319731983199320032013202320332043205320632073208320932103211321232133214321532163217321832193220322132223223322432253226322732283229323032313232323332343235323632373238323932403241324232433244324532463247324832493250325132523253325432553256325732583259326032613262326332643265326632673268326932703271327232733274327532763277327832793280328132823283328432853286328732883289329032913292329332943295329632973298329933003301330233033304330533063307330833093310331133123313331433153316331733183319332033213322332333243325332633273328332933303331333233333334333533363337333833393340334133423343334433453346334733483349335033513352335333543355335633573358335933603361336233633364336533663367336833693370337133723373337433753376337733783379338033813382338333843385338633873388338933903391339233933394339533963397339833993400340134023403340434053406340734083409341034113412341334143415341634173418341934203421342234233424342534263427342834293430343134323433343434353436343734383439344034413442344334443445344634473448344934503451345234533454345534563457345834593460346134623463346434653466346734683469347034713472347334743475347634773478347934803481348234833484348534863487348834893490349134923493349434953496349734983499350035013502350335043505350635073508350935103511351235133514351535163517351835193520352135223523352435253526352735283529353035313532353335343535353635373538353935403541354235433544354535463547354835493550355135523553355435553556355735583559356035613562356335643565356635673568356935703571357235733574357535763577357835793580358135823583358435853586358735883589359035913592359335943595359635973598359936003601360236033604360536063607360836093610361136123613361436153616361736183619362036213622362336243625362636273628362936303631363236333634363536363637363836393640364136423643364436453646364736483649365036513652365336543655365636573658365936603661366236633664366536663667366836693670367136723673367436753676367736783679368036813682368336843685368636873688368936903691369236933694369536963697369836993700370137023703370437053706370737083709371037113712371337143715371637173718371937203721372237233724372537263727372837293730373137323733373437353736373737383739374037413742374337443745374637473748374937503751375237533754375537563757375837593760376137623763376437653766376737683769377037713772377337743775377637773778377937803781378237833784378537863787378837893790379137923793379437953796379737983799380038013802380338043805380638073808380938103811381238133814381538163817381838193820382138223823382438253826382738283829383038313832383338343835383638373838383938403841384238433844384538463847384838493850385138523853385438553856385738583859386038613862386338643865386638673868386938703871387238733874387538763877387838793880388138823883388438853886388738883889389038913892389338943895389638973898389939003901390239033904390539063907390839093910391139123913391439153916391739183919392039213922392339243925392639273928392939303931393239333934393539363937393839393940394139423943394439453946394739483949395039513952395339543955395639573958395939603961396239633964396539663967396839693970397139723973397439753976397739783979398039813982398339843985398639873988398939903991399239933994399539963997399839994000400140024003400440054006400740084009401040114012401340144015401640174018401940204021402240234024402540264027402840294030403140324033403440354036403740384039404040414042404340444045404640474048404940504051405240534054405540564057405840594060406140624063406440654066406740684069407040714072407340744075407640774078407940804081408240834084408540864087408840894090409140924093409440954096409740984099410041014102410341044105410641074108410941104111411241134114411541164117411841194120412141224123412441254126412741284129413041314132413341344135413641374138413941404141414241434144414541464147414841494150415141524153415441554156415741584159416041614162416341644165416641674168416941704171417241734174417541764177417841794180418141824183418441854186418741884189419041914192419341944195419641974198419942004201420242034204420542064207420842094210421142124213421442154216421742184219422042214222422342244225422642274228422942304231423242334234423542364237423842394240424142424243424442454246424742484249425042514252425342544255425642574258425942604261426242634264426542664267426842694270427142724273427442754276427742784279428042814282428342844285428642874288428942904291429242934294429542964297429842994300430143024303430443054306430743084309431043114312431343144315431643174318431943204321432243234324432543264327432843294330433143324333433443354336433743384339434043414342434343444345434643474348434943504351435243534354435543564357435843594360436143624363436443654366436743684369437043714372437343744375437643774378437943804381438243834384438543864387438843894390439143924393439443954396439743984399440044014402440344044405440644074408440944104411441244134414441544164417441844194420442144224423442444254426442744284429443044314432443344344435443644374438443944404441444244434444444544464447444844494450445144524453445444554456445744584459446044614462446344644465446644674468446944704471447244734474447544764477447844794480448144824483448444854486448744884489449044914492449344944495449644974498449945004501450245034504450545064507450845094510451145124513451445154516451745184519452045214522452345244525452645274528452945304531453245334534453545364537453845394540454145424543454445454546454745484549455045514552455345544555455645574558455945604561456245634564456545664567456845694570457145724573457445754576457745784579458045814582458345844585458645874588458945904591459245934594459545964597459845994600460146024603460446054606460746084609461046114612461346144615461646174618461946204621462246234624462546264627462846294630463146324633463446354636463746384639464046414642464346444645464646474648464946504651465246534654465546564657465846594660466146624663466446654666466746684669467046714672467346744675467646774678467946804681468246834684468546864687468846894690469146924693469446954696469746984699470047014702470347044705470647074708470947104711471247134714471547164717471847194720472147224723472447254726472747284729473047314732473347344735473647374738473947404741474247434744474547464747474847494750475147524753475447554756475747584759476047614762476347644765476647674768476947704771477247734774477547764777477847794780478147824783478447854786478747884789479047914792479347944795479647974798479948004801480248034804480548064807480848094810481148124813481448154816481748184819482048214822482348244825482648274828482948304831483248334834483548364837483848394840484148424843484448454846484748484849485048514852485348544855485648574858485948604861486248634864486548664867486848694870487148724873487448754876487748784879488048814882488348844885488648874888488948904891489248934894489548964897489848994900490149024903490449054906490749084909491049114912491349144915491649174918491949204921492249234924492549264927492849294930493149324933493449354936493749384939494049414942494349444945494649474948494949504951495249534954495549564957495849594960496149624963496449654966496749684969497049714972497349744975497649774978497949804981498249834984498549864987498849894990499149924993499449954996499749984999500050015002500350045005500650075008500950105011501250135014501550165017501850195020502150225023502450255026502750285029503050315032503350345035503650375038503950405041
  1. let app = new Vue({
  2. el: "#app",
  3. data() {
  4. return {
  5. count: 0, //重点项目两线指标轮到哪个
  6. list: [], //重点项目两线指标数组
  7. countType: 0, //重点项目两线指标数组
  8. mapShow: true, // false为中国地图 true为山西地图
  9. leftEcharts1: "",
  10. leftEcharts2: "",
  11. leftEcharts3: "",
  12. leftEcharts4: "",
  13. leftEcharts5: "",
  14. leftEcharts6: "",
  15. leftEcharts7: "",
  16. leftEcharts8: "",
  17. leftEcharts9: "",
  18. leftEcharts10: "",
  19. leftEcharts11: "",
  20. leftEcharts12: '',
  21. leftEcharts13: '',
  22. leftEcharts14: '',
  23. leftEcharts15: '',
  24. echartR2Fd: true, // 投后进度成本偏差防抖
  25. leftEcharts16: '', // 中国地图背景地球
  26. rightEcharts1: '', // 投后进度成本偏差
  27. shanxiMap: "", // 山西地图
  28. chinaMap: '', // 中国地图
  29. industryProportion: 1, // 主辅业占比轮播
  30. industryLayout: 0, //产业布局分析
  31. time1: "", // 4秒定时器
  32. time2: "", // 针对投前产业布局分析的定时器
  33. projectNum: 0, // 项目阶段分析指示器
  34. projecList: [ //项目阶段分析内容距离
  35. [
  36. { name: '特别监管', value: '1230', value2: '1036' },
  37. { name: '备案', value: '1230', value2: '1036' },
  38. { name: '项目储备', distance: '250px' }
  39. ],
  40. [
  41. { name: '特别监管', value: '1230', value2: '1036' },
  42. { name: '备案', value: '1230', value2: '1036' },
  43. { name: '项目储备', distance: '370px' }
  44. ],
  45. [
  46. { name: '特别监管', value: '1230', value2: '1036' },
  47. { name: '备案', value: '1230', value2: '1036' },
  48. { name: '项目储备', distance: '490px' }
  49. ],
  50. [
  51. { name: '特别监管', value: '1230', value2: '1036' },
  52. { name: '备案', value: '1230', value2: '1036' },
  53. { name: '项目储备', distance: '610px' }
  54. ],
  55. [
  56. { name: '特别监管', value: '1230', value2: '1036' },
  57. { name: '备案', value: '1230', value2: '1036' },
  58. { name: '项目储备', distance: '350px' }
  59. ],
  60. [
  61. { name: '特别监管', value: '1230', value2: '1036' },
  62. { name: '备案', value: '1230', value2: '1036' },
  63. { name: '项目储备', distance: '470px' }
  64. ],
  65. [
  66. { name: '特别监管', value: '1230', value2: '1036' },
  67. { name: '备案', value: '1230', value2: '1036' },
  68. { name: '项目储备', distance: '590px' }
  69. ],
  70. [
  71. { name: '特别监管', value: '1230', value2: '1036' },
  72. { name: '备案', value: '1230', value2: '1036' },
  73. { name: '项目储备', distance: '710px' }
  74. ],
  75. ],
  76. storageRecordConfig: {
  77. waitTime: "2000",
  78. hoverPause: true,
  79. header: ["企业集团", "项目名 ", "投资总额"],
  80. headerHeight: 80,
  81. headerBGC: '#69C0FF20',
  82. oddRowBGC: '#011e4800',
  83. evenRowBGC: '#69C0FF20',
  84. // oddRowBGC: '#05507b33',
  85. rowNum: 6,
  86. columnWidth: [150, 450, 150],
  87. align: ["center", "center", "center"],
  88. data: [
  89. ["国际能源", "娄烦县120MW智慧光伏发电项目+10%储能", "6.78亿元"],
  90. ["国际能源", "平朔矿区150MW农光储氢一体化项目", "7.84亿元"],
  91. ["汾酒集团", "汾酒2030技改原酒产储能扩建项目(一期)", "91.02亿元"],
  92. [
  93. "大地控股",
  94. "山西大地控股忻州新店矿业有限公司投资建设年产800万吨精品砂石骨料项目",
  95. "8.67亿元",
  96. ],
  97. ["潞安化工", "分布式光伏发电项目", "2.01亿元"],
  98. ["太重集团", "设立太重(大同)新能源产业投资公司", "0.30亿元"],
  99. [
  100. "大地控股",
  101. "山西大地宏翔环保科技有限公司电厂固废资源化综合利用建设项目",
  102. "3.60亿元",
  103. ],
  104. [
  105. "大地控股",
  106. "山西大地海科环保科技有限公司电厂固废资源化综合利用建设项目",
  107. "3.11亿元",
  108. ],
  109. ["汾酒集团", "保健酒园区新增原酒产能项目", "4.98亿元"],
  110. ["汾酒集团", "白玉酒厂改扩建项目", "4.96亿元"],
  111. ["华阳新材", "5GW高效光伏组件制造项目", "4.82亿元"],
  112. ["华新燃气", "吉县—延长输气管道项目(一期工程)", "3.54亿元"],
  113. ["太重集团", "建设液压挖掘机配套油缸项目", "2.60亿元"],
  114. [
  115. "华远陆港",
  116. "物产集团参股设立项目公司投资建设山西物产万科(太原)综合物流产业园项目",
  117. "6.60亿元",
  118. ],
  119. ["太重集团", "设立昔阳县晶能新能源有限公司", "0.50亿元"],
  120. ["山西建投", "设立山西低碳环保产业集团有限公司", "30.00亿元"],
  121. [
  122. "山西建投",
  123. "设立山西省太忻经济一体化发展投资集团有限公司",
  124. "30.00亿元",
  125. ],
  126. ["华新燃气", "设立山西华新液化天然气集团有限公司", "3.00亿元"],
  127. ["交控集团", "设立山西交控新能源发展有限公司", "3.00亿元"],
  128. ],
  129. },
  130. storageRecordConfig2: {
  131. header: ['企业集团', '项目名称', '投资金额'],
  132. headerBGC: '#69C0FF20',
  133. oddRowBGC: '#011e4800',
  134. evenRowBGC: '#69C0FF20',
  135. headerHeight: '80',
  136. rowNum: 6,
  137. // columnWidth: [250],
  138. align: ['center', 'center', 'center'],
  139. data: [
  140. ["战略性新兴产业", "新材料", "20,340.00"],
  141. ["战略性新兴产业", "新材料", "20,340.00"],
  142. ["战略性新兴产业", "新材料", "20,340.00"],
  143. ["战略性新兴产业", "新材料", "20,340.00"],
  144. ["战略性新兴产业", "新材料", "20,340.00"],
  145. ["战略性新兴产业", "新材料", "20,340.00"],
  146. ["战略性新兴产业", "新材料", "20,340.00"],
  147. ["战略性新兴产业", "新材料", "20,340.00"],
  148. ["战略性新兴产业", "新材料", "20,340.00"],
  149. ],
  150. },
  151. meansList: [
  152. {
  153. label: "初步设计",
  154. value: "106",
  155. },
  156. {
  157. label: "详细设计",
  158. value: "103",
  159. },
  160. {
  161. label: "施工",
  162. value: "62",
  163. },
  164. {
  165. label: "完工",
  166. value: "35",
  167. },
  168. {
  169. label: "验收",
  170. value: "42",
  171. },
  172. {
  173. label: "结算",
  174. value: "33",
  175. },
  176. ],
  177. stockRightList: [
  178. {
  179. label: "前期准备",
  180. value: "66",
  181. },
  182. {
  183. label: "变更登记",
  184. value: "77",
  185. },
  186. ],
  187. costList: [
  188. {
  189. num: 160,
  190. value: 284,
  191. status: "正偏差",
  192. },
  193. {
  194. num: 280,
  195. value: 129,
  196. status: "容差内",
  197. },
  198. {
  199. num: 103,
  200. value: 1082,
  201. status: "负偏差",
  202. },
  203. ],
  204. investData: {
  205. investList: [
  206. {
  207. name: "大地控股",
  208. yse: "26.79",
  209. yqhte: "9.64",
  210. czrde: "121.59",
  211. jse: "120.13",
  212. fke: "36.4",
  213. url: "./img/logos/logo15.png",
  214. },
  215. {
  216. name: "云时代",
  217. yse: "21.79",
  218. yqhte: "9.64",
  219. czrde: "121.59",
  220. jse: "120.13",
  221. fke: "36.4",
  222. url: "./img/logos/logo16.png",
  223. },
  224. {
  225. name: "华舰体育",
  226. yse: "26.79",
  227. yqhte: "9.64",
  228. czrde: "121.59",
  229. jse: "120.13",
  230. fke: "36.4",
  231. url: "./img/logos/logo17.png",
  232. },
  233. {
  234. name: "神农科技",
  235. yse: "26.79",
  236. yqhte: "9.64",
  237. czrde: "121.59",
  238. jse: "120.13",
  239. fke: "36.4",
  240. url: "./img/logos/logo18.png",
  241. },
  242. {
  243. name: "山西焦煤",
  244. yse: "26.79",
  245. yqhte: "9.64",
  246. czrde: "121.59",
  247. jse: "120.13",
  248. fke: "36.4",
  249. url: "./img/logos/logo1.png",
  250. },
  251. {
  252. name: "晋能控股",
  253. yse: "26.79",
  254. yqhte: "9.64",
  255. czrde: "121.59",
  256. jse: "120.13",
  257. fke: "36.4",
  258. url: "./img/logos/logo2.png",
  259. },
  260. {
  261. name: "华阳新材",
  262. yse: "26.79",
  263. yqhte: "9.64",
  264. czrde: "121.59",
  265. jse: "120.13",
  266. fke: "36.4",
  267. url: "./img/logos/logo3.png",
  268. },
  269. {
  270. name: "潞安化工",
  271. yse: "26.79",
  272. yqhte: "9.64",
  273. czrde: "121.59",
  274. jse: "120.13",
  275. fke: "36.4",
  276. url: "./img/logos/logo4.png",
  277. },
  278. {
  279. name: "华新燃气",
  280. yse: "26.79",
  281. yqhte: "9.64",
  282. czrde: "121.59",
  283. jse: "120.13",
  284. fke: "36.4",
  285. url: "./img/logos/logo5.png",
  286. },
  287. {
  288. name: "太重集团",
  289. yse: "26.79",
  290. yqhte: "9.64",
  291. czrde: "121.59",
  292. jse: "120.13",
  293. fke: "36.4",
  294. url: "./img/logos/logo6.png",
  295. },
  296. {
  297. name: "国际能源",
  298. yse: "26.79",
  299. yqhte: "9.64",
  300. czrde: "121.59",
  301. jse: "120.13",
  302. fke: "36.4",
  303. url: "./img/logos/logo7.png",
  304. },
  305. {
  306. name: "华远陆港",
  307. yse: "26.79",
  308. yqhte: "9.64",
  309. czrde: "121.59",
  310. jse: "120.13",
  311. fke: "36.4",
  312. url: "./img/logos/logo8.png",
  313. },
  314. {
  315. name: "水控集团",
  316. yse: "26.79",
  317. yqhte: "9.64",
  318. czrde: "121.59",
  319. jse: "120.13",
  320. fke: "36.4",
  321. url: "./img/logos/logo9.png",
  322. },
  323. {
  324. name: "文旅集团",
  325. yse: "26.79",
  326. yqhte: "9.64",
  327. czrde: "121.59",
  328. jse: "120.13",
  329. fke: "36.4",
  330. url: "./img/logos/logo10.png",
  331. },
  332. {
  333. name: "交控集团",
  334. yse: "26.79",
  335. yqhte: "9.64",
  336. czrde: "121.59",
  337. jse: "120.13",
  338. fke: "36.4",
  339. url: "./img/logos/logo11.png",
  340. },
  341. {
  342. name: "航产集团",
  343. yse: "26.79",
  344. yqhte: "9.64",
  345. czrde: "121.59",
  346. jse: "120.13",
  347. fke: "36.4",
  348. url: "./img/logos/logo12.png",
  349. },
  350. {
  351. name: "山西建投",
  352. yse: "26.79",
  353. yqhte: "9.64",
  354. czrde: "121.59",
  355. jse: "120.13",
  356. fke: "36.4",
  357. url: "./img/logos/logo13.png",
  358. },
  359. {
  360. name: "汾酒集团",
  361. yse: "26.79",
  362. yqhte: "9.64",
  363. czrde: "121.59",
  364. jse: "120.13",
  365. fke: "36.4",
  366. url: "./img/logos/logo14.png",
  367. },
  368. ],
  369. },
  370. riskData: {
  371. x: [
  372. { name: "大地控股", value: [14, 13, 6, 15, 13, 4] },
  373. { name: "云时代", value: [15, 12, 12, 10, 24, 6] },
  374. { name: "华舰体育", value: [14, 13, 6, 15, 13, 4] },
  375. { name: "神农科技", value: [14, 13, 6, 15, 13, 4] },
  376. { name: "山西焦煤", value: [14, 13, 6, 15, 13, 4] },
  377. { name: "晋能控股", value: [14, 13, 6, 15, 13, 4] },
  378. { name: "华阳新材", value: [14, 13, 6, 15, 13, 4] },
  379. { name: "潞安化工", value: [14, 13, 6, 15, 13, 4] },
  380. { name: "华新燃气", value: [14, 13, 6, 15, 13, 4] },
  381. { name: "太重集团", value: [14, 13, 6, 15, 13, 4] },
  382. { name: "国际能源", value: [14, 13, 6, 15, 13, 4] },
  383. { name: "华远陆港", value: [14, 13, 6, 15, 13, 4] },
  384. { name: "水控集团", value: [14, 13, 6, 15, 13, 4] },
  385. { name: "文旅集团", value: [14, 13, 6, 15, 13, 4] },
  386. { name: "交控集团", value: [14, 13, 6, 15, 13, 4] },
  387. { name: "航产集团", value: [14, 13, 6, 15, 13, 4] },
  388. { name: "山西建投", value: [14, 13, 6, 15, 13, 4] },
  389. { name: "汾酒集团", value: [14, 13, 6, 15, 13, 4] },
  390. ],
  391. y1: [
  392. 120, 110, 200, 220, 123, 345, 323, 123, 233, 234, 123, 143, 120, 110,
  393. 20, 220, 123, 345,
  394. ],
  395. y2: [
  396. 120, 110, 210, 220, 123, 345, 323, 123, 233, 234, 123, 143, 120, 110,
  397. 20, 220, 123, 345,
  398. ],
  399. y3: [
  400. 120, 110, 230, 220, 123, 345, 323, 123, 233, 234, 123, 143, 120, 110,
  401. 20, 220, 123, 345,
  402. ],
  403. },
  404. inner: 0,
  405. innerDeg: 0,
  406. timer: null, // 两秒定时器
  407. witchs: 0,
  408. topIndex: 0,
  409. echartR1Fd1: true,
  410. echartR2Fd2: true,
  411. echartC1Fd1:true,
  412. r3Index: 0,
  413. riskData1: {
  414. x: [
  415. "大地控股",
  416. "云时代",
  417. "华舰体育",
  418. "神农科技",
  419. "山西焦煤",
  420. "晋能控股",
  421. "华阳新材",
  422. "潞安化工",
  423. "华新燃气",
  424. "太重集团",
  425. "国际能源",
  426. "华远陆港",
  427. "水控集团",
  428. "文旅集团",
  429. "交控集团",
  430. "航产集团",
  431. "山西建投",
  432. "汾酒集团",
  433. ],
  434. y1: [
  435. 100, 45, 67, 110, 108, 120, 110, 45, 67, 110, 108, 34, 100, 45, 67,
  436. 110, 108, 34,
  437. ],
  438. y2: [
  439. 120, 50, 67, 130, 56, 233, 100, 78, 98, 100, 120, 78, 120, 90, 56,
  440. 120, 110, 78,
  441. ],
  442. y3: [
  443. 130, 76, 67, 120, 89, 111, 87, 123, 56, 65, 45, 98, 230, 78, 99, 130,
  444. 56, 98,
  445. ],
  446. y4: [
  447. 90, 100, 67, 90, 110, 120, 34, 231, 34, 78, 78, 100, 110, 120, 67, 89,
  448. 78, 110,
  449. ],
  450. y5: [
  451. 110, 110, 67, 110, 120, 95, 78, 45, 120, 110, 98, 233, 100, 45, 67,
  452. 98, 98, 34,
  453. ],
  454. },
  455. };
  456. },
  457. created() { },
  458. beforeDestroy() {
  459. clearInterval(this.timer);
  460. clearInterval(this.time1);
  461. clearInterval(this.time2);
  462. },
  463. mounted() {
  464. let that = this
  465. this.time4s();
  466. this.timeNs();
  467. this.filterLpData();
  468. this.lpRotate();
  469. setTimeout(() => {
  470. if (that.mapShow) {
  471. that.leftEcharts12Fun()
  472. that.leftEcharts14Fun()
  473. that.leftEcharts9Fun()
  474. that.leftEcharts15Fun()
  475. that.leftEcharts13Fun()
  476. that.shanxiEchartsFun()
  477. } else {
  478. that.chinaEchartsFun()
  479. that.leftEcharts16Fun() // 中国地图背景地球
  480. }
  481. this.leftEcharts1Fun();
  482. this.leftEcharts2Fun();
  483. this.leftEcharts3Fun();
  484. this.leftEcharts4Fun();
  485. this.leftEcharts5Fun();
  486. this.leftEcharts6Fun();
  487. this.leftEcharts7Fun();
  488. this.leftEcharts8Fun();
  489. this.leftEcharts10Fun();
  490. this.leftEcharts11Fun();
  491. this.rightEcharts1Fun();
  492. this.initChartR2();
  493. this.initChartR4();
  494. });
  495. },
  496. methods: {
  497. // 解决乘法失去精度
  498. numMulti(num1, num2) {
  499. var baseNum = 0;
  500. try {
  501. baseNum += num1.toString().split(".")[1].length;
  502. } catch (e) {
  503. }
  504. try {
  505. baseNum += num2.toString().split(".")[1].length;
  506. } catch (e) {
  507. }
  508. return Number(num1.toString().replace(".", "")) * Number(num2.toString().replace(".", "")) / Math.pow(10, baseNum);
  509. },
  510. // 解决减法失去精度
  511. numSub(num1, num2) {
  512. var baseNum, baseNum1, baseNum2;
  513. var precision;// 精度
  514. try {
  515. baseNum1 = num1.toString().split(".")[1].length;
  516. } catch (e) {
  517. baseNum1 = 0;
  518. }
  519. try {
  520. baseNum2 = num2.toString().split(".")[1].length;
  521. } catch (e) {
  522. baseNum2 = 0;
  523. }
  524. baseNum = Math.pow(10, Math.max(baseNum1, baseNum2));
  525. precision = (baseNum1 >= baseNum2) ? baseNum1 : baseNum2;
  526. return ((num1 * baseNum - num2 * baseNum) / baseNum).toFixed(precision);
  527. },
  528. rightEcharts1Fun() {
  529. let that = this
  530. let sumA = 42
  531. // 所有在100范围外的全部变成0,其他值相应增加/减少sumA
  532. right5.forEach(item => {
  533. item.forEach(item2 => {
  534. if (Number(item2[1]) < 0) {
  535. item2[1] = that.$set(item2, 1, Number(that.numSub(item2[1], sumA)))
  536. } else if (Number(item2[1]) > 0) {
  537. item2[1] = that.$set(item2, 1, Number(item2[1]) + sumA)
  538. }
  539. if (Number(item2[1]) < (-100 - sumA)) {
  540. item2[1] = that.$set(item2, 1, 0)
  541. item2[1] = that.$set(item2, 2, 0)
  542. } else if (Number(item2[1]) > (100 + sumA)) {
  543. item2[1] = that.$set(item2, 1, 0)
  544. item2[1] = that.$set(item2, 2, 0)
  545. }
  546. })
  547. })
  548. const itemStyle = {
  549. // opacity: 0.8,
  550. shadowBlur: 10,
  551. shadowOffsetX: 0,
  552. shadowOffsetY: 0,
  553. shadowColor: 'rgba(0,0,0,0.3)'
  554. };
  555. that.rightEcharts1 = echarts.init(this.$refs['rightEcharts1'])
  556. that.rightEcharts1.on('showTip', (params) => {
  557. // 如果是7或者15并且满足防抖则切换
  558. if ((params.dataIndex == 5 || params.dataIndex == 11) && that.echartR2Fd) {
  559. that.echartR2Fd = false
  560. setTimeout(() => {
  561. option.dataZoom[0].endValue = option.dataZoom[0].endValue + 6
  562. option.dataZoom[0].startValue = option.dataZoom[0].startValue + 6
  563. that.rightEcharts1.setOption(option);
  564. // 防止勿刷新做的防抖
  565. setTimeout(() => {
  566. that.echartR2Fd = true
  567. }, 2000)
  568. }, 1900);
  569. // 如果是17表示到了最后一个,那么重新来一遍
  570. } else if (params.dataIndex == 17 && that.echartR2Fd) {
  571. that.echartR2Fd = false
  572. setTimeout(() => {
  573. option.dataZoom[0].endValue = 0
  574. option.dataZoom[0].startValue = 5
  575. that.rightEcharts1.setOption(option);
  576. // 防止勿刷新做的防抖
  577. setTimeout(() => {
  578. that.echartR2Fd = true
  579. }, 2000)
  580. }, 1900)
  581. }
  582. })
  583. let option = {
  584. color: [{
  585. type: 'radial', // linear 线性渐变 radial径向渐变
  586. x: 0.5,
  587. y: 0.5,
  588. r: 0.5,
  589. colorStops: [{
  590. offset: 0, color: '#58F7DF' // 0% 处的颜色
  591. }, {
  592. offset: 1, color: '#4ECFBB' // 100% 处的颜色
  593. }]
  594. },
  595. {
  596. type: 'radial', // linear 线性渐变 radial径向渐变
  597. x: 0.5,
  598. y: 0.5,
  599. r: 0.5,
  600. colorStops: [{
  601. offset: 0, color: '#7FD9FF' // 0% 处的颜色
  602. }, {
  603. offset: 1, color: '#40A9FF' // 100% 处的颜色
  604. }]
  605. }, {
  606. type: 'radial', // linear 线性渐变 radial径向渐变
  607. x: 0.5,
  608. y: 0.5,
  609. r: 0.5,
  610. colorStops: [{
  611. offset: 0, color: '#FF9592' // 0% 处的颜色
  612. }, {
  613. offset: 1, color: '#D2706D' // 100% 处的颜色
  614. }]
  615. }
  616. ],
  617. dataZoom: [
  618. {
  619. // start: 9,//默认为@
  620. // end: 100,//黑认认为1@0
  621. type: "slider",
  622. show: false,
  623. // xAxisIndex: [0]
  624. handlesize: 0,//滑动条的 左右2个滑动条的大小
  625. startValue: 5,// 初始显示值
  626. endValue: 0,// 结束显示值
  627. height: 10,//组件高度
  628. left: "5%",
  629. right: "4%",//右边的距离
  630. bottom: "25%",//底边的距离
  631. borderColor: "#939",
  632. fillerColor: "#269cdb",
  633. borderRadius: 5,
  634. backgroundColor: "#33384b",//两边未选中的滑动条区域的额色
  635. showDataShadow: false,//是否显示数据阴影
  636. showDetail: false,//即拖拽时候是否显示详细数值信息
  637. truerealtime: true,//是否实时更新
  638. filterMode: "filter"
  639. }, {
  640. type: 'inside',
  641. show: true,
  642. start: 1,
  643. end: 100,
  644. zoomOnMouseWheel: false, //滚轮是否触发缩放
  645. moveOnMouseMove: false, //鼠标滚轮触发滚动
  646. }
  647. ],
  648. legend: {
  649. selectedMode: false,
  650. top: 10,
  651. data: ['正偏差', '容差', '负偏差'],
  652. textStyle: {
  653. fontSize: 20,
  654. color: '#fff',
  655. fontFamily: 'Microsoft YaHei'
  656. }
  657. },
  658. textStyle: {
  659. color: '#fff',
  660. },
  661. tooltip: {
  662. show: true,
  663. trigger: "axis",
  664. backgroundColor: "rgba(50,50,50,0.7)", // 提示框浮层的背景颜色
  665. borderColor: "rgba(50,50,50,0.7)",
  666. textStyle: {
  667. color: "#fff",
  668. fontStyle: "normal", // 文字字体的风格('normal',无样式;'italic',斜体;'oblique',倾斜字体)
  669. fontWeight: "normal", // 文字字体的粗细('normal',无样式;'bold',加粗;'bolder',加粗的基础上再加粗;'lighter',变细;数字定义粗细也可以,取值范围100至700)
  670. fontSize: "28", // 文字字体大小
  671. },
  672. formatter: data => {
  673. return `${data[0].value[0]}<br /><span style="display:inline-block;border-radius:50%; width:20px;height:20px;background-color:${data[0].color}"></span> ${data[0].seriesName}:${that.numFormat(data[0].data[2])}亿<br /><span style="display:inline-block;border-radius:50%; width:20px;height:20px;background-color:${data[1].color}"></span> ${data[1].seriesName}:${that.numFormat(data[1].data[2])}亿<br /><span style="display:inline-block;border-radius:50%; width:20px;height:20px;background-color:${data[2].color}"></span> ${data[2].seriesName}:${that.numFormat(data[2].data[2])}亿`
  674. },
  675. axisPointer: {
  676. // // type: 'cross',',
  677. },
  678. },
  679. grid: {
  680. top: '10%',
  681. right: '7%',
  682. left: '7%',
  683. bottom: '5%',
  684. },
  685. yAxis: {
  686. min: (-101 - sumA),
  687. max: (101 + sumA),
  688. maxInterval: 1,
  689. splitLine: {
  690. show: false,
  691. // interval:,
  692. lineStyle: {
  693. color: '#68b4dd66',
  694. type: 'dashed',
  695. },
  696. },
  697. axisLine: {
  698. show: false
  699. },
  700. axisTick: {
  701. show: false
  702. },
  703. axisLabel: {
  704. show: true,
  705. // formatter: '{value}',
  706. formatter(data) {
  707. if (data == (100 + sumA)) {
  708. return '100%'
  709. } else if (data == (-100 - sumA)) {
  710. return '-100%'
  711. } else if (data == (-5 - sumA)) {
  712. return '-5%'
  713. } else if (data == (5 + sumA)) {
  714. return '5%'
  715. }
  716. },
  717. textStyle: {
  718. color: '#fff',
  719. fontSize: '20',
  720. fontFamily: 'Microsoft YaHei'
  721. },
  722. },
  723. nameTextStyle: {
  724. color: '#fff',
  725. fontSize: 20,
  726. fontFamily: 'Microsoft YaHei'
  727. },
  728. },
  729. xAxis: {
  730. data: commonCompany,
  731. axisLine: {
  732. show: false, //隐藏X轴轴线
  733. lineStyle: {
  734. color: '#005094',
  735. width: 1,
  736. },
  737. },
  738. splitLine: {
  739. show: true,
  740. lineStyle: {
  741. color: '#68b4dd66',
  742. type: 'dashed',
  743. },
  744. },
  745. axisTick: {
  746. show: true, //隐藏X轴刻度
  747. },
  748. axisLabel: {
  749. show: true,
  750. // rotate: 40,
  751. padding: [0, 0, 0, 0],
  752. textStyle: {
  753. color: '#fff', //X轴文字颜色
  754. fontSize: 20,
  755. fontFamily: 'Microsoft YaHei'
  756. },
  757. },
  758. },
  759. series: [
  760. {
  761. name: '正偏差',
  762. type: 'scatter',
  763. itemStyle: itemStyle,
  764. data: right5[0],
  765. symbolSize: function (data) {
  766. if ((data[2] > 0 && data[2] < 50) || data[2] == 50) {
  767. return 40;
  768. } else if ((data[2] > 50 && data[2] < 100) || data[2] == 100) {
  769. return 70;
  770. } else if (data[2] > 100) {
  771. return 100;
  772. }
  773. },
  774. markLine: {
  775. symbol: 'none',
  776. data: [
  777. {
  778. name: '100%',
  779. yAxis: 100 + sumA,
  780. lineStyle: {
  781. // color: '#fff',
  782. },
  783. label: {
  784. show: false,
  785. formatter: '{b}',
  786. position: 'right',
  787. color: '#fff',
  788. fontSize: 20,
  789. label: {
  790. show: false
  791. }
  792. },
  793. },
  794. {
  795. name: '5%',
  796. yAxis: 5 + sumA,
  797. lineStyle: {
  798. // color: '#fff',
  799. },
  800. label: {
  801. show: false,
  802. formatter: '{b}',
  803. position: 'right',
  804. color: '#fff',
  805. fontSize: 20,
  806. },
  807. },
  808. {
  809. name: '-5%',
  810. yAxis: -5 - sumA,
  811. lineStyle: {
  812. // color: '#fff',
  813. },
  814. label: {
  815. show: false,
  816. formatter: '{b}',
  817. position: 'right',
  818. color: '#fff',
  819. fontSize: 20,
  820. },
  821. },
  822. {
  823. name: '100%',
  824. yAxis: -100 - sumA,
  825. lineStyle: {
  826. // color: '#fff',
  827. },
  828. label: {
  829. show: false,
  830. formatter: '{b}',
  831. position: 'right',
  832. color: '#fff',
  833. fontSize: 20,
  834. },
  835. },
  836. ],
  837. },
  838. },
  839. {
  840. name: '容差',
  841. type: 'scatter',
  842. itemStyle: itemStyle,
  843. data: right5[1],
  844. symbolSize: function (data) {
  845. if ((data[2] > 0 && data[2] < 50) || data[2] == 50) {
  846. return 40;
  847. } else if ((data[2] > 50 && data[2] < 100) || data[2] == 100) {
  848. return 70;
  849. } else if (data[2] > 100) {
  850. return 100;
  851. }
  852. },
  853. },
  854. {
  855. name: '负偏差',
  856. type: 'scatter',
  857. itemStyle: itemStyle,
  858. data: right5[2],
  859. symbolSize: function (data) {
  860. if ((data[2] > 0 && data[2] < 50) || data[2] == 50) {
  861. return 40;
  862. } else if ((data[2] > 50 && data[2] < 100) || data[2] == 100) {
  863. return 70;
  864. } else if (data[2] > 100) {
  865. return 100;
  866. }
  867. },
  868. }
  869. ]
  870. }
  871. that.rightEcharts1.setOption(option)
  872. tools.loopShowTooltip(that.rightEcharts1, option, {
  873. interval: 2000,
  874. loopSeries: true,
  875. })
  876. },
  877. initChartR2() {
  878. let that = this;
  879. that.right1Chart = echarts.init(this.$refs["echartR2"]);
  880. that.right1Chart.on("showTip", (params) => {
  881. that.r3Index = params.dataIndex;
  882. that.initChartR3();
  883. // 如果是7或者15并且满足防抖则切换
  884. if (
  885. (params.dataIndex == 5 || params.dataIndex == 11) &&
  886. that.echartR1Fd1
  887. ) {
  888. that.echartR1Fd1 = false;
  889. setTimeout(() => {
  890. option.dataZoom[0].endValue = option.dataZoom[0].endValue + 6;
  891. option.dataZoom[0].startValue = option.dataZoom[0].startValue + 6;
  892. that.right1Chart.setOption(option);
  893. // 防止勿刷新做的防抖
  894. setTimeout(() => {
  895. that.echartR1Fd1 = true;
  896. }, 2000);
  897. }, 1900);
  898. // 如果是17表示到了最后一个,那么重新来一遍
  899. } else if (params.dataIndex == 17 && that.echartR1Fd1) {
  900. that.echartR1Fd1 = false;
  901. setTimeout(() => {
  902. option.dataZoom[0].endValue = 0;
  903. option.dataZoom[0].startValue = 5;
  904. that.right1Chart.setOption(option);
  905. // 防止勿刷新做的防抖
  906. setTimeout(() => {
  907. that.echartR1Fd1 = true;
  908. }, 2000);
  909. }, 1900);
  910. }
  911. });
  912. let option = {
  913. color: [
  914. {
  915. type: "linear",
  916. x: 0,
  917. y: 0,
  918. x2: 0,
  919. y2: 1,
  920. colorStops: [
  921. {
  922. offset: 0,
  923. color: "#07806E", // 0% 处的颜色
  924. },
  925. {
  926. offset: 1,
  927. color: "#79FFEB", // 100% 处的颜色
  928. },
  929. ],
  930. global: false, // 缺省为 false
  931. },
  932. {
  933. type: "linear",
  934. x: 0,
  935. y: 0,
  936. x2: 0,
  937. y2: 1,
  938. colorStops: [
  939. {
  940. offset: 0,
  941. color: "#9F7F00", // 0% 处的颜色
  942. },
  943. {
  944. offset: 1,
  945. color: "#FBE463", // 100% 处的颜色
  946. },
  947. ],
  948. global: false, // 缺省为 false
  949. },
  950. {
  951. type: "linear",
  952. x: 0,
  953. y: 0,
  954. x2: 0,
  955. y2: 1,
  956. colorStops: [
  957. {
  958. offset: 0,
  959. color: "#91231F", // 0% 处的颜色
  960. },
  961. {
  962. offset: 1,
  963. color: "#F98784", // 100% 处的颜色
  964. },
  965. ],
  966. global: false, // 缺省为 false
  967. }
  968. ],
  969. dataZoom: [
  970. {
  971. // start: 9,//默认为@
  972. // end: 100,//黑认认为1@0
  973. type: "slider",
  974. show: false,
  975. // xAxisIndex: [0]
  976. handlesize: 0, //滑动条的 左右2个滑动条的大小
  977. startValue: 5, // 初始显示值
  978. endValue: 0, // 结束显示值
  979. height: 10, //组件高度
  980. left: "5%",
  981. right: "4%", //右边的距离
  982. bottom: "25%", //底边的距离
  983. borderColor: "#939",
  984. fillerColor: "#269cdb",
  985. borderRadius: 5,
  986. backgroundColor: "#33384b", //两边未选中的滑动条区域的额色
  987. showDataShadow: false, //是否显示数据阴影
  988. showDetail: false, //即拖拽时候是否显示详细数值信息
  989. truerealtime: true, //是否实时更新
  990. filterMode: "filter",
  991. },
  992. {
  993. type: "inside",
  994. show: true,
  995. start: 1,
  996. end: 100,
  997. zoomOnMouseWheel: false, //滚轮是否触发缩放
  998. moveOnMouseMove: false, //鼠标滚轮触发滚动
  999. },
  1000. ],
  1001. legend: {
  1002. top: 10,
  1003. right: 10,
  1004. textStyle: {
  1005. fontSize: 20,
  1006. color: "#fff",
  1007. fontFamily: "Microsoft YaHei",
  1008. },
  1009. itemStyle: {
  1010. borderCap: "round",
  1011. },
  1012. },
  1013. tooltip: {
  1014. trigger: "item",
  1015. show: true,
  1016. position: "top",
  1017. backgroundColor: "rgba(50,50,50,0.7)", // 提示框浮层的背景颜色
  1018. backgroundColor: "rgba(50,50,50,0.7)", // 提示框浮层的背景颜色
  1019. borderColor: "rgba(50,50,50,0.7)",
  1020. textStyle: {
  1021. color: "#fff",
  1022. fontStyle: "normal", // 文字字体的风格('normal',无样式;'italic',斜体;'oblique',倾斜字体)
  1023. fontWeight: "normal", // 文字字体的粗细('normal',无样式;'bold',加粗;'bolder',加粗的基础上再加粗;'lighter',变细;数字定义粗细也可以,取值范围100至700)
  1024. fontSize: "28", // 文字字体大小
  1025. },
  1026. formatter: function (p) {
  1027. return `${p.name}<br>低风险:${that.riskData.y1[p.dataIndex]}个<br>
  1028. 中风险:${that.riskData.y2[p.dataIndex]}个<br>
  1029. 高风险:${that.riskData.y3[p.dataIndex]}个<br>
  1030. `
  1031. },
  1032. },
  1033. grid: {
  1034. left: "3%",
  1035. right: "4%",
  1036. bottom: "3%",
  1037. containLabel: true,
  1038. },
  1039. xAxis: [
  1040. {
  1041. type: "category",
  1042. data: that.riskData.x.map((item) => item.name),
  1043. axisLine: {
  1044. show: true,
  1045. lineStyle: {
  1046. color: "rgba(0, 80, 148, .8)",
  1047. },
  1048. },
  1049. axisTick: {
  1050. show: false,
  1051. },
  1052. axisLabel: {
  1053. color: "#fff",
  1054. rotate: 20,
  1055. fontSize: 22,
  1056. },
  1057. },
  1058. ],
  1059. yAxis: [
  1060. {
  1061. type: "value",
  1062. axisLabel: {
  1063. color: "#fff",
  1064. fontSize: 22,
  1065. },
  1066. splitLine: {
  1067. show: true,
  1068. lineStyle: {
  1069. color: "rgba(104, 180, 221, .2)",
  1070. type: "dashed",
  1071. },
  1072. },
  1073. },
  1074. ],
  1075. series: [
  1076. {
  1077. name: "低风险",
  1078. type: "bar",
  1079. stack: "Ad",
  1080. barWidth: 14,
  1081. emphasis: {
  1082. focus: "series",
  1083. },
  1084. itemStyle: {
  1085. barBorderRadius: [15, 15, 15, 15],
  1086. },
  1087. data: that.riskData.y1,
  1088. },
  1089. {
  1090. name: "中风险",
  1091. type: "bar",
  1092. barWidth: 14,
  1093. stack: "Ad",
  1094. itemStyle: {
  1095. barBorderRadius: [15, 15, 15, 15],
  1096. },
  1097. emphasis: {
  1098. focus: "series",
  1099. },
  1100. data: that.riskData.y2,
  1101. },
  1102. {
  1103. name: "高风险",
  1104. type: "bar",
  1105. barWidth: 14,
  1106. stack: "Ad",
  1107. itemStyle: {
  1108. barBorderRadius: [15, 15, 15, 15],
  1109. },
  1110. emphasis: {
  1111. focus: "series",
  1112. },
  1113. data: that.riskData.y3,
  1114. },
  1115. ],
  1116. };
  1117. that.right1Chart.setOption(option);
  1118. tools.loopShowTooltip(that.right1Chart, option, {
  1119. interval: 2000,
  1120. loopSeries: true,
  1121. });
  1122. },
  1123. initChartR3() {
  1124. let that = this;
  1125. that.right3Chart = echarts.init(this.$refs["echartR3"]);
  1126. let option = {
  1127. radar: {
  1128. // shape: 'circle',
  1129. splitNumber: 3,
  1130. splitLine: {
  1131. lineStyle: {
  1132. color: ["#DD5955", "#39e1d0", "#2e3d45"],
  1133. },
  1134. },
  1135. splitArea: {
  1136. areaStyle: {
  1137. color: [
  1138. "rgba(88,247,223,0.2)",
  1139. "rgba(255, 224, 54, 0.2)",
  1140. "rgba(221,89,85,0.3)",
  1141. ],
  1142. },
  1143. },
  1144. indicator: [
  1145. { name: "安全风险", max: 25 },
  1146. { name: "付款风险", max: 25 },
  1147. { name: "合同风险", max: 25 },
  1148. { name: "结算风险", max: 25 },
  1149. { name: "进度风险", max: 25 },
  1150. { name: "质量风险", max: 25 },
  1151. ],
  1152. },
  1153. series: [
  1154. {
  1155. name: "风险",
  1156. type: "radar",
  1157. symbol: "circle",
  1158. label: {
  1159. show: true,
  1160. formatter: function (params) {
  1161. return params.value;
  1162. },
  1163. fontSize: 24,
  1164. color: "#68BDFF",
  1165. },
  1166. data: [
  1167. {
  1168. value: that.riskData.x[that.r3Index].value,
  1169. areaStyle: {
  1170. color: "#112b75",
  1171. },
  1172. lineStyle: {
  1173. width: 4,
  1174. color: "#60C1FF",
  1175. },
  1176. label: {
  1177. fontSize: 22,
  1178. },
  1179. },
  1180. ],
  1181. },
  1182. ],
  1183. };
  1184. that.right3Chart.setOption(option);
  1185. },
  1186. initChartR4() {
  1187. let that = this;
  1188. that.right4Chart = echarts.init(this.$refs["echartR4"]);
  1189. that.right4Chart.on("showTip", (params) => {
  1190. // 如果是7或者15并且满足防抖则切换
  1191. if (
  1192. (params.dataIndex == 5 || params.dataIndex == 11) &&
  1193. that.echartR2Fd2
  1194. ) {
  1195. that.echartR2Fd2 = false;
  1196. setTimeout(() => {
  1197. option.dataZoom[0].endValue = option.dataZoom[0].endValue + 6;
  1198. option.dataZoom[0].startValue = option.dataZoom[0].startValue + 6;
  1199. that.right4Chart.setOption(option);
  1200. // 防止勿刷新做的防抖
  1201. setTimeout(() => {
  1202. that.echartR2Fd2 = true;
  1203. }, 2000);
  1204. }, 1900);
  1205. // 如果是17表示到了最后一个,那么重新来一遍
  1206. } else if (params.dataIndex == 17 && that.echartR2Fd2) {
  1207. that.echartR2Fd2 = false;
  1208. setTimeout(() => {
  1209. option.dataZoom[0].endValue = 0;
  1210. option.dataZoom[0].startValue = 5;
  1211. that.right4Chart.setOption(option);
  1212. // 防止勿刷新做的防抖
  1213. setTimeout(() => {
  1214. that.echartR2Fd2 = true;
  1215. }, 2000);
  1216. }, 1900);
  1217. }
  1218. });
  1219. let option = {
  1220. dataZoom: [
  1221. {
  1222. // start: 9,//默认为@
  1223. // end: 100,//黑认认为1@0
  1224. type: "slider",
  1225. show: false,
  1226. // xAxisIndex: [0]
  1227. handlesize: 0, //滑动条的 左右2个滑动条的大小
  1228. startValue: 5, // 初始显示值
  1229. endValue: 0, // 结束显示值
  1230. height: 10, //组件高度
  1231. left: "5%",
  1232. right: "4%", //右边的距离
  1233. bottom: "25%", //底边的距离
  1234. borderColor: "#939",
  1235. fillerColor: "#269cdb",
  1236. borderRadius: 5,
  1237. backgroundColor: "#33384b", //两边未选中的滑动条区域的额色
  1238. showDataShadow: false, //是否显示数据阴影
  1239. showDetail: false, //即拖拽时候是否显示详细数值信息
  1240. truerealtime: true, //是否实时更新
  1241. filterMode: "filter",
  1242. },
  1243. {
  1244. type: "inside",
  1245. show: true,
  1246. start: 1,
  1247. end: 100,
  1248. zoomOnMouseWheel: false, //滚轮是否触发缩放
  1249. moveOnMouseMove: false, //鼠标滚轮触发滚动
  1250. },
  1251. ],
  1252. title: {
  1253. text: "企业后评价执行情况",
  1254. left: "center",
  1255. textStyle: {
  1256. color: "#fff",
  1257. fontSize: 32,
  1258. },
  1259. },
  1260. tooltip: {
  1261. trigger: "item",
  1262. show: true,
  1263. position: "top",
  1264. backgroundColor: "rgba(50,50,50,0.7)", // 提示框浮层的背景颜色
  1265. borderColor: "rgba(50,50,50,0.7)",
  1266. confine: true,
  1267. textStyle: {
  1268. color: "#fff",
  1269. fontStyle: "normal", // 文字字体的风格('normal',无样式;'italic',斜体;'oblique',倾斜字体)
  1270. fontWeight: "normal", // 文字字体的粗细('normal',无样式;'bold',加粗;'bolder',加粗的基础上再加粗;'lighter',变细;数字定义粗细也可以,取值范围100至700)
  1271. fontSize: "28", // 文字字体大小
  1272. },
  1273. formatter: function (p) {
  1274. return `${p.name}<br>应首评项目数:${that.riskData1.y1[p.dataIndex]}个<br>
  1275. 已完成首评项目数:${that.riskData1.y2[p.dataIndex]}个<br>
  1276. 应再评项目数:${that.riskData1.y3[p.dataIndex]}个<br>
  1277. 已完成再评项目数:${that.riskData1.y4[p.dataIndex]}个<br>
  1278. 再评达标项目数:${that.riskData1.y5[p.dataIndex]}个
  1279. `
  1280. },
  1281. },
  1282. legend: {
  1283. show: true,
  1284. textStyle: {
  1285. fontSize: 24,
  1286. color: "rgba(255, 255, 255, .6)",
  1287. },
  1288. inactiveColor: "#fff",
  1289. itemHeight: 20,
  1290. top: "15%",
  1291. backgroundColor: "transparent",
  1292. data: [
  1293. {
  1294. name: "应首评项目数",
  1295. icon: "image://data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAUCAYAAAC58NwRAAAAAXNSR0IArs4c6QAAAWdJREFUOE+N0k8og3EYB/Dvs8P8CSlTxJGD8u+yTYmNm0gJQznIQRxMoV2cXWSKCznIQdk7SkmOEomNg41y4EjURkLZFI/ed3vX+5v82nt4357n9/s8Pe/v9xCST6+fzVHGKAMDAKqT6WsCNi2ElS0Xfak5Ul+tfi77YewBqNcLpH0vTYSOAxc9kFo5wghINus2lJMPOzl8PE6EpX8qC2lmuMmp8CmABn3FVgJ4bIloLggEnwRzRg6F4wSY9fR2J1CUnYieY0DPrgDiUvASA7pF8PGnJXsp4LEC3wx4L4DAY1pLLQq7GVjM5KcJmKC2fc76fNeOtU6GmBDOzYMt04sLmQjt2sUZRyMCjAEYBKNKyxNuAGwUA8vCaBhbcSrMxviwj1JFU7Nk3NC49iqAk+FCObAu3AngfLJCDmpmjgVwNdskB5UjPgHcrvbLQXmXVwD3O1NyYGmeFkD0aF4OCmqHBPAWXhfAL4WqeuKVsFKCAAAAAElFTkSuQmCC",
  1296. },
  1297. {
  1298. name: "已完成首评项目数",
  1299. icon: "image://data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAUCAYAAAC58NwRAAAAAXNSR0IArs4c6QAAAXFJREFUOE+V0kFLAkEUB/D/G9eW3UN1sFPYNaJAu2R0Coog8mq0fQH1kEVBhz5Ah6CoLhrdE/LqKQo6VZ7SKCKChKRTBRmhbq47oabsZC22h1nem/k93jCP8P0F+E2HQ1dD4NAAGqqn+TUI8YpciCVo8LOaoeoSKOR6GTOSxOFtFLD+OSFtmpI/obqfqFqZ6Wrqr8NNyJHJK4aPtNLDAue0+1vlnzkiHqG5YvYcwGhj08MUhJyuWhgrvyBjFq3uogp0AB2NbFR2o5sctfCNVxDWc1ag/xPQR0tLXqYg6HTBBMd++RXplpZK2Qg4dtq5NAiLNM3v5a6ilALBY4s4rvKKMdLWw4EjU4E0U3s462gwXQ3DMLeJsfpgmCYgsSVTLkSF0bC24r9NcWucHPA1izZnyXpg8vRIAMfjU/ZgLH4ogDNt1h4Mb8YEcLkSsgf9y+sCuNtaswd92qoAHuMb9qBnIiiA55M9e9DpnRfAe/pAAF9gqJXUYWdYUwAAAABJRU5ErkJggg==",
  1300. },
  1301. {
  1302. name: "应再评项目数",
  1303. icon: "image://data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAUCAYAAAC58NwRAAAAAXNSR0IArs4c6QAAAV5JREFUOE+V0j8oxGEYwPHvo/wMjgyUslAWcTFhMRiEsHLKYDzFKZRBSskgR7mUG29QjpX86QaDwdlwLotiUYpB/gyHPDru9HsPP+c3vL+e530/T8/b+wipb31KrYJ8vAi9QE0qfYqy+vBEsHtKnpM5SS4bC1qW+8amQl26gP0vcPSSQ2fXiFxJsnKhi8PfDtvgsVo0yJZfhwQCP1XOzCn4ZNuvB0BjerO4HNxtn1FsB24vDRZNggRgpdPNXsjL/4wST7AXNEDiv+DxW0slFVDTCvoG8QjcXGS2NKc+hMVsLo0yLFsBzZNnDoHaP9CJWtRn9XDA8WsOHR8PZx+NQhcDqvQhVH3klTMRVu4fWTZGw97Ktl/VHrePyVfRr1myHwhP3xnAM1nkDJbGzw0wOFvpDCa8+waYCTY5g/6esAFCax5n0NI6b4DI7qgzcDeOGSAW9TuD0up+A1zHQwZ4B2JrgI9r4uMDAAAAAElFTkSuQmCC",
  1304. },
  1305. {
  1306. name: "已完成再评项目数",
  1307. icon: "image://data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAUCAYAAAC58NwRAAAAAXNSR0IArs4c6QAAAWBJREFUOE9jZICC/1e12Rh4uDIY/jNGMjAw6ECFrzAw/l/O8OXbDEbtq79AYowg4v9jS2mGv3+3MDAwGMAMQKMvMDAz+zDKHn/KCDaZm/skHsUwvRcZfr8zZ/z/0CyX4T/DJBwmowozMuQx/n9gdpyBgcECLsNpycAgXAPhvm1hYPgOkoaDEyANPxkYGNjgQjJbGRiYRSDcv28YGJ54I2v4SUDDWwaGJ17IGr5gcZIV1El/GRjetjMwfD+G5qSHpnkM/xknEufp//mM/2+rsDOwCoGCVZ+ApksMv9+ZERtxFxmYmb3BEYeaNHgyGf7/j2FgYNCEil9nYGRcwvDly3SUpIHslP8PzP4j8xkVTsENhaclZAWvLligaBAzOIFfw9ld1igajN2O4tewar49ioawxIP4NbQ0OqNoqKnfi19DXIoHioZFc3bg12Dt6YOi4ej2Lfg1yBn7o2h4dHYjigYAb0t88hVwEBYAAAAASUVORK5CYII=",
  1308. },
  1309. {
  1310. name: "再评达标项目数",
  1311. icon: "image://data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAUCAYAAAC58NwRAAAAAXNSR0IArs4c6QAAAWBJREFUOE+V0k8og2EcwPHvkzVZLLm6KItEzWlclIPbdhGKcsCJwzZFdtgOK+8OimIXTjgoSrisXByUgz8nE4mmXFwlZmuaPXr3r/eZ9sZ7eN9+v/f5/J6n3/MTFJ9wWFpTFqYFjAFdxfSthF1blo1wWHzpOaG/gppszkIM6C4VqPheW8ATCYkXoVdOW7g0WVyy8ZSdHhFYlF4E0SqV1bTEJwKaPAd6S3/aWmHEU4j2Y/D4pJgLHWQAaykd9ENDfSH6SEJkTQGZ/4LkryO1O2DYDbkcHB7DQ6LiSAua9AlQN67SAQl+4Y3KWtt7vq1Os04JuPm04/rrxcUt4M5fnHE00jXMIBgHOor5eyQ7dd+sK6NhPEpAk9IYL4VEuWh5lowLfKE3BUS1RnMwOZtQwNaqwxwMTp0p4Gizzxz0D+0p4PRg1Bw4B1YUED+ZMwctrnkFPF8tm4OmzgkFvN5tK+AHKZh4TU8krdoAAAAASUVORK5CYII=",
  1312. },
  1313. ],
  1314. },
  1315. grid: {
  1316. top: "30%",
  1317. left: "3%",
  1318. right: "4%",
  1319. bottom: "3%",
  1320. containLabel: true,
  1321. },
  1322. xAxis: {
  1323. data: that.riskData1.x,
  1324. type: "category",
  1325. splitLine: {
  1326. show: false,
  1327. },
  1328. alignTicks: true,
  1329. axisLine: {
  1330. show: true,
  1331. lineStyle: {
  1332. color: "rgba(0, 80, 148, .8)",
  1333. },
  1334. },
  1335. axisTick: {
  1336. show: false,
  1337. },
  1338. axisLabel: {
  1339. color: "#fff",
  1340. fontSize: 22,
  1341. rotate: 20,
  1342. },
  1343. },
  1344. yAxis: {
  1345. type: "value",
  1346. splitLine: {
  1347. show: true,
  1348. lineStyle: {
  1349. color: "rgba(104, 180, 221, .2)",
  1350. type: "dashed",
  1351. },
  1352. },
  1353. axisLine: {
  1354. show: false,
  1355. },
  1356. axisTick: {
  1357. show: false,
  1358. },
  1359. axisLabel: {
  1360. color: "#fff",
  1361. fontSize: 22,
  1362. },
  1363. },
  1364. series: [
  1365. {
  1366. type: "bar",
  1367. name: "应首评项目数",
  1368. barWidth: 4,
  1369. barGap: "600%",
  1370. data: that.riskData1.y1,
  1371. label: {
  1372. show: true,
  1373. position: "top",
  1374. formatter: " ",
  1375. width: 6,
  1376. height: 6,
  1377. borderRadius: 50,
  1378. borderWidth: 6,
  1379. borderColor: "#40A9FF",
  1380. backgroundColor: "#fff",
  1381. },
  1382. itemStyle: {
  1383. color: {
  1384. x: 0,
  1385. y: 0,
  1386. x2: 0,
  1387. y2: 1,
  1388. colorStops: [
  1389. {
  1390. offset: 0,
  1391. color: "#40A9FF", // 0% 处的颜色
  1392. },
  1393. {
  1394. offset: 1,
  1395. color: "#092351", // 100% 处的颜色
  1396. },
  1397. ],
  1398. },
  1399. },
  1400. },
  1401. {
  1402. type: "bar",
  1403. name: "已完成首评项目数",
  1404. barGap: "600%",
  1405. barWidth: 4,
  1406. data: that.riskData1.y2,
  1407. label: {
  1408. show: true,
  1409. position: "top",
  1410. formatter: " ",
  1411. width: 6,
  1412. height: 6,
  1413. borderRadius: 50,
  1414. borderWidth: 6,
  1415. borderColor: "#58F7DF",
  1416. backgroundColor: "#fff",
  1417. },
  1418. itemStyle: {
  1419. color: {
  1420. x: 0,
  1421. y: 0,
  1422. x2: 0,
  1423. y2: 1,
  1424. colorStops: [
  1425. {
  1426. offset: 0,
  1427. color: "#58F7DF", // 0% 处的颜色
  1428. },
  1429. {
  1430. offset: 1,
  1431. color: "#092351", // 100% 处的颜色
  1432. },
  1433. ],
  1434. },
  1435. },
  1436. },
  1437. {
  1438. type: "bar",
  1439. name: "应再评项目数",
  1440. barGap: "600%",
  1441. barWidth: 4,
  1442. data: that.riskData1.y3,
  1443. label: {
  1444. show: true,
  1445. position: "top",
  1446. formatter: " ",
  1447. width: 6,
  1448. height: 6,
  1449. borderRadius: 50,
  1450. borderWidth: 6,
  1451. borderColor: "#B78CFF",
  1452. backgroundColor: "#fff",
  1453. },
  1454. itemStyle: {
  1455. color: {
  1456. x: 0,
  1457. y: 0,
  1458. x2: 0,
  1459. y2: 1,
  1460. colorStops: [
  1461. {
  1462. offset: 0,
  1463. color: "#B78CFF", // 0% 处的颜色
  1464. },
  1465. {
  1466. offset: 1,
  1467. color: "#092351", // 100% 处的颜色
  1468. },
  1469. ],
  1470. },
  1471. },
  1472. },
  1473. {
  1474. type: "bar",
  1475. name: "已完成再评项目数",
  1476. barGap: "600%",
  1477. barWidth: 4,
  1478. data: that.riskData1.y4,
  1479. label: {
  1480. show: true,
  1481. position: "top",
  1482. formatter: " ",
  1483. width: 6,
  1484. height: 6,
  1485. borderRadius: 50,
  1486. borderWidth: 6,
  1487. borderColor: "#FFE036",
  1488. backgroundColor: "#fff",
  1489. },
  1490. itemStyle: {
  1491. color: {
  1492. x: 0,
  1493. y: 0,
  1494. x2: 0,
  1495. y2: 1,
  1496. colorStops: [
  1497. {
  1498. offset: 0,
  1499. color: "#FFE036", // 0% 处的颜色
  1500. },
  1501. {
  1502. offset: 1,
  1503. color: "#092351", // 100% 处的颜色
  1504. },
  1505. ],
  1506. },
  1507. },
  1508. },
  1509. {
  1510. type: "bar",
  1511. name: "再评达标项目数",
  1512. barGap: "600%",
  1513. barWidth: 4,
  1514. data: that.riskData1.y5,
  1515. label: {
  1516. show: true,
  1517. position: "top",
  1518. formatter: " ",
  1519. width: 6,
  1520. height: 6,
  1521. borderRadius: 50,
  1522. borderWidth: 6,
  1523. borderColor: "#7784FF",
  1524. backgroundColor: "#fff",
  1525. },
  1526. itemStyle: {
  1527. color: {
  1528. x: 0,
  1529. y: 0,
  1530. x2: 0,
  1531. y2: 1,
  1532. colorStops: [
  1533. {
  1534. offset: 0,
  1535. color: "#7784FF", // 0% 处的颜色
  1536. },
  1537. {
  1538. offset: 1,
  1539. color: "#092351", // 100% 处的颜色
  1540. },
  1541. ],
  1542. },
  1543. },
  1544. },
  1545. ],
  1546. };
  1547. that.right4Chart.setOption(option);
  1548. tools.loopShowTooltip(that.right4Chart, option, {
  1549. interval: 2000,
  1550. loopSeries: true,
  1551. });
  1552. },
  1553. clickItem(index) {
  1554. const angle = 360 / this.investData.investList.length;
  1555. this.witchs = index;
  1556. this.inner = index;
  1557. this.innerDeg = this.witchs * angle;
  1558. this.lpRotate();
  1559. },
  1560. lpRotate() {
  1561. const angle = 360 / this.investData.investList.length;
  1562. clearInterval(this.timer);
  1563. this.timer = setInterval(() => {
  1564. this.inner++;
  1565. this.topIndex++;
  1566. this.topIndex = this.topIndex % 8;
  1567. this.witchs = this.inner % this.investData.investList.length;
  1568. this.innerDeg = this.inner * angle;
  1569. // 项目阶段分析弹窗
  1570. if (this.projectNum < 7) {
  1571. this.projectNum = this.projectNum + 1
  1572. } else {
  1573. this.projectNum = 0
  1574. }
  1575. }, 2000);
  1576. },
  1577. filterLpData() {
  1578. const angle = 360 / this.investData.investList.length;
  1579. for (let i in this.investData.investList) {
  1580. this.investData.investList[i].deg = i * angle;
  1581. this.$set(this.investData.investList, i, {
  1582. ...this.investData.investList[i],
  1583. deg: i * angle,
  1584. });
  1585. }
  1586. },
  1587. // 4秒定时器
  1588. time4s() {
  1589. let that = this;
  1590. // 4秒定时器
  1591. this.time1 = setInterval(() => {
  1592. that.industryProportion == 1
  1593. ? (that.industryProportion = 2)
  1594. : (that.industryProportion = 1);
  1595. that.leftEcharts1.dispose();
  1596. that.leftEcharts2.dispose();
  1597. that.leftEcharts3.dispose();
  1598. that.leftEcharts4.dispose();
  1599. that.leftEcharts1Fun();
  1600. that.leftEcharts2Fun();
  1601. that.leftEcharts3Fun();
  1602. that.leftEcharts4Fun();
  1603. }, 4000);
  1604. },
  1605. // 针对投前产业布局分析的定时器
  1606. timeNs() {
  1607. let that = this;
  1608. this.time2 = setInterval(() => {
  1609. if (that.industryLayout < 3) {
  1610. that.industryLayout = that.industryLayout + 1;
  1611. } else {
  1612. that.industryLayout = 0;
  1613. }
  1614. this.time2 && clearInterval(this.time2);
  1615. this.timeNs();
  1616. that.leftEcharts5.dispose();
  1617. that.leftEcharts5Fun();
  1618. }, left1[that.industryLayout].length * 2000);
  1619. },
  1620. // 主辅业占比点击方法
  1621. industryProportionChange(e) {
  1622. let that = this;
  1623. this.industryProportion = e;
  1624. this.time1 && clearInterval(this.time1);
  1625. that.leftEcharts1.dispose();
  1626. that.leftEcharts2.dispose();
  1627. that.leftEcharts3.dispose();
  1628. that.leftEcharts4.dispose();
  1629. that.leftEcharts1Fun();
  1630. that.leftEcharts2Fun();
  1631. that.leftEcharts3Fun();
  1632. that.leftEcharts4Fun();
  1633. this.time4s();
  1634. },
  1635. // 产业布局分析点击方法
  1636. industryLayoutChange(e) {
  1637. this.industryLayout = e;
  1638. this.time2 && clearInterval(this.time2);
  1639. this.leftEcharts5.dispose();
  1640. this.timeNs();
  1641. this.leftEcharts5Fun();
  1642. },
  1643. yuanChange(value) {
  1644. return Number((value / 100000000).toFixed(2));
  1645. },
  1646. // 逢三折断
  1647. numFormat(value) {
  1648. if (!value) return "0";
  1649. // var intPart = Number(value).toFixed(0) // 获取整数部分
  1650. var intPart = parseInt(value); // 获取整数部分
  1651. var intPartFormat = intPart
  1652. .toString()
  1653. .replace(/(\d)(?=(?:\d{3})+$)/g, "$1,"); // 将整数部分逢三一断
  1654. var floatPart = ".00"; // 预定义小数部分
  1655. var value2Array = value.toString().split(".");
  1656. // =2表示数据有小数位
  1657. if (value2Array.length === 2) {
  1658. floatPart = value2Array[1].toString(); // 拿到小数部分
  1659. if (floatPart.length === 1) {
  1660. // 补0
  1661. return intPartFormat + "." + floatPart + "0";
  1662. } else {
  1663. floatPart = floatPart.slice(0, 2);
  1664. return intPartFormat + "." + floatPart;
  1665. }
  1666. } else {
  1667. return intPartFormat;
  1668. }
  1669. },
  1670. leftEcharts1Fun() {
  1671. let that = this;
  1672. this.leftEcharts1 = echarts.init(this.$refs["leftEcharts1"]);
  1673. option = {
  1674. title: {
  1675. text: that.industryProportion == 1 ? "94.4%" : "46.62%",
  1676. x: "center",
  1677. y: "center",
  1678. textStyle: {
  1679. fontWeight: "normal",
  1680. color: "#68BDFF",
  1681. fontSize: "20",
  1682. },
  1683. },
  1684. color: ["#68BDFF", "#254F7F"],
  1685. series: [
  1686. {
  1687. name: "Line 1",
  1688. type: "pie",
  1689. clockWise: true,
  1690. radius: ["80%", "100%"],
  1691. itemStyle: {
  1692. normal: {
  1693. label: {
  1694. show: false,
  1695. },
  1696. labelLine: {
  1697. show: false,
  1698. },
  1699. },
  1700. },
  1701. hoverAnimation: false,
  1702. data: [
  1703. {
  1704. value: 80,
  1705. name: "01",
  1706. itemStyle: {
  1707. normal: {
  1708. label: {
  1709. show: false,
  1710. },
  1711. labelLine: {
  1712. show: false,
  1713. },
  1714. },
  1715. },
  1716. },
  1717. {
  1718. name: "02",
  1719. value: 20,
  1720. },
  1721. ],
  1722. },
  1723. ],
  1724. };
  1725. //轮播
  1726. // tools.loopShowTooltip(leftEcharts1, option, {
  1727. // interval: 2000,
  1728. // loopSeries: true,
  1729. // });
  1730. //注册
  1731. that.leftEcharts1.setOption(option);
  1732. },
  1733. leftEcharts2Fun() {
  1734. let that = this;
  1735. this.leftEcharts2 = echarts.init(this.$refs["leftEcharts2"]);
  1736. let nameList = ["a"];
  1737. let valueList = that.industryProportion == 1 ? [1287.5] : [635.84];
  1738. let total = 1363.88; // 数据总数
  1739. var category = nameList.map((item, index) => {
  1740. return {
  1741. value: valueList[index],
  1742. itemStyle: {
  1743. color: new echarts.graphic.LinearGradient(
  1744. 1,
  1745. 0,
  1746. 0,
  1747. 1,
  1748. [
  1749. {
  1750. offset: 0,
  1751. color: "#40A9FF50",
  1752. },
  1753. {
  1754. offset: 1,
  1755. color: "#40A9FF",
  1756. },
  1757. ],
  1758. false
  1759. ),
  1760. },
  1761. };
  1762. });
  1763. var totalList = [];
  1764. var totalBorderList = [];
  1765. nameList.map((item, index) => {
  1766. totalList.push({
  1767. value: total,
  1768. itemStyle: {
  1769. color: "rgba(51, 147, 236, 0.29)",
  1770. },
  1771. });
  1772. totalBorderList.push({
  1773. value: total,
  1774. itemStyle: {
  1775. borderColor: "rgba(51, 147, 236, 0.29)",
  1776. color: "transparent",
  1777. },
  1778. });
  1779. });
  1780. var datas = [];
  1781. category.forEach((value) => {
  1782. datas.push(value.value);
  1783. });
  1784. option = {
  1785. // backgroundColor: 'rgb(231,238,249)',
  1786. xAxis: {
  1787. max: total,
  1788. splitLine: {
  1789. show: false,
  1790. },
  1791. axisLine: {
  1792. show: false,
  1793. },
  1794. axisLabel: {
  1795. show: false,
  1796. },
  1797. axisTick: {
  1798. show: false,
  1799. },
  1800. },
  1801. grid: {
  1802. left: "0%",
  1803. top: "15%", // 设置条形图的边距
  1804. right: "15%",
  1805. bottom: "5%",
  1806. },
  1807. yAxis: [
  1808. {
  1809. type: "category",
  1810. inverse: false,
  1811. data: nameList,
  1812. axisLine: {
  1813. show: false,
  1814. },
  1815. axisTick: {
  1816. show: false,
  1817. },
  1818. axisLabel: {
  1819. show: false,
  1820. },
  1821. },
  1822. ],
  1823. series: [
  1824. {
  1825. // 内
  1826. type: "bar",
  1827. barWidth: 16,
  1828. barGap: "20%",
  1829. silent: true,
  1830. // label: {
  1831. // normal: {
  1832. // formatter: (item) => {
  1833. // return `${item['name']}:${item['value']} `;
  1834. // },
  1835. // textStyle: {
  1836. // color: 'rgba(105, 120, 136, 1)',
  1837. // fontSize: 14,
  1838. // },
  1839. // position: [0, '-25px'],
  1840. // show: true,
  1841. // },
  1842. // },
  1843. data: category,
  1844. z: 1,
  1845. itemStyle: {
  1846. normal: {
  1847. color: new echarts.graphic.LinearGradient(
  1848. 1,
  1849. 0,
  1850. 0,
  1851. 1,
  1852. [
  1853. {
  1854. offset: 0,
  1855. color: "rgba(81, 193, 156, 1)",
  1856. },
  1857. {
  1858. offset: 1,
  1859. color: "rgba(234, 177, 100, 1)",
  1860. },
  1861. ],
  1862. false
  1863. ),
  1864. },
  1865. },
  1866. animationEasing: "elasticOut",
  1867. },
  1868. {
  1869. // 分隔
  1870. type: "pictorialBar",
  1871. itemStyle: {
  1872. normal: {
  1873. color: "#143362",
  1874. },
  1875. },
  1876. symbolRepeat: "fixed",
  1877. symbolMargin: 8,
  1878. symbol: "rect",
  1879. symbolClip: false,
  1880. symbolSize: [4, 20],
  1881. symbolPosition: "start",
  1882. symbolOffset: [0, -2],
  1883. symbolBoundingData: total,
  1884. data: [total, total, total, total],
  1885. z: 2,
  1886. animationEasing: "elasticOut",
  1887. },
  1888. {
  1889. // label
  1890. type: "pictorialBar",
  1891. symbolBoundingData: total,
  1892. itemStyle: {
  1893. normal: {
  1894. color: "none",
  1895. },
  1896. },
  1897. label: {
  1898. normal: {
  1899. formatter: (params) => {
  1900. var text;
  1901. text = `${((params["data"] * 100) / total).toFixed(2)}亿`;
  1902. return text;
  1903. },
  1904. textStyle: {
  1905. // 图列内容样式
  1906. fontSize: "20",
  1907. fontWeight: 800,
  1908. },
  1909. position: "right",
  1910. offset: [0, -3],
  1911. distance: 10, // 向右偏移位置
  1912. show: true,
  1913. color: "#68BDFF",
  1914. },
  1915. },
  1916. data: datas,
  1917. z: 0,
  1918. },
  1919. {
  1920. name: "外框",
  1921. type: "bar",
  1922. barGap: "-130%", // 设置外框粗细
  1923. data: totalBorderList,
  1924. barWidth: 26,
  1925. itemStyle: {
  1926. normal: {
  1927. // barBorderRadius: [5, 5, 5, 5],
  1928. borderWidth: 1, // 边框宽度
  1929. borderColor: "rgb(51, 147, 236)", // 边框色
  1930. color: "rgb(231,238,249)",
  1931. },
  1932. },
  1933. z: 0,
  1934. },
  1935. ],
  1936. };
  1937. //轮播
  1938. // tools.loopShowTooltip(leftEcharts1, option, {
  1939. // interval: 2000,
  1940. // loopSeries: true,
  1941. // });
  1942. //注册
  1943. that.leftEcharts2.setOption(option);
  1944. },
  1945. leftEcharts3Fun() {
  1946. let that = this;
  1947. this.leftEcharts3 = echarts.init(this.$refs["leftEcharts3"]);
  1948. option = {
  1949. title: {
  1950. text: that.industryProportion == 1 ? "5.6%" : "53.38%",
  1951. x: "center",
  1952. y: "center",
  1953. textStyle: {
  1954. fontWeight: "normal",
  1955. color: "#68BDFF",
  1956. fontSize: "20",
  1957. },
  1958. },
  1959. color: ["#5BDCC8", "#254F7F"],
  1960. series: [
  1961. {
  1962. name: "Line 1",
  1963. type: "pie",
  1964. clockWise: true,
  1965. radius: ["80%", "100%"],
  1966. itemStyle: {
  1967. normal: {
  1968. label: {
  1969. show: false,
  1970. },
  1971. labelLine: {
  1972. show: false,
  1973. },
  1974. },
  1975. },
  1976. hoverAnimation: false,
  1977. data: [
  1978. {
  1979. value: 80,
  1980. name: "01",
  1981. itemStyle: {
  1982. normal: {
  1983. label: {
  1984. show: false,
  1985. },
  1986. labelLine: {
  1987. show: false,
  1988. },
  1989. },
  1990. },
  1991. },
  1992. {
  1993. name: "02",
  1994. value: 20,
  1995. },
  1996. ],
  1997. },
  1998. ],
  1999. };
  2000. //轮播
  2001. // tools.loopShowTooltip(leftEcharts1, option, {
  2002. // interval: 2000,
  2003. // loopSeries: true,
  2004. // });
  2005. //注册
  2006. that.leftEcharts3.setOption(option);
  2007. },
  2008. leftEcharts4Fun() {
  2009. let that = this;
  2010. this.leftEcharts4 = echarts.init(this.$refs["leftEcharts4"]);
  2011. let nameList = ["a"];
  2012. let valueList = that.industryProportion == 1 ? [76.38] : [728.04];
  2013. let total = 1363.88; // 数据总数
  2014. var category = nameList.map((item, index) => {
  2015. return {
  2016. value: valueList[index],
  2017. itemStyle: {
  2018. color: new echarts.graphic.LinearGradient(
  2019. 1,
  2020. 0,
  2021. 0,
  2022. 1,
  2023. [
  2024. {
  2025. offset: 0,
  2026. color: "#5BDCC850",
  2027. },
  2028. {
  2029. offset: 1,
  2030. color: "#5BDCC8",
  2031. },
  2032. ],
  2033. false
  2034. ),
  2035. },
  2036. };
  2037. });
  2038. var totalList = [];
  2039. var totalBorderList = [];
  2040. nameList.map((item, index) => {
  2041. totalList.push({
  2042. value: total,
  2043. itemStyle: {
  2044. color: "rgba(51, 147, 236, 0.29)",
  2045. },
  2046. });
  2047. totalBorderList.push({
  2048. value: total,
  2049. itemStyle: {
  2050. borderColor: "rgba(51, 147, 236, 0.29)",
  2051. color: "transparent",
  2052. },
  2053. });
  2054. });
  2055. var datas = [];
  2056. category.forEach((value) => {
  2057. datas.push(value.value);
  2058. });
  2059. option = {
  2060. // backgroundColor: 'rgb(231,238,249)',
  2061. xAxis: {
  2062. max: total,
  2063. splitLine: {
  2064. show: false,
  2065. },
  2066. axisLine: {
  2067. show: false,
  2068. },
  2069. axisLabel: {
  2070. show: false,
  2071. },
  2072. axisTick: {
  2073. show: false,
  2074. },
  2075. },
  2076. grid: {
  2077. left: "0%",
  2078. top: "15%", // 设置条形图的边距
  2079. right: "15%",
  2080. bottom: "5%",
  2081. },
  2082. yAxis: [
  2083. {
  2084. type: "category",
  2085. inverse: false,
  2086. data: nameList,
  2087. axisLine: {
  2088. show: false,
  2089. },
  2090. axisTick: {
  2091. show: false,
  2092. },
  2093. axisLabel: {
  2094. show: false,
  2095. },
  2096. },
  2097. ],
  2098. series: [
  2099. {
  2100. // 内
  2101. type: "bar",
  2102. barWidth: 16,
  2103. barGap: "20%",
  2104. silent: true,
  2105. // label: {
  2106. // normal: {
  2107. // formatter: (item) => {
  2108. // return `${item['name']}:${item['value']} `;
  2109. // },
  2110. // textStyle: {
  2111. // color: 'rgba(105, 120, 136, 1)',
  2112. // fontSize: 14,
  2113. // },
  2114. // position: [0, '-25px'],
  2115. // show: true,
  2116. // },
  2117. // },
  2118. data: category,
  2119. z: 1,
  2120. itemStyle: {
  2121. normal: {
  2122. color: new echarts.graphic.LinearGradient(
  2123. 1,
  2124. 0,
  2125. 0,
  2126. 1,
  2127. [
  2128. {
  2129. offset: 0,
  2130. color: "rgba(81, 193, 156, 1)",
  2131. },
  2132. {
  2133. offset: 1,
  2134. color: "rgba(234, 177, 100, 1)",
  2135. },
  2136. ],
  2137. false
  2138. ),
  2139. },
  2140. },
  2141. animationEasing: "elasticOut",
  2142. },
  2143. {
  2144. // 分隔
  2145. type: "pictorialBar",
  2146. itemStyle: {
  2147. normal: {
  2148. color: "#143362",
  2149. },
  2150. },
  2151. symbolRepeat: "fixed",
  2152. symbolMargin: 8,
  2153. symbol: "rect",
  2154. symbolClip: false,
  2155. symbolSize: [4, 20],
  2156. symbolPosition: "start",
  2157. symbolOffset: [0, -2],
  2158. symbolBoundingData: total,
  2159. data: [total, total, total, total],
  2160. z: 2,
  2161. animationEasing: "elasticOut",
  2162. },
  2163. {
  2164. // label
  2165. type: "pictorialBar",
  2166. symbolBoundingData: total,
  2167. itemStyle: {
  2168. normal: {
  2169. color: "none",
  2170. },
  2171. },
  2172. label: {
  2173. normal: {
  2174. formatter: (params) => {
  2175. var text;
  2176. text = `${((params["data"] * 100) / total).toFixed(2)}亿`;
  2177. return text;
  2178. },
  2179. textStyle: {
  2180. // 图列内容样式
  2181. fontSize: "20",
  2182. fontWeight: 800,
  2183. },
  2184. position: "right",
  2185. offset: [0, -3],
  2186. distance: 10, // 向右偏移位置
  2187. show: true,
  2188. color: "#68BDFF",
  2189. },
  2190. },
  2191. data: datas,
  2192. z: 0,
  2193. },
  2194. {
  2195. name: "外框",
  2196. type: "bar",
  2197. barGap: "-130%", // 设置外框粗细
  2198. data: totalBorderList,
  2199. barWidth: 26,
  2200. itemStyle: {
  2201. normal: {
  2202. // barBorderRadius: [5, 5, 5, 5],
  2203. borderWidth: 1, // 边框宽度
  2204. borderColor: "rgb(51, 147, 236)", // 边框色
  2205. color: "rgb(231,238,249)",
  2206. },
  2207. },
  2208. z: 0,
  2209. },
  2210. ],
  2211. };
  2212. //轮播
  2213. // tools.loopShowTooltip(leftEcharts1, option, {
  2214. // interval: 2000,
  2215. // loopSeries: true,
  2216. // });
  2217. //注册
  2218. that.leftEcharts4.setOption(option);
  2219. },
  2220. leftEcharts5Fun() {
  2221. let that = this;
  2222. this.leftEcharts5 = echarts.init(this.$refs["leftEcharts5"]);
  2223. let dataList = [];
  2224. left1[that.industryLayout].forEach((item, index) => {
  2225. dataList[index] = {
  2226. value: item.y,
  2227. name: item.name,
  2228. itemStyle: {
  2229. normal: {
  2230. color: new echarts.graphic.LinearGradient(1, 0, 0, 1, [
  2231. {
  2232. offset: 0,
  2233. color: commonColor2[index], //顶部颜色
  2234. },
  2235. {
  2236. offset: 1,
  2237. color: commonColor[index], // 底部颜色
  2238. },
  2239. ]),
  2240. borderColor: commonColor[index],
  2241. borderWidth: 3,
  2242. },
  2243. },
  2244. };
  2245. });
  2246. let option = {
  2247. tooltip: {
  2248. trigger: "item",
  2249. formatter: function (e) {
  2250. return `<span style="display:inline-block;margin-right:15px;border-radius:10px;width:20px;height:20px;background-color:${e.borderColor
  2251. };"></span>${e.name} ${e.percent}%<br>${e.value}亿 ${left1[that.industryLayout][e.seriesIndex].num
  2252. }个`;
  2253. },
  2254. backgroundColor: "rgba(50,50,50,0.7)", // 提示框浮层的背景颜色
  2255. textStyle: {
  2256. color: "#fff",
  2257. fontStyle: "normal", // 文字字体的风格('normal',无样式;'italic',斜体;'oblique',倾斜字体)
  2258. fontWeight: "normal", // 文字字体的粗细('normal',无样式;'bold',加粗;'bolder',加粗的基础上再加粗;'lighter',变细;数字定义粗细也可以,取值范围100至700)
  2259. fontSize: "28", // 文字字体大小
  2260. },
  2261. },
  2262. legend: {
  2263. top: "center",
  2264. orient: "vertical",
  2265. left: "65%",
  2266. textStyle: {
  2267. color: "#fff",
  2268. fontSize: 20,
  2269. padding: [0, 20],
  2270. },
  2271. },
  2272. graphic: {
  2273. elements: [
  2274. {
  2275. type: "image", //需要填充图片,配置image,如果不需要图片可以配置其他的, text, circle, sector, ring, polygon, polyline, rect, line, bezierCurve, arc, group,
  2276. style: {
  2277. image: "./img/whiteCircle.png", //这里添加图片地址
  2278. width: 80,
  2279. height: 80,
  2280. },
  2281. left: "37.7%", //
  2282. top: "middle", //配置图片居中
  2283. },
  2284. ],
  2285. },
  2286. series: [
  2287. {
  2288. name: "",
  2289. type: "pie",
  2290. radius: ["20%", "90%"],
  2291. center: ["41%", "50%"],
  2292. labelLine: {
  2293. normal: {
  2294. lineStyle: {
  2295. width: 1,
  2296. },
  2297. },
  2298. },
  2299. label: {
  2300. normal: {
  2301. show: false,
  2302. textStyle: {
  2303. fontSize: 28,
  2304. color: "#fff",
  2305. },
  2306. },
  2307. },
  2308. roseType: "area",
  2309. data: dataList,
  2310. },
  2311. {
  2312. tooltip: {
  2313. show: false,
  2314. },
  2315. type: "pie",
  2316. radius: ["90%", "92%"],
  2317. center: ["41%", "50%"],
  2318. hoverAnimation: false,
  2319. name: "",
  2320. data: [
  2321. {
  2322. name: "",
  2323. value: 0,
  2324. itemStyle: {
  2325. normal: {
  2326. color: "#345189",
  2327. },
  2328. },
  2329. },
  2330. ],
  2331. },
  2332. ],
  2333. };
  2334. //轮播
  2335. tools.loopShowTooltip(that.leftEcharts5, option, {
  2336. interval: 2000,
  2337. loopSeries: true,
  2338. });
  2339. //注册
  2340. that.leftEcharts5.setOption(option);
  2341. },
  2342. leftEcharts6Fun() {
  2343. let that = this;
  2344. this.leftEcharts6 = echarts.init(this.$refs["leftEcharts6"]);
  2345. var dataArr = 44;
  2346. var colorSet = {
  2347. color: "#22B95E",
  2348. };
  2349. var color1 = {
  2350. type: "linear",
  2351. x: 0,
  2352. y: 0,
  2353. x2: 1,
  2354. y2: 1,
  2355. colorStops: [
  2356. {
  2357. offset: 0,
  2358. color: "rgba(255,255,255,0.1)",
  2359. },
  2360. {
  2361. offset: 1,
  2362. color: "rgba(255,255,255,0.3)",
  2363. },
  2364. ],
  2365. global: false,
  2366. };
  2367. var color2 = {
  2368. type: "linear",
  2369. x: 0,
  2370. y: 0,
  2371. x2: 1,
  2372. y2: 1,
  2373. colorStops: [
  2374. {
  2375. offset: 0,
  2376. color: "#30DBBA",
  2377. },
  2378. {
  2379. offset: 1,
  2380. color: "#2DE696",
  2381. },
  2382. ],
  2383. global: false,
  2384. };
  2385. option = {
  2386. tooltip: {
  2387. formatter: "{a} <br/>{b} : {c}%",
  2388. },
  2389. series: [
  2390. {
  2391. name: "内部进度条",
  2392. type: "gauge",
  2393. // center: ['20%', '50%'],
  2394. radius: "50%",
  2395. splitNumber: 10,
  2396. axisLine: {
  2397. lineStyle: {
  2398. color: [
  2399. [dataArr / 100, "rgba(0,0,0,0)"],
  2400. [1, "rgba(0,0,0,0)"],
  2401. ],
  2402. width: 1,
  2403. },
  2404. },
  2405. axisLabel: {
  2406. show: false,
  2407. },
  2408. axisTick: {
  2409. show: false,
  2410. },
  2411. splitLine: {
  2412. show: false,
  2413. },
  2414. itemStyle: {
  2415. color: "#ffffff",
  2416. },
  2417. detail: {
  2418. formatter: function (value) {
  2419. if (value !== 0) {
  2420. var num = Math.round(value);
  2421. return parseInt(num).toFixed(0) + "%";
  2422. } else {
  2423. return 0;
  2424. }
  2425. },
  2426. offsetCenter: [0, 117],
  2427. textStyle: {
  2428. padding: [0, 0, 0, 0],
  2429. fontSize: 60,
  2430. color: "#58F7DF",
  2431. },
  2432. },
  2433. title: {
  2434. //标题
  2435. show: true,
  2436. offsetCenter: [0, 220], // x, y,单位px
  2437. textStyle: {
  2438. color: "#40A9FF",
  2439. fontSize: 34, //表盘上的标题文字大小
  2440. fontWeight: 400,
  2441. fontFamily: "MicrosoftYaHei",
  2442. },
  2443. },
  2444. data: [
  2445. {
  2446. name: "总额度:1,323.85亿",
  2447. value: dataArr,
  2448. itemStyle: {
  2449. fontSize: "50", //y轴上方单位的大小
  2450. color: "#FFF666",
  2451. fontFamily: "MicrosoftYaHei",
  2452. },
  2453. },
  2454. ],
  2455. pointer: {
  2456. show: true,
  2457. length: "100%",
  2458. radius: "20%",
  2459. width: 3, //指针粗细
  2460. },
  2461. animationDuration: 4000,
  2462. },
  2463. {
  2464. name: "内部阴影",
  2465. type: "gauge",
  2466. radius: "75%",
  2467. splitNumber: 10,
  2468. axisLine: {
  2469. lineStyle: {
  2470. color: [
  2471. [
  2472. dataArr / 100,
  2473. new echarts.graphic.LinearGradient(0, 1, 0, 0, [
  2474. {
  2475. offset: 0,
  2476. color: "#081947",
  2477. },
  2478. {
  2479. offset: 0.5,
  2480. color: "#5DF5A9",
  2481. },
  2482. {
  2483. offset: 1,
  2484. color: "#F6F16A",
  2485. },
  2486. ]),
  2487. ],
  2488. [1, "#0E4889"],
  2489. ],
  2490. width: 70,
  2491. },
  2492. },
  2493. axisLabel: {
  2494. show: false,
  2495. },
  2496. axisTick: {
  2497. show: false,
  2498. },
  2499. splitLine: {
  2500. show: false,
  2501. },
  2502. itemStyle: {
  2503. show: false,
  2504. },
  2505. },
  2506. {
  2507. name: "外部刻度",
  2508. type: "gauge",
  2509. // center: ['20%', '50%'],
  2510. radius: "90%",
  2511. min: 0, //最小刻度
  2512. max: 100, //最大刻度
  2513. splitNumber: 5, //刻度数量
  2514. startAngle: 225,
  2515. endAngle: -45,
  2516. axisLine: {
  2517. show: true,
  2518. lineStyle: {
  2519. width: 1,
  2520. color: [[1, "rgba(0,0,0,0)"]],
  2521. },
  2522. }, //仪表盘轴线
  2523. axisLabel: {
  2524. show: false,
  2525. color: "#ffffff",
  2526. fontSize: 28,
  2527. fontFamily: "SourceHanSansSC-Regular",
  2528. fontWeight: "bold",
  2529. // position: "top",
  2530. distance: -45,
  2531. formatter: function (v) {
  2532. switch (v + "") {
  2533. case "0":
  2534. return "0";
  2535. case "10":
  2536. return "10";
  2537. case "20":
  2538. return "20";
  2539. case "30":
  2540. return "30";
  2541. case "40":
  2542. return "40";
  2543. case "50":
  2544. return "50";
  2545. case "60":
  2546. return "60";
  2547. case "70":
  2548. return "70";
  2549. case "80":
  2550. return "80";
  2551. case "90":
  2552. return "90";
  2553. case "100":
  2554. return "100";
  2555. }
  2556. },
  2557. }, //刻度标签。
  2558. axisTick: {
  2559. show: true,
  2560. splitNumber: 10,
  2561. lineStyle: {
  2562. color: "#3798D7", //用颜色渐变函数不起作用
  2563. width: 1,
  2564. },
  2565. length: -6,
  2566. }, //刻度样式
  2567. splitLine: {
  2568. show: true,
  2569. length: -12,
  2570. lineStyle: {
  2571. color: "#3798D7", //用颜色渐变函数不起作用
  2572. },
  2573. }, //分隔线样式
  2574. detail: {
  2575. show: false,
  2576. },
  2577. },
  2578. {
  2579. //指针上的圆
  2580. type: "pie",
  2581. tooltip: {
  2582. show: false,
  2583. },
  2584. hoverAnimation: false,
  2585. legendHoverLink: false,
  2586. radius: ["0%", "4%"],
  2587. center: ["50%", "50%"],
  2588. label: {
  2589. normal: {
  2590. show: false,
  2591. },
  2592. },
  2593. labelLine: {
  2594. normal: {
  2595. show: false,
  2596. },
  2597. },
  2598. data: [
  2599. {
  2600. value: 120,
  2601. itemStyle: {
  2602. normal: {
  2603. color: "#ffffff",
  2604. },
  2605. },
  2606. },
  2607. ],
  2608. },
  2609. ],
  2610. };
  2611. //轮播
  2612. // tools.loopShowTooltip(leftEcharts1, option, {
  2613. // interval: 2000,
  2614. // loopSeries: true,
  2615. // });
  2616. //注册
  2617. that.leftEcharts6.setOption(option);
  2618. },
  2619. leftEcharts7Fun() {
  2620. let that = this;
  2621. this.leftEcharts7 = echarts.init(this.$refs["leftEcharts7"]);
  2622. let option = {
  2623. title: {
  2624. text: "固定资产进度分布",
  2625. textStyle: {
  2626. color: "#fff",
  2627. fontSize: 28,
  2628. fontWeight: 500,
  2629. fontFamily: "Microsoft YaHei",
  2630. },
  2631. top: "20",
  2632. left: "220",
  2633. },
  2634. textStyle: {
  2635. color: "#fff",
  2636. },
  2637. tooltip: {
  2638. show: false,
  2639. trigger: "axis",
  2640. formatter: function (params) {
  2641. var tip =
  2642. params[0].axisValue +
  2643. "<br/>" +
  2644. params[0].marker +
  2645. params[0].data[1] +
  2646. ":" +
  2647. params[0].data[2] +
  2648. "个," +
  2649. params[0].data[3] +
  2650. "亿元" +
  2651. "<br/>" +
  2652. params[1].marker +
  2653. params[1].data[1] +
  2654. ":" +
  2655. params[1].data[2] +
  2656. "个," +
  2657. params[1].data[3] +
  2658. "亿元";
  2659. return tip;
  2660. },
  2661. textStyle: {
  2662. color: "#ffffff", // 文字的颜色
  2663. fontSize: "20", // 文字字体大小
  2664. fontFamily: "Microsoft YaHei",
  2665. },
  2666. axisPointer: {
  2667. // lineStyle: {
  2668. // type: 'dashed',
  2669. // width: 2,
  2670. // color: 'rgba(255,255,255,0.6)'
  2671. // },
  2672. animation: false,
  2673. },
  2674. },
  2675. grid: {
  2676. top: "0%",
  2677. right: "5%",
  2678. left: "15%",
  2679. bottom: "-10%",
  2680. },
  2681. yAxis: {
  2682. data: ["备案", "特别监管"],
  2683. splitLine: {
  2684. show: false,
  2685. lineStyle: {
  2686. color: "#68b4dd66",
  2687. type: "dashed",
  2688. },
  2689. },
  2690. axisLine: {
  2691. show: false,
  2692. },
  2693. axisLabel: {
  2694. show: true,
  2695. formatter: "{value}",
  2696. textStyle: {
  2697. color: function (data) {
  2698. if (data == "特别监管") {
  2699. return "#40A9FF";
  2700. } else if (data == "备案") {
  2701. return "#5BDCC8";
  2702. }
  2703. },
  2704. fontSize: 20,
  2705. padding: [0, -10, 0, 0],
  2706. fontFamily: "Microsoft YaHei",
  2707. },
  2708. },
  2709. nameTextStyle: {
  2710. color: "#ebf8ac",
  2711. fontSize: 16,
  2712. fontFamily: "Microsoft YaHei",
  2713. },
  2714. },
  2715. xAxis: {
  2716. data: ["项目储备", "项目立项", "可研论证", "投资决策"],
  2717. axisLine: {
  2718. show: true, //隐藏X轴轴线
  2719. lineStyle: {
  2720. color: "red",
  2721. width: 1,
  2722. },
  2723. },
  2724. axisTick: {
  2725. show: false, //隐藏X轴刻度
  2726. },
  2727. axisLabel: {
  2728. show: true,
  2729. textStyle: {
  2730. color: "#fff", //X轴文字颜色
  2731. fontSize: 20,
  2732. padding: [-80, 0, 0, 0],
  2733. fontFamily: "Microsoft YaHei",
  2734. },
  2735. },
  2736. },
  2737. series: [
  2738. {
  2739. name: "特别监管",
  2740. type: "scatter",
  2741. symbol: "circle", //'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow'
  2742. symbolSize: function (data) {
  2743. return Math.sqrt(data[2]) * 5;
  2744. },
  2745. // label: {
  2746. // emphasis: {
  2747. // show: true,
  2748. // formatter: function (param) {
  2749. // return param.data[2];
  2750. // },
  2751. // position: 'top'
  2752. // }
  2753. // },
  2754. itemStyle: {
  2755. normal: {
  2756. color: "#69c0ff",
  2757. },
  2758. },
  2759. // data: left13[0]
  2760. },
  2761. {
  2762. name: "备案",
  2763. type: "scatter",
  2764. symbol: "circle", //'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow'
  2765. symbolSize: function (data) {
  2766. return Math.sqrt(data[2]) * 5;
  2767. },
  2768. // label: {
  2769. // emphasis: {
  2770. // show: true,
  2771. // formatter: function (param) {
  2772. // return param.data[2];
  2773. // },
  2774. // position: 'top'
  2775. // }
  2776. // },
  2777. itemStyle: {
  2778. normal: {
  2779. color: "#957DFF",
  2780. },
  2781. },
  2782. // data: left13[1]
  2783. },
  2784. ],
  2785. };
  2786. //轮播
  2787. // tools.loopShowTooltip(leftEcharts1, option, {
  2788. // interval: 2000,
  2789. // loopSeries: true,
  2790. // });
  2791. //注册
  2792. that.leftEcharts7.setOption(option);
  2793. },
  2794. leftEcharts8Fun() {
  2795. let that = this;
  2796. this.leftEcharts8 = echarts.init(this.$refs["leftEcharts8"]);
  2797. let option = {
  2798. title: {
  2799. text: "固定资产进度分布",
  2800. textStyle: {
  2801. color: "#fff",
  2802. fontSize: 28,
  2803. fontWeight: 500,
  2804. fontFamily: "Microsoft YaHei",
  2805. },
  2806. top: "20",
  2807. left: "220",
  2808. },
  2809. textStyle: {
  2810. color: "#fff",
  2811. },
  2812. tooltip: {
  2813. show: false,
  2814. trigger: "axis",
  2815. formatter: function (params) {
  2816. var tip =
  2817. params[0].axisValue +
  2818. "<br/>" +
  2819. params[0].marker +
  2820. params[0].data[1] +
  2821. ":" +
  2822. params[0].data[2] +
  2823. "个," +
  2824. params[0].data[3] +
  2825. "亿元" +
  2826. "<br/>" +
  2827. params[1].marker +
  2828. params[1].data[1] +
  2829. ":" +
  2830. params[1].data[2] +
  2831. "个," +
  2832. params[1].data[3] +
  2833. "亿元";
  2834. return tip;
  2835. },
  2836. textStyle: {
  2837. color: "#ffffff", // 文字的颜色
  2838. fontSize: "20", // 文字字体大小
  2839. fontFamily: "Microsoft YaHei",
  2840. },
  2841. axisPointer: {
  2842. // lineStyle: {
  2843. // type: 'dashed',
  2844. // width: 2,
  2845. // color: 'rgba(255,255,255,0.6)'
  2846. // },
  2847. animation: false,
  2848. },
  2849. },
  2850. grid: {
  2851. top: "0%",
  2852. right: "5%",
  2853. left: "15%",
  2854. bottom: "-10%",
  2855. },
  2856. yAxis: {
  2857. data: ["备案", "特别监管"],
  2858. splitLine: {
  2859. show: false,
  2860. lineStyle: {
  2861. color: "#68b4dd66",
  2862. type: "dashed",
  2863. },
  2864. },
  2865. axisLine: {
  2866. show: false,
  2867. },
  2868. axisLabel: {
  2869. show: false,
  2870. formatter: "{value}",
  2871. textStyle: {
  2872. color: "#fff",
  2873. fontSize: 20,
  2874. padding: [0, -10, 0, 0],
  2875. fontFamily: "Microsoft YaHei",
  2876. },
  2877. },
  2878. nameTextStyle: {
  2879. color: "#ebf8ac",
  2880. fontSize: 16,
  2881. fontFamily: "Microsoft YaHei",
  2882. },
  2883. },
  2884. xAxis: {
  2885. data: ["项目储备", "项目立项", "可研论证", "投资决策"],
  2886. axisLine: {
  2887. show: true, //隐藏X轴轴线
  2888. lineStyle: {
  2889. color: "red",
  2890. width: 1,
  2891. },
  2892. },
  2893. axisTick: {
  2894. show: false, //隐藏X轴刻度
  2895. },
  2896. axisLabel: {
  2897. show: true,
  2898. textStyle: {
  2899. color: "#fff", //X轴文字颜色
  2900. fontSize: 20,
  2901. padding: [-80, 0, 0, 0],
  2902. fontFamily: "Microsoft YaHei",
  2903. },
  2904. },
  2905. },
  2906. series: [
  2907. {
  2908. name: "特别监管",
  2909. type: "scatter",
  2910. symbol: "circle", //'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow'
  2911. symbolSize: function (data) {
  2912. return Math.sqrt(data[2]) * 5;
  2913. },
  2914. // label: {
  2915. // emphasis: {
  2916. // show: true,
  2917. // formatter: function (param) {
  2918. // return param.data[2];
  2919. // },
  2920. // position: 'top'
  2921. // }
  2922. // },
  2923. itemStyle: {
  2924. normal: {
  2925. color: "#69c0ff",
  2926. },
  2927. },
  2928. // data: left13[0]
  2929. },
  2930. {
  2931. name: "备案",
  2932. type: "scatter",
  2933. symbol: "circle", //'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow'
  2934. symbolSize: function (data) {
  2935. return Math.sqrt(data[2]) * 5;
  2936. },
  2937. // label: {
  2938. // emphasis: {
  2939. // show: true,
  2940. // formatter: function (param) {
  2941. // return param.data[2];
  2942. // },
  2943. // position: 'top'
  2944. // }
  2945. // },
  2946. itemStyle: {
  2947. normal: {
  2948. color: "#957DFF",
  2949. },
  2950. },
  2951. // data: left13[1]
  2952. },
  2953. ],
  2954. };
  2955. //轮播
  2956. // tools.loopShowTooltip(leftEcharts1, option, {
  2957. // interval: 2000,
  2958. // loopSeries: true,
  2959. // });
  2960. //注册
  2961. that.leftEcharts8.setOption(option);
  2962. },
  2963. shanxiEchartsFun() {
  2964. let that = this;
  2965. this.geoCoordMap = [];
  2966. /*获取地图数据*/
  2967. this.shanxiMap = echarts.init(this.$refs["shanxi"]);
  2968. // echarts.registerMap('china', china)
  2969. echarts.registerMap("china", shanxi);
  2970. // var mapFeatures = echarts.getMap('china').geoJson.features
  2971. // mapFeatures.forEach(v => {
  2972. // // 地区名称
  2973. // var name = v.properties.name
  2974. // // 地区经纬度
  2975. // this.geoCoordMap[name] = v.properties.cp
  2976. // data.push({ name: v.properties.name, value: v.properties.cp[0], value2: v.properties.cp[1] })
  2977. // })
  2978. var data = [
  2979. { name: "大同市", value: 6035, value2: 28 },
  2980. { name: "朔州市", value: 3361, value2: 13 },
  2981. { name: "忻州市", value: 7335, value2: 25 },
  2982. { name: "吕梁市", value: 10904, value2: 45 },
  2983. { name: "太原市", value: 25167, value2: 113 },
  2984. { name: "阳泉市", value: 2512, value2: 28 },
  2985. { name: "晋中市", value: 14857, value2: 52 },
  2986. { name: "临汾市", value: 13055, value2: 30 },
  2987. { name: "长治市", value: 10300, value2: 23 },
  2988. { name: "运城市", value: 4106, value2: 23 },
  2989. { name: "晋城市", value: 4543, value2: 31 },
  2990. ];
  2991. var geoCoordMap = {
  2992. 太原市: [112.53, 37.87],
  2993. 大同市: [113.3, 40.12],
  2994. 阳泉市: [113.57, 37.85],
  2995. 长治市: [113.08, 36.18],
  2996. 晋城市: [112.83, 35.52],
  2997. 朔州市: [112.43, 39.33],
  2998. 晋中市: [112.94, 37.4],
  2999. 运城市: [110.97, 35.03],
  3000. 忻州市: [112.53, 38.72],
  3001. 临汾市: [111.5, 36.08],
  3002. 吕梁市: [111.13, 37.52],
  3003. };
  3004. var convertData = function (data) {
  3005. var res = [];
  3006. for (var i = 0; i < data.length; i++) {
  3007. var geoCoord = geoCoordMap[data[i].name];
  3008. if (geoCoord) {
  3009. res.push({
  3010. name: data[i].name,
  3011. value: geoCoord.concat(data[i].value, data[i].value2),
  3012. });
  3013. }
  3014. }
  3015. return res;
  3016. };
  3017. var convertedData = [
  3018. convertData(data),
  3019. convertData(
  3020. data
  3021. .sort(function (a, b) {
  3022. return b.value - a.value;
  3023. })
  3024. .slice(0, 6)
  3025. ),
  3026. ];
  3027. data.sort(function (a, b) {
  3028. return a.value - b.value;
  3029. });
  3030. option = {
  3031. backgroundColor: "#404a5900",
  3032. animation: true,
  3033. animationDuration: 1000,
  3034. animationEasing: "cubicInOut",
  3035. animationDurationUpdate: 1000,
  3036. animationEasingUpdate: "cubicInOut",
  3037. geo: {
  3038. map: "china",
  3039. center: [112.53, 37.67],
  3040. zoom: 4.5,
  3041. label: {
  3042. emphasis: {
  3043. show: false,
  3044. },
  3045. },
  3046. roam: false,
  3047. itemStyle: {
  3048. normal: {
  3049. borderColor: "#7fb3ff",
  3050. borderWidth: 3,
  3051. areaColor: {
  3052. type: "radial",
  3053. x: 0.5,
  3054. y: 0.5,
  3055. r: 0.8,
  3056. colorStops: [
  3057. {
  3058. offset: 0,
  3059. color: "#468ff8", // 0% 处的颜色
  3060. },
  3061. {
  3062. offset: 1,
  3063. color: "#0a2c6d", // 100% 处的颜色
  3064. },
  3065. ],
  3066. globalCoord: false, // 缺省为 false
  3067. },
  3068. // shadowColor: 'rgba(128, 217, 248, 1)',
  3069. shadowColor: "#468ff8",
  3070. shadowOffsetX: -2,
  3071. shadowOffsetY: 2,
  3072. shadowBlur: 20,
  3073. },
  3074. emphasis: {
  3075. areaColor: {
  3076. colorStops: [
  3077. {
  3078. offset: 0,
  3079. color: "#3844aa", // 0% 处的颜色
  3080. },
  3081. {
  3082. offset: 1,
  3083. color: "#7284fc", // 100% 处的颜色
  3084. },
  3085. ],
  3086. },
  3087. borderColor: "#b3baff",
  3088. borderWidth: 5,
  3089. },
  3090. },
  3091. tooltip: {
  3092. trigger: "item",
  3093. className: "custom-tooltip-box",
  3094. confine: true, // 不超出当前表
  3095. formatter: (params, ticket, callback) => {
  3096. // 清空所有轮播
  3097. for (var k in geoCoordMap) {
  3098. that.shanxiMap.dispatchAction({
  3099. // type: 'geoUnSelect',
  3100. type: "downplay",
  3101. name: k,
  3102. geoIndex: 0,
  3103. });
  3104. that.shanxiMap.dispatchAction({
  3105. // type: 'geoUnSelect',
  3106. type: "downplay",
  3107. name: k,
  3108. seriesName: params.seriesName,
  3109. });
  3110. that.shanxiMap.dispatchAction({
  3111. // type: 'geoUnSelect',
  3112. type: "downplay",
  3113. name: k,
  3114. seriesName: "series\u00001",
  3115. });
  3116. }
  3117. that.shanxiMap.dispatchAction({
  3118. // type: 'geoSelect',
  3119. type: "highlight",
  3120. name: params.name,
  3121. geoIndex: 0,
  3122. });
  3123. that.shanxiMap.dispatchAction({
  3124. // type: 'geoSelect',
  3125. type: "highlight",
  3126. name: params.name,
  3127. seriesName: params.seriesName,
  3128. });
  3129. that.shanxiMap.dispatchAction({
  3130. // type: 'geoSelect',
  3131. type: "highlight",
  3132. name: params.name,
  3133. seriesName: "series\u00001",
  3134. });
  3135. return `<div class="bgTooltip" style="background: url('../img/shanxi/${params.name}.png') no-repeat center center;background-size: 100% 100%;font-size:36px">
  3136. <div class="flex items-center">
  3137. <img src="./img/yellowArrow.png" style="width: 12px;height: 22px;margin-right:10px" alt=""><span class="fb">${params.name}</span>
  3138. </div>
  3139. <div class="blueIcon flex items-center">项目数量:<span class="fb" style="color:#68BDFF;">${params.value[3]}<span style="font-size:20px" class="fn">个</span></span></div>
  3140. <div class="blueIcon flex items-center">投资总额:<span class="fb" style="color:#68BDFF">${params.value[2]}<span style="font-size:20px" class="fn">亿</span></span></div>
  3141. </div>`;
  3142. },
  3143. },
  3144. regions: [
  3145. {
  3146. name: "太原市",
  3147. value: 2000,
  3148. itemStyle: {
  3149. emphasis: {
  3150. borderColor: "#ffe036",
  3151. borderWidth: 5,
  3152. areaColor: {
  3153. type: "radial",
  3154. x: 0.5,
  3155. y: 0.5,
  3156. r: 0.8,
  3157. colorStops: [
  3158. {
  3159. offset: 0,
  3160. color: "#ffe036", // 0% 处的颜色
  3161. },
  3162. {
  3163. offset: 1,
  3164. color: "#7c732a", // 100% 处的颜色
  3165. },
  3166. ],
  3167. globalCoord: false, // 缺省为 false
  3168. },
  3169. },
  3170. },
  3171. },
  3172. {
  3173. name: "南海诸岛",
  3174. itemStyle: {
  3175. // 隐藏地图
  3176. normal: {
  3177. opacity: 0, // 为 0 时不绘制该图形
  3178. },
  3179. },
  3180. label: {
  3181. show: false, // 隐藏文字
  3182. },
  3183. },
  3184. ],
  3185. },
  3186. tooltip: {
  3187. trigger: "item",
  3188. className: "custom-tooltip-box",
  3189. confine: true, // 不超出当前表
  3190. formatter: (e) => {
  3191. console.log('走了这里了', e)
  3192. }
  3193. },
  3194. xAxis: {
  3195. type: "value",
  3196. scale: true,
  3197. position: "top",
  3198. boundaryGap: false,
  3199. splitLine: {
  3200. show: false,
  3201. },
  3202. axisLine: {
  3203. show: false,
  3204. },
  3205. axisTick: {
  3206. show: false,
  3207. },
  3208. axisLabel: {
  3209. margin: 2,
  3210. textStyle: {
  3211. color: "#aaa",
  3212. },
  3213. },
  3214. },
  3215. yAxis: {
  3216. type: "category",
  3217. nameGap: 16,
  3218. axisLine: {
  3219. show: false,
  3220. lineStyle: {
  3221. color: "#ddd",
  3222. },
  3223. },
  3224. axisTick: {
  3225. show: false,
  3226. lineStyle: {
  3227. color: "#ddd",
  3228. },
  3229. },
  3230. axisLabel: {
  3231. interval: 0,
  3232. textStyle: {
  3233. color: "#ddd",
  3234. },
  3235. },
  3236. data: categoryData,
  3237. },
  3238. series: [
  3239. {
  3240. type: "effectScatter",
  3241. colorBy: "data",
  3242. coordinateSystem: "geo",
  3243. data: convertedData[0],
  3244. symbolSize: function (val) {
  3245. return Math.max(val[2] / 500, 8);
  3246. },
  3247. showEffectOn: "emphasis",
  3248. rippleEffect: {
  3249. brushType: "stroke",
  3250. color: "#58F7DF",
  3251. },
  3252. hoverAnimation: true,
  3253. label: {
  3254. normal: {
  3255. formatter: "{b}",
  3256. position: "right",
  3257. show: true,
  3258. fontSize: "30",
  3259. color: "#fff",
  3260. },
  3261. },
  3262. itemStyle: {
  3263. normal: {
  3264. color: "#ffc809",
  3265. shadowBlur: 50,
  3266. shadowColor: "#ffc809",
  3267. },
  3268. emphasis: {
  3269. color: "#58F7DF",
  3270. shadowBlur: 50,
  3271. shadowColor: "#58F7DF",
  3272. },
  3273. },
  3274. zlevel: 99,
  3275. },
  3276. {
  3277. type: "effectScatter",
  3278. colorBy: "data",
  3279. coordinateSystem: "geo",
  3280. data: [
  3281. {
  3282. name: "太原市",
  3283. value: [112.53, 37.87, 25167, 113],
  3284. },
  3285. ],
  3286. symbolSize: function (val) {
  3287. return Math.max(val[2] / 500, 8);
  3288. },
  3289. showEffectOn: "emphasis",
  3290. rippleEffect: {
  3291. brushType: "stroke",
  3292. color: "#DF62F2",
  3293. },
  3294. hoverAnimation: true,
  3295. label: {
  3296. normal: {
  3297. formatter: "{b}",
  3298. position: "right",
  3299. show: true,
  3300. fontSize: "30",
  3301. color: "#fff",
  3302. },
  3303. },
  3304. itemStyle: {
  3305. normal: {
  3306. color: "#ffc809",
  3307. shadowBlur: 50,
  3308. shadowColor: "#ffc809",
  3309. },
  3310. emphasis: {
  3311. color: "#DF62F2",
  3312. shadowBlur: 50,
  3313. shadowColor: "#DF62F2",
  3314. },
  3315. },
  3316. zlevel: 999,
  3317. },
  3318. ],
  3319. };
  3320. var categoryData = [];
  3321. var barData = [];
  3322. var sum = 0;
  3323. for (var i = 0; i < data.length; i++) {
  3324. categoryData.push(data[i].name);
  3325. barData.push(data[i].value);
  3326. sum += data[i].value;
  3327. }
  3328. // this.shanxiMap.on('click', function (params) {
  3329. // if (params.name == '山西') {
  3330. // that.shanxiMap.dispose()
  3331. // that.centerShow = true
  3332. // setTimeout(() => {
  3333. // })
  3334. // }
  3335. // })
  3336. tools.loopShowTooltip(this.shanxiMap, option, {
  3337. interval: 2000,
  3338. loopSeries: false,
  3339. seriesIndex: 0,
  3340. });
  3341. this.shanxiMap.setOption(option);
  3342. },
  3343. chinaEchartsFun() {
  3344. let that = this;
  3345. this.geoCoordMap = [];
  3346. /*获取地图数据*/
  3347. this.chinaMap = echarts.init(this.$refs["china"]);
  3348. echarts.registerMap("china", china);
  3349. // var mapFeatures = echarts.getMap('china').geoJson.features
  3350. // mapFeatures.forEach(v => {
  3351. // // 地区名称
  3352. // var name = v.properties.name
  3353. // // 地区经纬度
  3354. // this.geoCoordMap[name] = v.properties.cp
  3355. // data.push({ name: v.properties.name, value: v.properties.cp[0], value2: v.properties.cp[1] })
  3356. // })
  3357. var data = [
  3358. { "name": "新疆", value: 29780, value2: 80 },
  3359. { "name": "西藏", value: 2186, value2: 80 },
  3360. { "name": "内蒙古", value: 1135, value2: 80 },
  3361. { "name": "青海", value: 29780, value2: 80 },
  3362. { "name": "四川", value: 2568, value2: 80 },
  3363. { "name": "黑龙江", value: 29780, value2: 80 },
  3364. { "name": "甘肃", value: 6959, value2: 80 },
  3365. { "name": "云南", value: 5632, value2: 80 },
  3366. { "name": "广西", value: 6707, value2: 80 },
  3367. { "name": "湖南", value: 29780, value2: 80 },
  3368. { "name": "陕西", value: 1894, value2: 80 },
  3369. { "name": "广东", value: 15769, value2: 80 },
  3370. { "name": "吉林", value: 8259, value2: 80 },
  3371. { "name": "河北", value: 5741, value2: 80 },
  3372. { "name": "湖北", value: 3030, value2: 80 },
  3373. { "name": "贵州", value: 4542, value2: 80 },
  3374. { "name": "山东", value: 19780, value2: 80 },
  3375. { "name": "江西", value: 3157, value2: 80 },
  3376. { "name": "河南", value: 6690, value2: 80 },
  3377. { "name": "辽宁", value: 8678, value2: 80 },
  3378. { "name": "山西", value: 5303, value2: 80 },
  3379. { "name": "安徽", value: 29780, value2: 80 },
  3380. { "name": "福建", value: 10259, value2: 80 },
  3381. { "name": "浙江", value: 3016, value2: 80 },
  3382. { "name": "江苏", value: 3202, value2: 80 },
  3383. { "name": "重庆", value: 4540, value2: 80 },
  3384. { "name": "宁夏", value: 19780, value2: 80 },
  3385. { "name": "海南", value: 8626, value2: 80 },
  3386. { "name": "台湾", value: 4361, value2: 80 },
  3387. { "name": "北京", value: 20000, value2: 80 },
  3388. { "name": "天津", value: 4080, value2: 80 },
  3389. { "name": "上海", value: 19780, value2: 80 },
  3390. { "name": "香港", value: 6991, value2: 80 },
  3391. { "name": "澳门", value: 13873, value2: 80 },
  3392. ];
  3393. var geoCoordMap = {
  3394. "新疆": [86.9023, 41.148],
  3395. "西藏": [87.8695, 31.6846],
  3396. "内蒙古": [110.5977, 41.3408],
  3397. "青海": [95.2402, 35.4199],
  3398. "四川": [102.9199, 30.1904],
  3399. "黑龙江": [128.1445, 46.7156],
  3400. "甘肃": [102.7129, 38.166],
  3401. "云南": [101.0652, 24.6807],
  3402. "广西": [108.7813, 23.6426],
  3403. "湖南": [111.5332, 27.3779],
  3404. "陕西": [108.5996, 33.7396],
  3405. "广东": [113.8668, 22.8076],
  3406. "吉林": [126.1746, 43.5938],
  3407. "河北": [115.4004, 38.1688],
  3408. "湖北": [112.2363, 30.8572],
  3409. "贵州": [106.6113, 26.6385],
  3410. "山东": [118.2402, 36.2307],
  3411. "江西": [115.7156, 27.99],
  3412. "河南": [113.0668, 33.8818],
  3413. "辽宁": [123.0438, 41.0889],
  3414. "山西": [112.44, 37.73],
  3415. "安徽": [117.2461, 31.0361],
  3416. "福建": [118.3008, 25.9277],
  3417. "浙江": [120.498, 29.0918],
  3418. "江苏": [119.8586, 32.915],
  3419. "重庆": [107.7539, 29.8904],
  3420. "宁夏": [105.9961, 37.1096],
  3421. "海南": [109.9512, 19.2041],
  3422. "台湾": [120.8254, 23.5986],
  3423. "北京": [116.4551, 40.2539],
  3424. "天津": [117.4219, 39.4189],
  3425. "上海": [121.4648, 31.2891],
  3426. "香港": [114.6178, 22.3242],
  3427. "澳门": [113.5547, 21.6484],
  3428. '南海诸岛': [128.8254, 21.5986]
  3429. };
  3430. var convertData = function (data) {
  3431. var res = [];
  3432. for (var i = 0; i < data.length; i++) {
  3433. var geoCoord = geoCoordMap[data[i].name];
  3434. if (geoCoord) {
  3435. res.push({
  3436. name: data[i].name,
  3437. value: geoCoord.concat(data[i].value, data[i].value2),
  3438. });
  3439. }
  3440. }
  3441. return res;
  3442. };
  3443. var convertedData = [
  3444. convertData(data),
  3445. convertData(
  3446. data
  3447. .sort(function (a, b) {
  3448. return b.value - a.value;
  3449. })
  3450. .slice(0, 6)
  3451. ),
  3452. ];
  3453. data.sort(function (a, b) {
  3454. return a.value - b.value;
  3455. });
  3456. option = {
  3457. animation: true,
  3458. animationDuration: 1000,
  3459. animationEasing: "cubicInOut",
  3460. animationDurationUpdate: 1000,
  3461. animationEasingUpdate: "cubicInOut",
  3462. geo: {
  3463. map: "china",
  3464. zoom: 0.9,
  3465. label: {
  3466. emphasis: {
  3467. show: false,
  3468. },
  3469. },
  3470. roam: false,
  3471. itemStyle: {
  3472. normal: {
  3473. borderColor: "#7fb3ff",
  3474. borderWidth: 3,
  3475. areaColor: {
  3476. type: "radial",
  3477. x: 0.5,
  3478. y: 0.5,
  3479. r: 0.8,
  3480. colorStops: [
  3481. {
  3482. offset: 0,
  3483. color: "#468ff8", // 0% 处的颜色
  3484. },
  3485. {
  3486. offset: 1,
  3487. color: "#0a2c6d", // 100% 处的颜色
  3488. },
  3489. ],
  3490. globalCoord: false, // 缺省为 false
  3491. },
  3492. // shadowColor: 'rgba(128, 217, 248, 1)',
  3493. shadowColor: "#468ff8",
  3494. shadowOffsetX: -2,
  3495. shadowOffsetY: 2,
  3496. shadowBlur: 20,
  3497. },
  3498. emphasis: {
  3499. areaColor: {
  3500. colorStops: [
  3501. {
  3502. offset: 0,
  3503. color: "#3844aa", // 0% 处的颜色
  3504. },
  3505. {
  3506. offset: 1,
  3507. color: "#7284fc", // 100% 处的颜色
  3508. },
  3509. ],
  3510. },
  3511. borderColor: "#b3baff",
  3512. borderWidth: 5,
  3513. },
  3514. },
  3515. tooltip: {
  3516. trigger: "item",
  3517. className: "custom-tooltip-box",
  3518. confine: true, // 不超出当前表
  3519. formatter: (params, ticket, callback) => {
  3520. // console.log(params, '走了这里了')
  3521. // 清空所有轮播
  3522. for (var k in geoCoordMap) {
  3523. that.chinaMap.dispatchAction({
  3524. // type: 'geoUnSelect',
  3525. type: "downplay",
  3526. name: k,
  3527. geoIndex: 0,
  3528. });
  3529. that.chinaMap.dispatchAction({
  3530. // type: 'geoUnSelect',
  3531. type: "downplay",
  3532. name: k,
  3533. seriesName: params.seriesName,
  3534. });
  3535. that.chinaMap.dispatchAction({
  3536. // type: 'geoUnSelect',
  3537. type: "downplay",
  3538. name: k,
  3539. seriesName: "series\u00001",
  3540. });
  3541. }
  3542. that.chinaMap.dispatchAction({
  3543. // type: 'geoSelect',
  3544. type: "highlight",
  3545. name: params.name,
  3546. geoIndex: 0,
  3547. });
  3548. that.chinaMap.dispatchAction({
  3549. // type: 'geoSelect',
  3550. type: "highlight",
  3551. name: params.name,
  3552. seriesName: params.seriesName,
  3553. });
  3554. that.chinaMap.dispatchAction({
  3555. // type: 'geoSelect',
  3556. type: "highlight",
  3557. name: params.name,
  3558. seriesName: "series\u00001",
  3559. });
  3560. return `<div class="bgTooltip" style="background: rgba(50,50,50,0.7);font-size:36px">
  3561. <div class="flex items-center">
  3562. <img src="./img/yellowArrow.png" style="width: 12px;height: 22px;margin-right:10px" alt=""><span class="fb">${params.name}</span>
  3563. </div>
  3564. <div class="blueIcon flex items-center">项目数量:<span class="fb" style="color:#68BDFF;">${params.value[3]}<span style="font-size:20px" class="fn">个</span></span></div>
  3565. <div class="blueIcon flex items-center">投资总额:<span class="fb" style="color:#68BDFF">${params.value[2]}<span style="font-size:20px" class="fn">亿</span></span></div>
  3566. </div>`;
  3567. },
  3568. },
  3569. regions: [
  3570. {
  3571. name: "山西",
  3572. value: 2000,
  3573. itemStyle: {
  3574. emphasis: {
  3575. borderColor: "#ffe036",
  3576. borderWidth: 5,
  3577. areaColor: {
  3578. type: "radial",
  3579. x: 0.5,
  3580. y: 0.5,
  3581. r: 0.8,
  3582. colorStops: [
  3583. {
  3584. offset: 0,
  3585. color: "#ffe036", // 0% 处的颜色
  3586. },
  3587. {
  3588. offset: 1,
  3589. color: "#7c732a", // 100% 处的颜色
  3590. },
  3591. ],
  3592. globalCoord: false, // 缺省为 false
  3593. },
  3594. },
  3595. },
  3596. },
  3597. // {
  3598. // name: "南海诸岛",
  3599. // itemStyle: {
  3600. // // 隐藏地图
  3601. // normal: {
  3602. // opacity: 0, // 为 0 时不绘制该图形
  3603. // },
  3604. // },
  3605. // label: {
  3606. // show: false, // 隐藏文字
  3607. // },
  3608. // },
  3609. ],
  3610. },
  3611. tooltip: {
  3612. trigger: "item",
  3613. className: "custom-tooltip-box",
  3614. confine: true, // 不超出当前表
  3615. },
  3616. xAxis: {
  3617. type: "value",
  3618. scale: true,
  3619. position: "top",
  3620. boundaryGap: false,
  3621. splitLine: {
  3622. show: false,
  3623. },
  3624. axisLine: {
  3625. show: false,
  3626. },
  3627. axisTick: {
  3628. show: false,
  3629. },
  3630. axisLabel: {
  3631. margin: 2,
  3632. textStyle: {
  3633. color: "#aaa",
  3634. },
  3635. },
  3636. },
  3637. yAxis: {
  3638. type: "category",
  3639. nameGap: 16,
  3640. axisLine: {
  3641. show: false,
  3642. lineStyle: {
  3643. color: "#ddd",
  3644. },
  3645. },
  3646. axisTick: {
  3647. show: false,
  3648. lineStyle: {
  3649. color: "#ddd",
  3650. },
  3651. },
  3652. axisLabel: {
  3653. interval: 0,
  3654. textStyle: {
  3655. color: "#ddd",
  3656. },
  3657. },
  3658. data: categoryData,
  3659. },
  3660. series: [
  3661. {
  3662. type: "effectScatter",
  3663. colorBy: "data",
  3664. coordinateSystem: "geo",
  3665. data: convertedData[0],
  3666. symbolSize: function (val) {
  3667. return Math.max(val[2] / 500, 8);
  3668. },
  3669. showEffectOn: "emphasis",
  3670. rippleEffect: {
  3671. brushType: "stroke",
  3672. color: "#58F7DF",
  3673. },
  3674. hoverAnimation: true,
  3675. label: {
  3676. normal: {
  3677. formatter: "{b}",
  3678. position: "right",
  3679. show: true,
  3680. fontSize: "30",
  3681. color: "#fff",
  3682. },
  3683. },
  3684. itemStyle: {
  3685. normal: {
  3686. color: "#ffc809",
  3687. shadowBlur: 50,
  3688. shadowColor: "#ffc809",
  3689. },
  3690. emphasis: {
  3691. color: "#58F7DF",
  3692. shadowBlur: 50,
  3693. shadowColor: "#58F7DF",
  3694. },
  3695. },
  3696. zlevel: 99,
  3697. },
  3698. {
  3699. type: "effectScatter",
  3700. colorBy: "data",
  3701. coordinateSystem: "geo",
  3702. data: [
  3703. {
  3704. name: "山西",
  3705. value: [112.43, 37.73, 5303, 80],
  3706. },
  3707. ],
  3708. symbolSize: function (val) {
  3709. return Math.max(val[2] / 500, 8);
  3710. },
  3711. showEffectOn: "emphasis",
  3712. rippleEffect: {
  3713. brushType: "stroke",
  3714. color: "#DF62F2",
  3715. },
  3716. hoverAnimation: true,
  3717. label: {
  3718. normal: {
  3719. formatter: "{b}",
  3720. position: "right",
  3721. show: true,
  3722. fontSize: "30",
  3723. color: "#fff",
  3724. },
  3725. },
  3726. itemStyle: {
  3727. normal: {
  3728. color: "#ffc809",
  3729. shadowBlur: 50,
  3730. shadowColor: "#ffc809",
  3731. },
  3732. emphasis: {
  3733. color: "#DF62F2",
  3734. shadowBlur: 50,
  3735. shadowColor: "#DF62F2",
  3736. },
  3737. },
  3738. zlevel: 999,
  3739. },
  3740. ],
  3741. };
  3742. var categoryData = [];
  3743. var barData = [];
  3744. var sum = 0;
  3745. for (var i = 0; i < data.length; i++) {
  3746. categoryData.push(data[i].name);
  3747. barData.push(data[i].value);
  3748. sum += data[i].value;
  3749. }
  3750. this.chinaMap.on('click', function (params) {
  3751. if (params.name == '山西') {
  3752. that.chinaMap.dispose()
  3753. that.leftEcharts16.dispose()
  3754. that.mapShow = true
  3755. setTimeout(() => {
  3756. that.leftEcharts12Fun()
  3757. that.leftEcharts14Fun()
  3758. that.leftEcharts9Fun()
  3759. that.leftEcharts15Fun()
  3760. that.leftEcharts13Fun()
  3761. that.shanxiEchartsFun()
  3762. })
  3763. }
  3764. })
  3765. tools.loopShowTooltip(this.chinaMap, option, {
  3766. interval: 2000,
  3767. loopSeries: false,
  3768. seriesIndex: 0,
  3769. });
  3770. this.chinaMap.setOption(option);
  3771. },
  3772. leftEcharts9Fun() {
  3773. let that = this;
  3774. this.leftEcharts9 = echarts.init(this.$refs["leftEcharts9"]);
  3775. // var ROOT_PATH = 'https://echarts.apache.org/examples';
  3776. let option = {
  3777. backgroundColor: "#00000000",
  3778. globe: {
  3779. globeRadius: 55,
  3780. baseTexture: "./img/3D/world1.jpg",
  3781. heightTexture: "./img/3D/world1.jpg",
  3782. displacementScale: 0.04,
  3783. shading: "realistic",
  3784. // environment: './img/3D/world2.jpg',
  3785. realisticMaterial: {
  3786. roughness: 0.9,
  3787. },
  3788. postEffect: {
  3789. enable: true,
  3790. },
  3791. light: {
  3792. main: {
  3793. intensity: 3,
  3794. shadow: true,
  3795. },
  3796. },
  3797. },
  3798. };
  3799. that.leftEcharts9.setOption(option);
  3800. },
  3801. leftEcharts10Fun() {
  3802. let that = this;
  3803. this.leftEcharts10 = echarts.init(this.$refs["leftEcharts10"]);
  3804. option = {
  3805. grid: {
  3806. top: 45,
  3807. right: 0,
  3808. left: 80,
  3809. bottom: 80,
  3810. },
  3811. tooltip: {
  3812. show: true,
  3813. trigger: "axis",
  3814. formatter: (data) => {
  3815. return `${data[0].name
  3816. }<br /><span style="display:inline-block;border-radius:50%; width:20px;height:20px;background-color:${data[0].color
  3817. }"></span> ${data[0].seriesName}:${that.numFormat(
  3818. data[0].value
  3819. )}亿<br/><span style="display:inline-block;border-radius:50%; width:20px;height:20px;background-color:${data[1].color.colorStops[0].color
  3820. }"></span> ${data[1].seriesName}:${that.numFormat(
  3821. data[1].value
  3822. )}亿`;
  3823. },
  3824. axisPointer: {
  3825. // 坐标轴指示器,坐标轴触发有效
  3826. type: "shadow", // 默认为直线,可选为:'line' | 'shadow'
  3827. },
  3828. backgroundColor: "rgba(50,50,50,0.7)", // 提示框浮层的背景颜色
  3829. borderColor: "rgba(50,50,50,0.7)",
  3830. textStyle: {
  3831. color: "#fff",
  3832. fontStyle: "normal", // 文字字体的风格('normal',无样式;'italic',斜体;'oblique',倾斜字体)
  3833. fontWeight: "normal", // 文字字体的粗细('normal',无样式;'bold',加粗;'bolder',加粗的基础上再加粗;'lighter',变细;数字定义粗细也可以,取值范围100至700)
  3834. fontSize: "28", // 文字字体大小
  3835. },
  3836. },
  3837. xAxis: {
  3838. data: commonCompany,
  3839. axisTick: {
  3840. show: false,
  3841. },
  3842. // x轴的字体颜色
  3843. axisLabel: {
  3844. rotate: 40,
  3845. textStyle: {
  3846. color: "white",
  3847. fontSize: "20",
  3848. fontFamily: "Microsoft YaHei",
  3849. },
  3850. },
  3851. //y轴线的颜色以及宽度
  3852. axisLine: {
  3853. show: true,
  3854. lineStyle: {
  3855. color: "#1E5389",
  3856. width: 1,
  3857. type: "solid",
  3858. },
  3859. },
  3860. },
  3861. yAxis: {
  3862. name: "亿",
  3863. axisTick: {
  3864. lineStyle: {
  3865. color: "#18416F",
  3866. },
  3867. },
  3868. // y轴的字体颜色
  3869. axisLabel: {
  3870. textStyle: {
  3871. color: "white",
  3872. fontSize: "20",
  3873. fontFamily: "Microsoft YaHei",
  3874. },
  3875. },
  3876. splitLine: {
  3877. show: true,
  3878. lineStyle: {
  3879. color: "#68b4dd66",
  3880. width: 1,
  3881. type: "dashed",
  3882. },
  3883. },
  3884. //y轴线的颜色以及宽度
  3885. axisLine: {
  3886. show: true,
  3887. lineStyle: {
  3888. color: "#1E5389",
  3889. width: 1,
  3890. type: "solid",
  3891. },
  3892. },
  3893. nameTextStyle: {
  3894. color: "#fff",
  3895. fontSize: 20,
  3896. fontFamily: "Microsoft YaHei",
  3897. },
  3898. },
  3899. series: [
  3900. {
  3901. name: "已用额度",
  3902. type: "pictorialBar",
  3903. symbol: "fixed",
  3904. symbolSize: [20, 5],
  3905. symbolMargin: 2,
  3906. symbolRepeat: "repeat",
  3907. data: [
  3908. 26, 36, 16, 46, 26, 36, 16, 46, 26, 36, 16, 46, 26, 36, 16, 46,
  3909. 26, 36,
  3910. ],
  3911. showBackground: false,
  3912. barWidth: "15",
  3913. itemStyle: {
  3914. color: "#40A9FF",
  3915. },
  3916. zlevel: 1,
  3917. },
  3918. {
  3919. name: "总额度",
  3920. type: "pictorialBar",
  3921. symbol: "fixed",
  3922. symbolSize: [30, 5],
  3923. symbolMargin: 2,
  3924. symbolRepeat: "repeat",
  3925. data: [
  3926. 390, 390, 390, 200, 390, 390, 390, 200, 390, 390, 390, 200, 390,
  3927. 390, 390, 200, 390, 200,
  3928. ],
  3929. barGap: "-130%",
  3930. barWidth: "25",
  3931. itemStyle: {
  3932. color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
  3933. {
  3934. offset: 0,
  3935. color: "#b9b7c030",
  3936. },
  3937. {
  3938. offset: 1,
  3939. color: "#b9b7c030",
  3940. },
  3941. ]),
  3942. },
  3943. },
  3944. ],
  3945. };
  3946. //轮播
  3947. tools.loopShowTooltip(that.leftEcharts10, option, {
  3948. interval: 2000,
  3949. loopSeries: true,
  3950. });
  3951. //注册
  3952. that.leftEcharts10.setOption(option);
  3953. },
  3954. // 重点项目两线指标轮播方法
  3955. scrollChange(index) {
  3956. if (index == 18) {
  3957. this.count = -1;
  3958. } else {
  3959. this.count = index;
  3960. }
  3961. if (this.count > 12 && this.count != 18) {
  3962. this.countType = 1;
  3963. } else {
  3964. this.countType = 0;
  3965. }
  3966. for (var i = 0; i < this.list.length; i++) {
  3967. if (i == 2) {
  3968. this.list[i].classList.add("light");
  3969. } else {
  3970. this.list[i].classList.remove("light");
  3971. }
  3972. }
  3973. this.leftEcharts11 ? this.leftEcharts11.dispose() : "";
  3974. this.leftEcharts11Fun();
  3975. },
  3976. leftEcharts11Fun() {
  3977. let that = this;
  3978. this.leftEcharts11 = echarts.init(this.$refs["leftEcharts11"]);
  3979. option = {
  3980. tooltip: {
  3981. trigger: "axis",
  3982. formatter:
  3983. "指标:" +
  3984. "{c0}" +
  3985. "<br/>" +
  3986. "发展线:" +
  3987. "{c1}" +
  3988. "<br/>" +
  3989. "生存线:" +
  3990. "{c2}", //+ '<br/>'+ '{a1}:{c1}' + '%',
  3991. axisPointer: {
  3992. type: "shadow",
  3993. },
  3994. backgroundColor: "rgba(50,50,50,0.7)",
  3995. borderColor: "rgba(50,50,50,0.7)",
  3996. textStyle: {
  3997. color: "#fff",
  3998. fontStyle: "normal", // 文字字体的风格('normal',无样式;'italic',斜体;'oblique',倾斜字体)
  3999. fontWeight: "normal", // 文字字体的粗细('normal',无样式;'bold',加粗;'bolder',加粗的基础上再加粗;'lighter',变细;数字定义粗细也可以,取值范围100至700)
  4000. fontSize: "28", // 文字字体大小
  4001. }
  4002. },
  4003. grid: {
  4004. top: "10%",
  4005. right: "5%",
  4006. left: "15%",
  4007. bottom: "20%",
  4008. },
  4009. xAxis: {
  4010. data: [
  4011. "总投资收益率",
  4012. "销售利润率",
  4013. "成本费用利润率",
  4014. "总资产周转率",
  4015. "财务内部收益率",
  4016. ],
  4017. // data: left15[this.countType],
  4018. axisLine: {
  4019. show: true, //隐藏X轴轴线
  4020. lineStyle: {
  4021. color: "#005094",
  4022. width: 1,
  4023. },
  4024. },
  4025. axisTick: {
  4026. show: true, //隐藏X轴刻度
  4027. },
  4028. axisLabel: {
  4029. show: true,
  4030. rotate: 30,
  4031. textStyle: {
  4032. color: "#fff", //X轴文字颜色
  4033. fontSize: 20,
  4034. fontFamily: "Microsoft YaHei",
  4035. },
  4036. },
  4037. },
  4038. yAxis: [
  4039. {
  4040. type: "value",
  4041. splitLine: {
  4042. show: true,
  4043. lineStyle: {
  4044. color: "#68b4dd66",
  4045. type: "dashed",
  4046. },
  4047. },
  4048. axisLine: {
  4049. show: false,
  4050. },
  4051. axisLabel: {
  4052. show: true,
  4053. formatter: "{value}%",
  4054. textStyle: {
  4055. color: "#fff",
  4056. fontSize: 20,
  4057. fontFamily: "Microsoft YaHei",
  4058. },
  4059. },
  4060. nameTextStyle: {
  4061. color: "#ebf8ac",
  4062. fontSize: 16,
  4063. fontFamily: "Microsoft YaHei",
  4064. },
  4065. },
  4066. ],
  4067. series: [
  4068. {
  4069. name: "实际值",
  4070. type: "bar",
  4071. barWidth: 20,
  4072. itemStyle: {
  4073. normal: {
  4074. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  4075. {
  4076. offset: 0,
  4077. color: "#69c0ff",
  4078. },
  4079. {
  4080. offset: 1,
  4081. color: "#082550",
  4082. },
  4083. ]),
  4084. },
  4085. },
  4086. data: [70, 52, 33, 41, 52],
  4087. // data: this.storageRecordConfig.data.length == 0 ? [] : this.storageRecordConfig.data.length == 1 ? left12[this.count][2] : left12[this.count + 1][2]
  4088. },
  4089. {
  4090. name: "",
  4091. type: "line",
  4092. barWidth: 15,
  4093. itemStyle: {
  4094. normal: {
  4095. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  4096. {
  4097. offset: 0,
  4098. color: "#69c0ff",
  4099. },
  4100. {
  4101. offset: 1,
  4102. color: "green",
  4103. },
  4104. ]),
  4105. },
  4106. },
  4107. data: [20, 30, 15, 28, 36],
  4108. // data: this.storageRecordConfig.data.length == 0 ? [] : this.storageRecordConfig.data.length == 1 ? left12[this.count][1] : left12[this.count + 1][1]
  4109. },
  4110. {
  4111. name: "",
  4112. type: "line",
  4113. barWidth: 15,
  4114. itemStyle: {
  4115. normal: {
  4116. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
  4117. {
  4118. offset: 0,
  4119. color: "#69c0ff",
  4120. },
  4121. {
  4122. offset: 1,
  4123. color: "yellow",
  4124. },
  4125. ]),
  4126. },
  4127. },
  4128. data: [15, 22, 17, 33, 14],
  4129. // data: this.storageRecordConfig.data.length == 0 ? [] : this.storageRecordConfig.data.length == 1 ? left12[this.count][0] : left12[this.count + 1][0]
  4130. },
  4131. ],
  4132. };
  4133. //轮播
  4134. tools.loopShowTooltip(that.leftEcharts11, option, {
  4135. interval: 2000,
  4136. loopSeries: true,
  4137. });
  4138. //注册
  4139. that.leftEcharts11.setOption(option);
  4140. },
  4141. leftEcharts12Fun() {
  4142. let that = this;
  4143. this.leftEcharts12 = echarts.init(this.$refs["leftEcharts12"]);
  4144. var totalData = [{
  4145. name: '传统产业',
  4146. value: 12,
  4147. radio: 0.13
  4148. }, {
  4149. name: '公共基础产业',
  4150. value: 52,
  4151. radio: 0.01
  4152. }, {
  4153. name: '战略性新兴产业',
  4154. value: 15,
  4155. radio: 3.9
  4156. }, {
  4157. name: '特色优势产业',
  4158. value: 56,
  4159. radio: 10.5
  4160. }];
  4161. var data = [];
  4162. for (var i = 0; i < totalData.length; i++) {
  4163. data.push({
  4164. value: totalData[i].value,
  4165. name: totalData[i].name,
  4166. itemStyle: {
  4167. normal: {
  4168. borderWidth: 8,
  4169. shadowBlur: 0,
  4170. borderColor: commonColor[i],
  4171. shadowColor: commonColor[i]
  4172. }
  4173. }
  4174. },
  4175. {
  4176. value: 5,
  4177. name: '',
  4178. tooltip: { show: false },
  4179. itemStyle: {
  4180. normal: {
  4181. label: {
  4182. show: false
  4183. },
  4184. labelLine: {
  4185. show: false
  4186. },
  4187. color: 'rgba(0, 0, 0, 0)',
  4188. borderColor: 'rgba(0, 0, 0, 0)',
  4189. borderWidth: 0
  4190. }
  4191. }
  4192. }
  4193. );
  4194. }
  4195. var seriesOption = [
  4196. {
  4197. name: '',
  4198. type: 'pie',
  4199. clockWise: false,
  4200. radius: [170, 160],
  4201. center: [260, 250],
  4202. hoverAnimation: false,
  4203. itemStyle: {
  4204. normal: {
  4205. label: {
  4206. show: false,
  4207. }
  4208. }
  4209. },
  4210. data: data
  4211. },
  4212. // {
  4213. // type: 'pie',
  4214. // zlevel: 3,
  4215. // silent: false,
  4216. // radius: [120, 120],
  4217. // center: [260, 250],
  4218. // label: {
  4219. // normal: {
  4220. // show: false
  4221. // },
  4222. // },
  4223. // labelLine: {
  4224. // normal: {
  4225. // show: false
  4226. // }
  4227. // },
  4228. // data: _pie3()
  4229. // },
  4230. {
  4231. type: "liquidFill",
  4232. radius: "40%",
  4233. tooltip: {
  4234. show: false
  4235. },
  4236. data: [left2[0]],
  4237. center: [260, 250],
  4238. backgroundStyle: {
  4239. color: {
  4240. type: "radial",
  4241. x: 0.5,
  4242. y: 0.5,
  4243. r: 0.5,
  4244. // 水球体颜色
  4245. colorStops: [
  4246. {
  4247. offset: 0,
  4248. color: "#010a11",
  4249. },
  4250. {
  4251. offset: 0.75,
  4252. // color: "#203852",
  4253. color: "#1a2f45",
  4254. },
  4255. {
  4256. offset: 1,
  4257. // color: "#354e6d",
  4258. color: "#2b405a",
  4259. // color: "#314967",
  4260. },
  4261. ],
  4262. globalCoord: false,
  4263. },
  4264. },
  4265. outline: {
  4266. borderDistance: 0,
  4267. itemStyle: {
  4268. borderWidth: 0,
  4269. borderColor: {
  4270. type: "linear",
  4271. x: 0,
  4272. y: 0,
  4273. x2: 0,
  4274. y2: 1,
  4275. colorStops: [
  4276. ],
  4277. globalCoord: false,
  4278. },
  4279. },
  4280. },
  4281. color: [
  4282. {
  4283. x: 0,
  4284. y: 0,
  4285. x2: 0,
  4286. y2: 1,
  4287. colorStops: [{
  4288. offset: 0,
  4289. color: '#237386',
  4290. },
  4291. {
  4292. offset: 1,
  4293. color: '#0078C8',
  4294. },],
  4295. },
  4296. {
  4297. x: 0,
  4298. y: 0,
  4299. x2: 0,
  4300. y2: 1,
  4301. colorStops: [{
  4302. offset: 0,
  4303. color: '#2F97A9',
  4304. },
  4305. {
  4306. offset: 1,
  4307. color: '#0078C8',
  4308. },],
  4309. },
  4310. {
  4311. x: 0,
  4312. y: 0,
  4313. x2: 0,
  4314. y2: 1,
  4315. colorStops: [{
  4316. offset: 0,
  4317. color: '#48E0ED',
  4318. },
  4319. {
  4320. offset: 1,
  4321. color: '#0078C8',
  4322. },],
  4323. }
  4324. ],
  4325. label: {
  4326. normal: {
  4327. textStyle: {
  4328. fontSize: '50',
  4329. color: "#58E6F7", // x轴文字颜色
  4330. },
  4331. },
  4332. },
  4333. },
  4334. ];
  4335. option = {
  4336. color: commonColor,
  4337. title: {
  4338. show: false,
  4339. text: '风险类型123',
  4340. top: '48%',
  4341. textAlign: "center",
  4342. left: "49%",
  4343. textStyle: {
  4344. color: '#fff',
  4345. fontSize: 18,
  4346. fontWeight: '400'
  4347. }
  4348. },
  4349. tooltip: {
  4350. show: true,
  4351. formatter: function (params) {
  4352. if (params.seriesIndex === 2) {
  4353. return null; // 隐藏部分2的tooltip
  4354. } else {
  4355. return params.name + ': ' + params.value + ' (' + params.percent + '%)';
  4356. }
  4357. }
  4358. },
  4359. legend: {
  4360. icon: "circle",
  4361. orient: 'vertical',
  4362. formatter: function (name) {
  4363. let num
  4364. for (let i = 0; i < totalData.length; i++) {
  4365. if (totalData[i].name === name) {
  4366. num = name + ':' + totalData[i].value + '(' + totalData[i].radio + '%' + ')'
  4367. }
  4368. }
  4369. return num
  4370. },
  4371. data: ['传统产业', '公共基础产业', '战略性新兴产业', '特色优势产业'],
  4372. right: 0,
  4373. bottom: 0,
  4374. align: 'left',
  4375. textStyle: {
  4376. color: '#FFF', // 文字的颜色
  4377. fontSize: '20', // 文字字体大小
  4378. fontFamily: 'Microsoft YaHei'
  4379. },
  4380. itemGap: 20
  4381. },
  4382. toolbox: {
  4383. show: false
  4384. },
  4385. graphic: [{
  4386. type: 'image',
  4387. id: 'background',
  4388. left: 130,
  4389. top: "center",
  4390. zlevel: 0,
  4391. silent: true,
  4392. style: {
  4393. width: 260, // 设置图片宽度
  4394. height: 260, // 设置图片高度
  4395. image: "data:image/png;base64,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"
  4396. }
  4397. }],
  4398. series: seriesOption
  4399. }
  4400. function _pie3() {
  4401. let dataArr = [];
  4402. for (var i = 0; i < 100; i++) {
  4403. if (i % 2 === 0) {
  4404. dataArr.push({
  4405. name: (i + 1).toString(),
  4406. value: 25,
  4407. tooltip: { show: false },
  4408. itemStyle: {
  4409. normal: {
  4410. color: "#5A5DE0",
  4411. borderWidth: 1,
  4412. borderColor: "#5A5DE0"
  4413. }
  4414. }
  4415. })
  4416. } else {
  4417. dataArr.push({
  4418. name: (i + 1).toString(),
  4419. value: 20,
  4420. tooltip: { show: false },
  4421. itemStyle: {
  4422. normal: {
  4423. color: "rgba(0,0,0,0)",
  4424. borderWidth: 0,
  4425. borderColor: "rgba(0,0,0,0)"
  4426. }
  4427. }
  4428. })
  4429. }
  4430. }
  4431. console.log(dataArr);
  4432. return dataArr
  4433. }
  4434. //轮播
  4435. tools.loopShowTooltip(that.leftEcharts12, option, {
  4436. interval: 1000,
  4437. loopSeries: true,
  4438. });
  4439. //注册
  4440. that.leftEcharts12.setOption(option);
  4441. },
  4442. leftEcharts13Fun() {
  4443. let that = this;
  4444. this.leftEcharts13 = echarts.init(this.$refs["leftEcharts13"]);
  4445. var totalData = [{
  4446. name: '新建',
  4447. value: 12,
  4448. radio: 0.13
  4449. }, {
  4450. name: '续建',
  4451. value: 52,
  4452. radio: 0.01
  4453. }];
  4454. var data = [];
  4455. for (var i = 0; i < totalData.length; i++) {
  4456. data.push({
  4457. value: totalData[i].value,
  4458. name: totalData[i].name,
  4459. itemStyle: {
  4460. normal: {
  4461. borderWidth: 8,
  4462. shadowBlur: 0,
  4463. borderColor: commonColor[i],
  4464. shadowColor: commonColor[i]
  4465. }
  4466. }
  4467. },
  4468. {
  4469. value: 5,
  4470. name: '',
  4471. tooltip: { show: false },
  4472. itemStyle: {
  4473. normal: {
  4474. label: {
  4475. show: false
  4476. },
  4477. labelLine: {
  4478. show: false
  4479. },
  4480. color: 'rgba(0, 0, 0, 0)',
  4481. borderColor: 'rgba(0, 0, 0, 0)',
  4482. borderWidth: 0
  4483. }
  4484. }
  4485. }
  4486. );
  4487. }
  4488. var seriesOption = [
  4489. {
  4490. name: '',
  4491. type: 'pie',
  4492. clockWise: false,
  4493. radius: [170, 160],
  4494. center: [350, 250],
  4495. hoverAnimation: false,
  4496. itemStyle: {
  4497. normal: {
  4498. label: {
  4499. show: false,
  4500. }
  4501. }
  4502. },
  4503. data: data
  4504. },
  4505. {
  4506. type: 'pie',
  4507. radius: [120, 120],
  4508. center: [350, 250],
  4509. zlevel: 3,
  4510. silent: true,
  4511. label: {
  4512. normal: {
  4513. show: false
  4514. },
  4515. },
  4516. labelLine: {
  4517. normal: {
  4518. show: false
  4519. }
  4520. },
  4521. data: _pie3()
  4522. }
  4523. ];
  4524. option = {
  4525. color: commonColor,
  4526. title: {
  4527. show: true,
  4528. text: '35%',
  4529. top: '40%',
  4530. textAlign: "center",
  4531. left: "50%",
  4532. textStyle: {
  4533. fontWeight: '600',
  4534. fontFamily: 'Microsoft YaHei',
  4535. fontSize: '50',
  4536. color: "#58E6F7", // x轴文字颜色
  4537. }
  4538. },
  4539. tooltip: {
  4540. show: true
  4541. },
  4542. legend: {
  4543. icon: "circle",
  4544. orient: 'vertical',
  4545. formatter: function (name) {
  4546. let num
  4547. for (let i = 0; i < totalData.length; i++) {
  4548. if (totalData[i].name === name) {
  4549. num = name + ':' + totalData[i].value + '(' + totalData[i].radio + '%' + ')'
  4550. }
  4551. }
  4552. return num
  4553. },
  4554. data: ['新建', '续建'],
  4555. right: 0,
  4556. bottom: 0,
  4557. align: 'left',
  4558. textStyle: {
  4559. color: '#FFF', // 文字的颜色
  4560. fontSize: '20', // 文字字体大小
  4561. },
  4562. itemGap: 20
  4563. },
  4564. toolbox: {
  4565. show: false
  4566. },
  4567. series: seriesOption
  4568. }
  4569. function _pie3() {
  4570. let dataArr = [];
  4571. for (var i = 0; i < 1; i++) {
  4572. if (i % 2 === 0) {
  4573. dataArr.push({
  4574. name: (i + 1).toString(),
  4575. value: 25,
  4576. tooltip: { show: false },
  4577. itemStyle: {
  4578. normal: {
  4579. color: "#5A5DE0",
  4580. borderWidth: 1,
  4581. borderColor: "#5A5DE0"
  4582. }
  4583. }
  4584. })
  4585. } else {
  4586. dataArr.push({
  4587. name: (i + 1).toString(),
  4588. value: 20,
  4589. tooltip: { show: false },
  4590. itemStyle: {
  4591. normal: {
  4592. color: "rgba(0,0,0,0)",
  4593. borderWidth: 0,
  4594. borderColor: "rgba(0,0,0,0)"
  4595. }
  4596. }
  4597. })
  4598. }
  4599. }
  4600. return dataArr
  4601. }
  4602. //轮播
  4603. tools.loopShowTooltip(that.leftEcharts13, option, {
  4604. interval: 1000,
  4605. loopSeries: true,
  4606. });
  4607. //注册
  4608. that.leftEcharts13.setOption(option);
  4609. },
  4610. leftEcharts14Fun() {
  4611. let that = this;
  4612. this.leftEcharts14 = echarts.init(this.$refs["leftEcharts14"]);
  4613. that.leftEcharts14.on("showTip", (params) => {
  4614. // 如果是7或者15并且满足防抖则切换
  4615. if (
  4616. (params.dataIndex == 5 || params.dataIndex == 11) &&
  4617. that.echartC1Fd1
  4618. ) {
  4619. that.echartC1Fd1 = false;
  4620. setTimeout(() => {
  4621. option.dataZoom[0].endValue = option.dataZoom[0].endValue + 6;
  4622. option.dataZoom[0].startValue = option.dataZoom[0].startValue + 6;
  4623. that.leftEcharts14.setOption(option);
  4624. // 防止勿刷新做的防抖
  4625. setTimeout(() => {
  4626. that.echartC1Fd1 = true;
  4627. }, 2000);
  4628. }, 1900);
  4629. // 如果是17表示到了最后一个,那么重新来一遍
  4630. } else if (params.dataIndex == 17 && that.echartC1Fd1) {
  4631. that.echartC1Fd1 = false;
  4632. setTimeout(() => {
  4633. option.dataZoom[0].endValue = 0;
  4634. option.dataZoom[0].startValue = 5;
  4635. that.leftEcharts14.setOption(option);
  4636. // 防止勿刷新做的防抖
  4637. setTimeout(() => {
  4638. that.echartC1Fd1 = true;
  4639. }, 2000);
  4640. }, 1900);
  4641. }
  4642. });
  4643. let option = {
  4644. dataZoom: [
  4645. {
  4646. // start: 9,//默认为@
  4647. // end: 100,//黑认认为1@0
  4648. type: "slider",
  4649. show: false,
  4650. yAxisIndex: 0,
  4651. handlesize: 0, //滑动条的 左右2个滑动条的大小
  4652. startValue: 5, // 初始显示值
  4653. endValue: 0, // 结束显示值
  4654. height: 10, //组件高度
  4655. left: "5%",
  4656. right: "4%", //右边的距离
  4657. bottom: "25%", //底边的距离
  4658. borderColor: "#939",
  4659. fillerColor: "#269cdb",
  4660. borderRadius: 5,
  4661. backgroundColor: "#33384b", //两边未选中的滑动条区域的额色
  4662. showDataShadow: false, //是否显示数据阴影
  4663. showDetail: false, //即拖拽时候是否显示详细数值信息
  4664. truerealtime: true, //是否实时更新
  4665. filterMode: "filter",
  4666. },
  4667. {
  4668. type: "inside",
  4669. show: true,
  4670. start: 1,
  4671. end: 100,
  4672. zoomOnMouseWheel: false, //滚轮是否触发缩放
  4673. moveOnMouseMove: false, //鼠标滚轮触发滚动
  4674. },
  4675. ],
  4676. tooltip: {
  4677. show: true,
  4678. trigger: "axis",
  4679. // formatter: (data) => {
  4680. // return `${data[0].name
  4681. // }<br /><span style="display:inline-block;border-radius:50%; width:20px;height:20px;background-color:${data[0].color
  4682. // }"></span> ${data[0].seriesName}:${that.numFormat(
  4683. // data[0].value
  4684. // )}亿<br/><span style="display:inline-block;border-radius:50%; width:20px;height:20px;background-color:${data[1].color.colorStops[0].color
  4685. // }"></span> ${data[1].seriesName}:${that.numFormat(
  4686. // data[1].value
  4687. // )}亿`;
  4688. // },
  4689. axisPointer: {
  4690. // 坐标轴指示器,坐标轴触发有效
  4691. type: "shadow", // 默认为直线,可选为:'line' | 'shadow'
  4692. },
  4693. backgroundColor: "rgba(50,50,50,0.7)", // 提示框浮层的背景颜色
  4694. borderColor: "rgba(50,50,50,0.7)",
  4695. textStyle: {
  4696. color: "#fff",
  4697. fontStyle: "normal", // 文字字体的风格('normal',无样式;'italic',斜体;'oblique',倾斜字体)
  4698. fontWeight: "normal", // 文字字体的粗细('normal',无样式;'bold',加粗;'bolder',加粗的基础上再加粗;'lighter',变细;数字定义粗细也可以,取值范围100至700)
  4699. fontSize: "28", // 文字字体大小
  4700. },
  4701. },
  4702. legend: {
  4703. top: "top",
  4704. textStyle: {
  4705. color: "#fff",
  4706. fontSize: 20,
  4707. padding: [0, 20],
  4708. },
  4709. },
  4710. grid: {
  4711. left: '3%',
  4712. right: '7%',
  4713. bottom: '3%',
  4714. containLabel: true
  4715. },
  4716. xAxis: {
  4717. name: '亿',
  4718. nameTextStyle: {
  4719. color: '#fff',
  4720. fontSize: 20,
  4721. fontFamily: 'Microsoft YaHei'
  4722. },
  4723. type: 'value',
  4724. axisLabel: {
  4725. textStyle: {
  4726. color: "white",
  4727. fontSize: '20',
  4728. fontFamily: 'Microsoft YaHei'
  4729. },
  4730. },
  4731. splitLine: {
  4732. show: true,
  4733. lineStyle: {
  4734. color: "#68b4dd66",
  4735. width: 1,
  4736. type: "dashed",
  4737. },
  4738. },
  4739. },
  4740. yAxis: {
  4741. type: 'category',
  4742. axisTick: {
  4743. lineStyle: {
  4744. color: "#18416F",
  4745. },
  4746. },
  4747. // y轴的字体颜色
  4748. axisLabel: {
  4749. textStyle: {
  4750. color: "white",
  4751. fontSize: '20',
  4752. fontFamily: 'Microsoft YaHei'
  4753. },
  4754. },
  4755. splitLine: {
  4756. show: false,
  4757. lineStyle: {
  4758. color: "#68b4dd66",
  4759. width: 1,
  4760. type: "dashed",
  4761. },
  4762. },
  4763. //y轴线的颜色以及宽度
  4764. axisLine: {
  4765. show: true,
  4766. lineStyle: {
  4767. color: "#1E5389",
  4768. width: 1,
  4769. type: "solid",
  4770. },
  4771. },
  4772. nameTextStyle: {
  4773. color: '#fff',
  4774. fontSize: 20,
  4775. fontFamily: 'Microsoft YaHei'
  4776. },
  4777. data: that.riskData1.x
  4778. },
  4779. series: [
  4780. {
  4781. name: '实际投资',
  4782. type: 'bar',
  4783. data: that.riskData1.y1,
  4784. barGap: '-145%',
  4785. barWidth: "15",
  4786. zlevel: 10,
  4787. itemStyle: {
  4788. barBorderRadius: [0, 20, 20, 0],
  4789. color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [
  4790. {
  4791. offset: 0,
  4792. color: '#0F357C',
  4793. },
  4794. {
  4795. offset: 1,
  4796. color: '#B78CFF',
  4797. },
  4798. ]),
  4799. },
  4800. },
  4801. {
  4802. name: '计划投资',
  4803. type: 'bar',
  4804. data: that.riskData1.y1,
  4805. barWidth: "30",
  4806. itemStyle: {
  4807. barBorderRadius: [0, 50, 50, 0],
  4808. borderColor: '#B78CFF',
  4809. color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [
  4810. {
  4811. offset: 0,
  4812. color: '#0F357C80',
  4813. },
  4814. {
  4815. offset: 1,
  4816. color: '#10417F80',
  4817. },
  4818. ]),
  4819. },
  4820. }
  4821. ]
  4822. };
  4823. //轮播
  4824. tools.loopShowTooltip(that.leftEcharts14, option, {
  4825. interval: 2000,
  4826. loopSeries: true,
  4827. });
  4828. //注册
  4829. that.leftEcharts14.setOption(option);
  4830. },
  4831. leftEcharts15Fun() {
  4832. let that = this;
  4833. this.leftEcharts15 = echarts.init(this.$refs["leftEcharts15"]);
  4834. var xdata = ['煤炭和煤电', '煤电和新能源', '煤炭和化工', '煤炭和数字', '煤炭和降碳'];
  4835. var data = [70, 60, 80, 200, 300];
  4836. var maxArr = [100, 100, 100];
  4837. option = {
  4838. tooltip: {
  4839. show: true,
  4840. trigger: "axis",
  4841. // formatter: (data) => {
  4842. // return `${data[0].name
  4843. // }<br /><span style="display:inline-block;border-radius:50%; width:20px;height:20px;background-color:${data[0].color
  4844. // }"></span> ${data[0].seriesName}:${that.numFormat(
  4845. // data[0].value
  4846. // )}亿<br/><span style="display:inline-block;border-radius:50%; width:20px;height:20px;background-color:${data[1].color.colorStops[0].color
  4847. // }"></span> ${data[1].seriesName}:${that.numFormat(
  4848. // data[1].value
  4849. // )}亿`;
  4850. // },
  4851. axisPointer: {
  4852. // 坐标轴指示器,坐标轴触发有效
  4853. type: "shadow", // 默认为直线,可选为:'line' | 'shadow'
  4854. },
  4855. backgroundColor: "rgba(50,50,50,0.7)", // 提示框浮层的背景颜色
  4856. borderColor: "rgba(50,50,50,0.7)",
  4857. textStyle: {
  4858. color: "#fff",
  4859. fontStyle: "normal", // 文字字体的风格('normal',无样式;'italic',斜体;'oblique',倾斜字体)
  4860. fontWeight: "normal", // 文字字体的粗细('normal',无样式;'bold',加粗;'bolder',加粗的基础上再加粗;'lighter',变细;数字定义粗细也可以,取值范围100至700)
  4861. fontSize: "28", // 文字字体大小
  4862. },
  4863. },
  4864. grid: {
  4865. left: "4%",
  4866. right: "4%",
  4867. bottom: "3%",
  4868. top: "15%",
  4869. containLabel: true
  4870. },
  4871. xAxis: {
  4872. data: xdata,
  4873. triggerEvent: true,
  4874. axisTick: {
  4875. show: false
  4876. },
  4877. axisLine: {
  4878. show: false
  4879. },
  4880. axisLabel: {
  4881. show: true,
  4882. rotate: 0,
  4883. interval: 0,
  4884. textStyle: {
  4885. padding: [14, 0, 0, 0],
  4886. fontSize: 14,
  4887. color: "rgba(255,255,255,1)"
  4888. }
  4889. }
  4890. },
  4891. yAxis: {
  4892. name: "单位:个数",
  4893. triggerEvent: true,
  4894. nameTextStyle: {
  4895. color: "rgba(255,255,255,1)",
  4896. fontSize: 16,
  4897. padding: [0, 0, 10, -20]
  4898. },
  4899. splitLine: {
  4900. show: true,
  4901. lineStyle: {
  4902. color: 'rgba(255,255,255,.1)'
  4903. }
  4904. },
  4905. axisTick: {
  4906. show: false
  4907. },
  4908. axisLine: {
  4909. show: true,
  4910. lineStyle: {
  4911. color: 'rgba(255,255,255,.1)'
  4912. }
  4913. },
  4914. axisLabel: {
  4915. show: true,
  4916. textStyle: {
  4917. color: "rgb(148,159,167)",
  4918. fontSize: 16
  4919. }
  4920. }
  4921. },
  4922. series: [
  4923. {
  4924. name: "数量",
  4925. type: "pictorialBar",
  4926. barCategoryGap: "60%",
  4927. // symbol: 'path://M0,10 L10,10 L5,0 L0,10 z',
  4928. symbol: "path://M0,10 L10,10 C5.5,10 5.5,5 5,0 C4.5,5 4.5,10 0,10 z",
  4929. itemStyle: {
  4930. normal: {
  4931. //渐变色
  4932. color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
  4933. offset: 0,
  4934. color: "#01EAED"
  4935. },
  4936. {
  4937. offset: 0.5,
  4938. color: "#02C4DD"
  4939. },
  4940. {
  4941. offset: 1,
  4942. color: "#029ED9"
  4943. }
  4944. ])
  4945. }
  4946. },
  4947. label: {
  4948. normal: {
  4949. show: false,
  4950. position: "top",
  4951. textStyle: {
  4952. color: "#fff",
  4953. fontSize: 20
  4954. }
  4955. }
  4956. },
  4957. data: data,
  4958. }
  4959. ]
  4960. }
  4961. //轮播
  4962. tools.loopShowTooltip(that.leftEcharts15, option, {
  4963. interval: 2000,
  4964. loopSeries: true,
  4965. });
  4966. //注册
  4967. that.leftEcharts15.setOption(option);
  4968. },
  4969. leftEcharts16Fun() {
  4970. let that = this;
  4971. this.leftEcharts16 = echarts.init(this.$refs["leftEcharts16"]);
  4972. // var ROOT_PATH = 'https://echarts.apache.org/examples';
  4973. let option = {
  4974. backgroundColor: "#00000000",
  4975. globe: {
  4976. globeRadius: 85,
  4977. baseTexture: "./img/3D/world1.jpg",
  4978. heightTexture: "./img/3D/world1.jpg",
  4979. displacementScale: 0.04,
  4980. shading: "realistic",
  4981. // environment: './img/3D/world2.jpg',
  4982. realisticMaterial: {
  4983. roughness: 0.9,
  4984. },
  4985. postEffect: {
  4986. enable: true,
  4987. },
  4988. light: {
  4989. main: {
  4990. intensity: 1,
  4991. shadow: true,
  4992. },
  4993. },
  4994. },
  4995. };
  4996. that.leftEcharts16.setOption(option);
  4997. },
  4998. // 回到中国地图
  4999. backChina() {
  5000. let that = this
  5001. if (!this.mapShow) {
  5002. return
  5003. }
  5004. this.mapShow = false
  5005. that.leftEcharts12.dispose()
  5006. that.leftEcharts14.dispose()
  5007. that.leftEcharts9.dispose()
  5008. that.leftEcharts15.dispose()
  5009. that.leftEcharts13.dispose()
  5010. that.shanxiMap.dispose()
  5011. setTimeout(() => {
  5012. that.chinaEchartsFun()
  5013. that.leftEcharts16Fun()
  5014. });
  5015. },
  5016. },
  5017. });