index.js 168 KB

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