Commit 921b37f8 by ChenXiHi

用电报告

parent dba97b61
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="36" height="36" viewBox="0 0 36 36"><defs><clipPath id="master_svg0_19861_77859"><rect x="0" y="0" width="36" height="36" rx="0"/></clipPath><clipPath id="master_svg1_19861_77859/0_66264"><rect x="9.36669921875" y="-11.5703125" width="43.45343017578125" height="43.45343017578125" rx="0"/></clipPath></defs><g clip-path="url(#master_svg0_19861_77859)"><g transform="matrix(0.876246452331543,0.48186323046684265,-0.4818631410598755,0.8762465119361877,-4.416144866030663,-5.945334474221454)" clip-path="url(#master_svg1_19861_77859/0_66264)"><g><path d="M26.00214984375,7.1143C26.00214984375,7.1143,19.72176984375,4.008050000000001,19.72176984375,4.008050000000001C19.03007984375,3.66432,18.42750384375,4.01229,18.37658184375,4.784610000000001C18.37658184375,4.784610000000001,17.92677050375,11.777899999999999,17.92677050375,11.777899999999999C17.87584854375,12.5502,18.39779884375,13.4541,19.09372984375,13.797799999999999C19.09372984375,13.797799999999999,25.36986984375,16.904,25.36986984375,16.904C26.06155984375,17.2478,26.66837984375,16.8998,26.715059843749998,16.1275C26.715059843749998,16.1275,27.164869843749997,9.1342,27.164869843749997,9.1342C27.22003984375,8.3619,26.69383984375,7.458,26.00214984375,7.1143C26.00214984375,7.1143,26.00214984375,7.1143,26.00214984375,7.1143ZM40.400339843750004,-1.1987299999999999C40.400339843750004,-1.1987299999999999,34.119939843750004,-4.304966,34.119939843750004,-4.304966C33.42823984375,-4.64869,32.82143984375,-4.300723,32.77473984375,-3.528406C32.77473984375,-3.528406,32.32493984375,3.4606399999999997,32.32493984375,3.4606399999999997C32.27403984375,4.232950000000001,32.79603984375,5.13682,33.49193984375,5.4805399999999995C33.49193984375,5.4805399999999995,39.772339843750004,8.5868,39.772339843750004,8.5868C40.46403984375,8.9305,41.07083984375,8.5825,41.117539843749995,7.8102C41.117539843749995,7.8102,41.56733984375,0.8169399999999998,41.56733984375,0.8169399999999998C41.61393984375,0.04886000000000035,41.09623984375,-0.855,40.400339843750004,-1.1987299999999999C40.400339843750004,-1.1987299999999999,40.400339843750004,-1.1987299999999999,40.400339843750004,-1.1987299999999999Z" fill="#FEAE30" fill-opacity="1"/></g><g><path d="M33.12547359375,19.21439125C33.367353593749996,19.63450125,33.82989359375,19.698151250000002,34.27122359375,19.44354125C34.27122359375,19.44354125,37.74664359375,17.43212125,37.74664359375,17.43212125C38.08612359375,17.23692125,38.20494359375,16.81257125,38.01398359375,16.47309125C37.81878359375,16.13361125,37.38594359375,16.01903125,37.04646359375,16.20999125C37.04646359375,16.20999125,34.81438359375,17.50001125,34.81438359375,17.50001125C34.81438359375,17.50001125,35.39150359375,16.091171250000002,35.39150359375,16.091171250000002C36.01954359375,14.555031249999999,36.26142359375,13.710571250000001,35.64187359375,12.63697125C35.64187359375,12.63697125,35.63338359375,12.61999125,35.63338359375,12.61999125C34.94169359375,11.42332585,33.61347359375,11.15174225,32.28526359375,11.91981525C31.31349859375,12.47995725,30.91461059375,13.17589125,30.74487029375,14.06702125C30.71092229375,14.245251249999999,30.74487059375,14.44894125,30.83398359375,14.59746125C31.04191559375,14.95391125,31.49172759375,15.07273125,31.843933593750002,14.86905125C32.06460359375,14.74174125,32.17068359375,14.54654125,32.20039359375,14.39377125C32.33194359375,13.80393125,32.51865359375,13.46869125,32.92178359375,13.23106125C33.42676359375,12.94250125,33.94871359375,13.02737125,34.26273359375,13.566291249999999C34.56826359375,14.09673125,34.46642359375,14.63565125,34.04207359375,15.747451250000001C34.04207359375,15.747451250000001,33.08304359375,18.29355125,33.08304359375,18.29355125C32.95997359375,18.62879125,32.96846359375,18.94281125,33.12547359375,19.21439125Z" fill="#E5E5E5" fill-opacity="1"/></g><g><path d="M47.59862734375,9.95678125C48.04422734375,10.996481249999999,47.85752734375,12.17608125,47.18272734375,13.050281250000001C45.61692734375,14.95138125,42.15422734375,17.65448125,37.79612734375,20.22608125C33.53562734375,22.73398125,29.58922734375,24.42288125,27.18312734375,24.90238125C26.06282734375,25.08488125,24.90442734375,24.65198125,24.20422734375,23.72268125C24.21692734375,23.73968125,24.22122734375,23.76508125,24.23812734375,23.78208125C24.23812734375,23.78208125,14.04527934375,10.59328125,14.04527934375,10.59328125C14.04952234375,10.580581250000002,14.07074034375,10.584781249999999,14.05376634375,10.55088125C13.76520834375,10.05438125,13.94343494375,9.41358125,14.44841134375,9.12508125C14.63936834375,9.01048125,14.85578734375,8.98928125,15.06371734375,9.00628125C15.06371734375,9.00628125,24.50552734375,10.953981249999998,24.50552734375,10.953981249999998C24.50552734375,10.953981249999998,23.81381734375,-1.53461875,23.81381734375,-1.53461875C23.79683734375,-2.05656875,24.064227343749998,-2.57426875,24.556427343750002,-2.85434875C25.01472734375,-3.12168875,25.55362734375,-3.09197875,25.98222734375,-2.86282875C25.98222734375,-2.86282875,36.51032734375,4.020121250000001,36.51032734375,4.020121250000001C36.51032734375,4.020121250000001,39.485027343750005,-4.95912075,39.485027343750005,-4.95912075C39.48932734375,-4.95912075,39.49352734375,-4.92517275,39.49352734375,-4.93790275C39.56572734375,-5.18826975,39.735427343750004,-5.41317475,39.98152734375,-5.55745375C40.48652734375,-5.84601175,41.123027343749996,-5.68051545,41.41162734375,-5.18402575C41.42432734375,-5.15856475,41.42862734375,-5.17978275,41.44552734375,-5.17553875C41.44552734375,-5.17553875,47.72592734375,10.15198125,47.72592734375,10.15198125C47.68352734375,10.08408125,47.63262734375,10.03738125,47.59862734375,9.95678125C47.59862734375,9.95678125,47.59862734375,9.95678125,47.59862734375,9.95678125Z" fill="#FED530" fill-opacity="1"/></g><g><path d="M30.03787171875,6.51762925C32.82160171875,4.91358625,36.37766171875,5.86412925,37.990211718750004,8.64786125C39.59421171875,11.43160125,38.64371171875,14.98765125,35.85995171875,16.60018125C33.07621171875,18.204181249999998,29.52016171875,17.25368125,27.90763071875,14.46994125C26.29510071875,11.68621125,27.25413171875,8.13016125,30.03787171875,6.51762925C30.03787171875,6.51762925,30.03787171875,6.51762925,30.03787171875,6.51762925Z" fill="#FEAE30" fill-opacity="1"/></g><g><path d="M34.15198359375,14.15223875C34.41084359375,14.60204875,34.98371359375,14.754808749999999,35.43352359375,14.49595875C35.88333359375,14.23710875,36.03610359375,13.66422875,35.777253593750004,13.21441875C35.777253593750004,13.21441875,33.13354359375,8.85634875,33.13354359375,8.85634875C32.87469359375,8.40653805,32.30182359375,8.25377175,31.85201359375,8.51262475C31.85201359375,8.51262475,31.83079359375,8.52535675,31.83079359375,8.52535675C31.60589359375,8.65266175,31.40220359375,8.84361775,31.14334359375,9.10671475C31.14334359375,9.10671475,30.26494259375,10.02755875,30.26494259375,10.02755875C29.98911519375,10.31610875,29.93394919375,10.71499875,30.12915059375,11.045998749999999C30.34981259375,11.43214875,30.86752059375,11.559458750000001,31.24943359375,11.33454875C31.33855359375,11.28362875,31.43615359375,11.19875875,31.51253359375,11.12237875C31.51253359375,11.12237875,32.00477359375,10.63861875,32.00477359375,10.63861875C32.00477359375,10.63861875,34.15198359375,14.15223875,34.15198359375,14.15223875Z" fill="#FED530" fill-opacity="1"/></g></g></g></svg>
\ No newline at end of file
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="36" height="36" viewBox="0 0 36 36"><defs><clipPath id="master_svg0_19861_77882"><rect x="0" y="0" width="36" height="36" rx="0"/></clipPath><clipPath id="master_svg1_19861_77882/0_66270"><rect x="0" y="0" width="36" height="36" rx="0"/></clipPath><clipPath id="master_svg2_19861_77882/0_66271"><rect x="9" y="-12.85546875" width="45.039512634277344" height="45.039512634277344" rx="0"/></clipPath></defs><g clip-path="url(#master_svg0_19861_77882)"><g transform="matrix(1,2.607103866125726e-9,-2.607103866125726e-9,1,0,0)" clip-path="url(#master_svg1_19861_77882/0_66270)"><g transform="matrix(0.8746196627616882,0.48480960726737976,-0.48480960726737976,0.8746196627616882,-5.1040317207807675,-5.975109472637996)" clip-path="url(#master_svg2_19861_77882/0_66271)"><g transform="matrix(1,-6.476300756398583e-17,6.476300756398583e-17,1,0,8.881784197001252e-16)"><path d="M26.23697125,6.50855625C26.23697125,6.50855625,19.727351249999998,3.2889762499999993,19.727351249999998,3.2889762499999993C19.01042125,2.9327062500000007,18.38584725,3.29336625,18.33306625,4.093876249999999C18.33306625,4.093876249999999,17.86683713,11.342456250000001,17.86683713,11.342456250000001C17.81405645,12.142956250000001,18.35505825,13.079756249999999,19.07639125,13.43605625C19.07639125,13.43605625,25.58161125,16.65565625,25.58161125,16.65565625C26.29855125,17.01195625,26.927521249999998,16.65125625,26.97590125,15.85075625C26.97590125,15.85075625,27.44213125,8.60225625,27.44213125,8.60225625C27.499311249999998,7.80175625,26.95391125,6.864856250000001,26.23697125,6.50855625C26.23697125,6.50855625,26.23697125,6.50855625,26.23697125,6.50855625ZM41.160681249999996,-2.10785375C41.160681249999996,-2.10785375,34.651081250000004,-5.32747275,34.651081250000004,-5.32747275C33.93418125,-5.68374175,33.305181250000004,-5.32307375,33.25678125,-4.52256675C33.25678125,-4.52256675,32.79058125,2.72157625,32.79058125,2.72157625C32.73778125,3.522086249999999,33.27878125,4.45894625,34.00008125,4.815256249999999C34.00008125,4.815256249999999,40.50978125,8.03485625,40.50978125,8.03485625C41.22668125,8.39105625,41.85568125,8.03045625,41.904081250000004,7.229956250000001C41.904081250000004,7.229956250000001,42.36588125,-0.014213749999999692,42.36588125,-0.014213749999999692C42.41868125,-0.8147237499999997,41.88208125,-1.75158375,41.160681249999996,-2.10785375C41.160681249999996,-2.10785375,41.160681249999996,-2.10785375,41.160681249999996,-2.10785375Z" fill="#C6C6C6" fill-opacity="1"/></g><g transform="matrix(1,-6.476300756398583e-17,6.476300756398583e-17,1,0,1.7763568394002505e-15)"><path d="M33.627394375,19.054994999999998C33.878094375,19.490434999999998,34.357524375,19.556404999999998,34.814954375,19.292505C34.814954375,19.292505,38.417234375,17.207665,38.417234375,17.207665C38.769104375,17.005345,38.892254375,16.565505,38.694334375,16.213635C38.492004375,15.861754999999999,38.043374375,15.743005,37.691504375,15.940925C37.691504375,15.940925,35.377944375,17.278045,35.377944375,17.278045C35.377944375,17.278045,35.976124375,15.817775000000001,35.976124375,15.817775000000001C36.627094375,14.225555,36.877804375,13.350285,36.235634375000004,12.237485C36.235634375000004,12.237485,36.226834375,12.219895,36.226834375,12.219895C35.509904375,10.9795487,34.133204375,10.698052,32.756504375,11.49416C31.749276375,12.074745,31.335828375,12.796085,31.159893275,13.719745C31.124706175,13.904475,31.159893575,14.115594999999999,31.252259375,14.269545C31.467780375,14.639005000000001,31.934010375,14.762165,32.299074375000004,14.551045C32.527794375,14.419084999999999,32.637754375,14.216765,32.668544375,14.058425C32.804894375,13.447045,32.998414375,13.099575,33.416264375,12.853265C33.939674375,12.554175,34.480674375,12.642135,34.806154375,13.200735C35.122844375,13.750535,35.017284375,14.309125,34.577444375,15.461504999999999C34.577444375,15.461504999999999,33.583404375,18.100545,33.583404375,18.100545C33.455854375,18.448014999999998,33.464654375,18.773495,33.627394375,19.054994999999998Z" fill="#E8E8E8" fill-opacity="1"/></g><g transform="matrix(1,-6.476300756398583e-17,6.476300756398583e-17,1,0,8.881784197001252e-16)"><path d="M48.625490625,9.44625C49.087290625,10.52385,48.893790625,11.74655,48.194390625,12.652650000000001C46.571390625,14.623149999999999,42.982290625000005,17.42485,38.465190625000005,20.09025C34.049190625,22.68975,29.958690625,24.44035,27.464790625,24.93735C26.303590625,25.12645,25.102890625,24.67785,24.377090625,23.71455C24.390290625,23.73215,24.394690625000003,23.75855,24.412290625,23.77615C24.412290625,23.77615,13.847378625,10.10595,13.847378625,10.10595C13.851776625,10.092749999999999,13.873768625,10.09715,13.856175625,10.06195C13.557084625,9.547350000000002,13.741816825,8.88325,14.265224625,8.58415C14.463152625,8.46535,14.687470625,8.44335,14.902990625,8.46095C14.902990625,8.46095,24.689390625,10.479849999999999,24.689390625,10.479849999999999C24.689390625,10.479849999999999,23.972490625,-2.46464,23.972490625,-2.46464C23.954890625,-3.00564,24.231990625,-3.54224,24.742190625,-3.83254C25.217190625,-4.10963,25.775790625,-4.07885,26.220090624999997,-3.84133C26.220090624999997,-3.84133,37.132490625,3.2928499999999996,37.132490625,3.2928499999999996C37.132490625,3.2928499999999996,40.215690625,-6.014138,40.215690625,-6.014138C40.220090625,-6.014138,40.224490625,-5.978951,40.224490625,-5.992146C40.299290625,-6.251651,40.475190624999996,-6.484766,40.730290624999995,-6.634311C41.253790625,-6.933401,41.913490625,-6.761864,42.212590625000004,-6.247252C42.225790625,-6.220862,42.230190625,-6.242854,42.247790625,-6.238456C42.247790625,-6.238456,48.757390625,9.64855,48.757390625,9.64855C48.713390625,9.57815,48.660590625,9.52975,48.625490625,9.44625C48.625490625,9.44625,48.625490625,9.44625,48.625490625,9.44625Z" fill="#E8E8E8" fill-opacity="1"/></g><g transform="matrix(1,-6.476300756398583e-17,6.476300756398583e-17,1,0,1.7763568394002505e-15)"><path d="M30.42204375,5.88982525C33.30738375,4.22723425,36.99323375,5.21247325,38.664643749999996,8.09781125C40.32724375,10.98316125,39.34194375,14.66901125,36.45663375,16.34043125C33.57128375,18.00303125,29.88543375,17.01773125,28.21404675,14.13240125C26.54265875,11.24706125,27.53669575,7.5612112499999995,30.42204375,5.88982525C30.42204375,5.88982525,30.42204375,5.88982525,30.42204375,5.88982525Z" fill="#C6C6C6" fill-opacity="1"/></g><g transform="matrix(1,-6.476300756398583e-17,6.476300756398583e-17,1,0,1.7763568394002505e-15)"><path d="M32.670881875,14.73139875C32.908391875,15.140448750000001,33.361421875,15.20202875,33.788071875,14.955718749999999C33.788071875,14.955718749999999,37.183621875,12.99843875,37.183621875,12.99843875C37.517901875,12.80930875,37.632261875,12.39585875,37.438731875,12.061578749999999C37.249601874999996,11.72729875,36.827351875,11.61733875,36.493071875,11.810868750000001C36.493071875,11.810868750000001,34.311481875,13.068808749999999,34.311481875,13.068808749999999C34.311481875,13.068808749999999,34.878871875,11.69651875,34.878871875,11.69651875C35.490241875,10.19666875,35.732151875,9.36976875,35.125181875,8.32294875C35.125181875,8.32294875,35.116381875,8.30535875,35.116381875,8.30535875C34.439031875,7.13538495,33.141501875,6.87148175,31.848381875,7.61920775C30.902725875,8.16460775,30.506870875,8.84635875,30.339732575,9.71723875C30.304545475,9.88877875,30.339732275,10.08669875,30.423301675,10.24064875C30.621228875,10.58811875,31.061067875,10.70687875,31.412941875,10.50894875C31.628461875,10.38579875,31.729621875,10.196658750000001,31.764811875,10.04271875C31.896761875,9.46652875,32.072691875,9.136648749999999,32.468551875,8.91232875C32.956771875,8.62643875,33.471381875,8.71440875,33.774871875,9.24220875C34.073961875,9.76121875,33.968401875,10.28462875,33.559351875,11.36663875C33.559351875,11.36663875,32.626891875,13.842928749999999,32.626891875,13.842928749999999C32.508141875,14.15520875,32.512531875,14.45869875,32.670881875,14.73139875Z" fill="#E8E8E8" fill-opacity="1"/></g></g></g></g></svg>
\ No newline at end of file
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="36" height="36" viewBox="0 0 36 36"><defs><clipPath id="master_svg0_19861_77901"><rect x="0" y="0" width="36" height="36" rx="0"/></clipPath><clipPath id="master_svg1_19861_77901/0_66277"><rect x="0" y="0" width="36" height="36" rx="0"/></clipPath><clipPath id="master_svg2_19861_77901/0_66278"><rect x="8.9775390625" y="-12.85546875" width="45.03792953491211" height="45.03792953491211" rx="0"/></clipPath></defs><g clip-path="url(#master_svg0_19861_77901)"><g transform="matrix(1,2.607103866125726e-9,-2.607103866125726e-9,1,0,0)" clip-path="url(#master_svg1_19861_77901/0_66277)"><g transform="matrix(0.874619722366333,0.48480960726737976,-0.48480960726737976,0.874619722366333,-5.106848415802233,-5.964219428104116)" clip-path="url(#master_svg2_19861_77901/0_66278)"><g transform="matrix(1,-6.476300756398583e-17,6.476300756398583e-17,1,0,8.881784197001252e-16)"><path d="M26.2181265625,6.465187500000001C26.2181265625,6.465187500000001,19.7087365625,3.2456975000000003,19.7087365625,3.2456975000000003C18.991826562500002,2.8894374999999997,18.3672745625,3.2500975000000007,18.3144955625,4.050577499999999C18.3144955625,4.050577499999999,17.8482823125,11.2988875,17.8482823125,11.2988875C17.7955034625,12.099387499999999,18.3364865625,13.0361875,19.057796562500002,13.392387500000002C19.057796562500002,13.392387500000002,25.5627865625,16.6118875,25.5627865625,16.6118875C26.2796965625,16.9681875,26.9086465625,16.6075875,26.957026562499998,15.807087500000002C26.957026562499998,15.807087500000002,27.4232365625,8.5587875,27.4232365625,8.5587875C27.4804165625,7.7582875,26.935036562500002,6.8214875,26.2181265625,6.465187500000001C26.2181265625,6.465187500000001,26.2181265625,6.465187500000001,26.2181265625,6.465187500000001ZM41.1413265625,-2.1509425C41.1413265625,-2.1509425,34.6319265625,-5.3704465,34.6319265625,-5.3704465C33.9150265625,-5.7267035,33.2861265625,-5.3660475,33.2377265625,-4.5655685C33.2377265625,-4.5655685,32.7715265625,2.6783275,32.7715265625,2.6783275C32.7187265625,3.4788075000000003,33.2597265625,4.415627499999999,33.9810265625,4.7718875C33.9810265625,4.7718875,40.490426562500005,7.9913875,40.490426562500005,7.9913875C41.2073265625,8.3476875,41.8362265625,7.9869875,41.8846265625,7.1864875C41.8846265625,7.1864875,42.3464265625,-0.057372499999999604,42.3464265625,-0.057372499999999604C42.399226562500004,-0.8578524999999999,41.8626265625,-1.7946825,41.1413265625,-2.1509425C41.1413265625,-2.1509425,41.1413265625,-2.1509425,41.1413265625,-2.1509425Z" fill="#AA733D" fill-opacity="1"/></g><g transform="matrix(1,-6.476300756398583e-17,6.476300756398583e-17,1,0,1.7763568394002505e-15)"><path d="M33.6048434375,19.00784C33.8555434375,19.443260000000002,34.3349534375,19.50924,34.7923634375,19.24534C34.7923634375,19.24534,38.3945234375,17.16058,38.3945234375,17.16058C38.7463834375,16.95826,38.8695334375,16.51844,38.671603437499996,16.16658C38.4692934375,15.814720000000001,38.0206734375,15.69596,37.6688134375,15.893889999999999C37.6688134375,15.893889999999999,35.3553434375,17.23095,35.3553434375,17.23095C35.3553434375,17.23095,35.953503437500004,15.77074,35.953503437500004,15.77074C36.6044334375,14.17857,36.8551434375,13.303329999999999,36.2129934375,12.19057C36.2129934375,12.19057,36.2042034375,12.172979999999999,36.2042034375,12.172979999999999C35.4872834375,10.932676,34.1106334375,10.651189,32.7339934375,11.44727C31.7267944375,12.02784,31.3133614375,12.74915,31.1374318375,13.67278C31.1022460375,13.8575,31.1374321375,14.06862,31.2297954375,14.22256C31.4453084375,14.59201,31.9115224375,14.715160000000001,32.2765734375,14.50404C32.5052834375,14.3721,32.6152334375,14.16978,32.6460234375,14.01144C32.7823734375,13.40009,32.9758934375,13.05263,33.3937234375,12.806329999999999C33.9171134375,12.507249999999999,34.4581034375,12.59521,34.7835734375,13.15378C35.1002434375,13.70356,34.9946834375,14.26214,34.5548634375,15.414480000000001C34.5548634375,15.414480000000001,33.560863437500004,18.05342,33.560863437500004,18.05342C33.4333134375,18.40088,33.4421134375,18.72635,33.6048434375,19.00784Z" fill="#E5E5E5" fill-opacity="1"/></g><g transform="matrix(1,-6.476300756398583e-17,6.476300756398583e-17,1,0,8.881784197001252e-16)"><path d="M48.6017296875,9.39486875C49.0635296875,10.47246875,48.8700296875,11.69516875,48.1707296875,12.60116875C46.5478296875,14.57156875,42.9588296875,17.37326875,38.441829687500004,20.03856875C34.0260296875,22.63796875,29.9356296875,24.38846875,27.4418296875,24.88546875C26.2807296875,25.07456875,25.0800296875,24.62596875,24.354329687499998,23.66276875C24.3675296875,23.68036875,24.3719296875,23.70666875,24.389429687499998,23.72426875C24.389429687499998,23.72426875,13.8249126875,10.054568750000001,13.8249126875,10.054568750000001C13.8293106875,10.04136875,13.8513016875,10.04576875,13.8337096875,10.010568750000001C13.5346286875,9.49596875,13.7193548875,8.83186875,14.2427446875,8.53276875C14.4406656875,8.41406875,14.6649756875,8.39206875,14.880489687499999,8.40966875C14.880489687499999,8.40966875,24.666529687500002,10.42846875,24.666529687500002,10.42846875C24.666529687500002,10.42846875,23.9496296875,-2.51557125,23.9496296875,-2.51557125C23.9320296875,-3.05655125,24.209129687500003,-3.59314125,24.7193296875,-3.88342125C25.1943296875,-4.16051125,25.7529296875,-4.129721249999999,26.197129687500002,-3.89222125C26.197129687500002,-3.89222125,37.1091296875,3.2417687500000003,37.1091296875,3.2417687500000003C37.1091296875,3.2417687500000003,40.1923296875,-6.06494525,40.1923296875,-6.06494525C40.196729687499996,-6.06494525,40.2011296875,-6.02976025,40.2011296875,-6.04295425C40.275929687499996,-6.30245025,40.451829687499995,-6.53555725,40.7069296875,-6.68509725C41.2303296875,-6.98417725,41.890029687500004,-6.81264585,42.1891296875,-6.29805225C42.2023296875,-6.27166325,42.2067296875,-6.29365425,42.2243296875,-6.28925625C42.2243296875,-6.28925625,48.7337296875,9.597168750000002,48.7337296875,9.597168750000002C48.6897296875,9.526768749999999,48.6369296875,9.478468750000001,48.6017296875,9.39486875C48.6017296875,9.39486875,48.6017296875,9.39486875,48.6017296875,9.39486875Z" fill="#CA9561" fill-opacity="1"/></g><g transform="matrix(1,-6.476300756398583e-17,6.476300756398583e-17,1,0,1.7763568394002505e-15)"><path d="M30.4014259375,5.84292225C33.2866659375,4.18038925,36.9723859375,5.16559325,38.6437359375,8.05083625C40.3062359375,10.93607625,39.3210359375,14.62179625,36.4358059375,16.29315625C33.5505659375,17.95565625,29.8648359375,16.970456249999998,28.1935109375,14.08521625C26.5221809375,11.199976249999999,27.516182937499998,7.51425625,30.4014259375,5.84292225C30.4014259375,5.84292225,30.4014259375,5.84292225,30.4014259375,5.84292225Z" fill="#AA733D" fill-opacity="1"/></g><g transform="matrix(1,-6.476300756398583e-17,6.476300756398583e-17,1,0,1.7763568394002505e-15)"><path d="M35.3716753125,14.38191875C36.6955453125,13.61662875,37.0298153125,12.327948750000001,36.3876753125,11.20638875C36.3876753125,11.20638875,36.3788753125,11.18879875,36.3788753125,11.18879875C35.7411353125,10.084848749999999,34.7119453125,10.12002875,33.823505312500004,10.44549875C33.823505312500004,10.44549875,34.3424953125,8.66421875,34.3424953125,8.66421875C34.4480553125,8.29916075,34.5008253125,8.03086975,34.3073053125,7.70979775C34.1049853125,7.35354095,33.6959553125,7.29636425,33.3133053125,7.51627575C33.3133053125,7.51627575,30.4280633125,9.19639875,30.4280633125,9.19639875C30.1245846125,9.37232875,30.0146276125,9.77256875,30.1905570125,10.08044875C30.3664863125,10.383928749999999,30.7667263125,10.49387875,31.0746023125,10.31794875C31.0746023125,10.31794875,32.8954753125,9.26676875,32.8954753125,9.26676875C32.8954753125,9.26676875,32.4204653125,11.08763875,32.4204653125,11.08763875C32.3368953125,11.40431875,32.3456953125,11.60663875,32.4468553125,11.78256875C32.6227853125,12.08603875,33.0230253125,12.195998750000001,33.3308953125,12.02006875C33.3308953125,12.02006875,33.5332153125,11.90131875,33.5332153125,11.90131875C34.2589253125,11.479088749999999,34.848285312499996,11.50107875,35.1297753125,11.98487875C35.1297753125,11.98487875,35.1385753125,12.00247875,35.1385753125,12.00247875C35.3936653125,12.44669875,35.2045453125,12.926108750000001,34.716345312499996,13.20758875C34.2501253125,13.48027875,33.8103053125,13.53305875,33.3001053125,13.436298749999999C33.1461753125,13.41430875,32.9746453125,13.40990875,32.7899153125,13.51546875C32.4512553125,13.70898875,32.3280953125,14.16640875,32.5216253125,14.50506875C32.6315753125,14.68979875,32.8338953125,14.80854875,33.0098253125,14.84373875C33.7355353125,14.97567875,34.5272153125,14.87012875,35.3716753125,14.38191875C35.3716753125,14.38191875,35.3716753125,14.38191875,35.3716753125,14.38191875Z" fill="#CA9561" fill-opacity="1"/></g></g></g></g></svg>
\ No newline at end of file
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="26" height="34" viewBox="0 0 26 34"><g><path d="M16.9031,0.152465C15.9999,-0.199231,14.9767,0.0708806,14.3558,0.824935L0.441621,18.1845C-0.0575011,18.7944,-0.14133,19.6518,0.229928,20.3496C0.621826,21.0683,1.37413,21.5077,2.18242,21.4935L7.85446,21.4935L7.85446,31.9328C7.8737,32.8507,8.48255,33.646,9.35207,33.8897C9.57426,33.9608,9.80696,33.9964,10.0396,34C10.7167,34.0035,11.3606,33.6958,11.7892,33.1603L25.5704,15.484C26.0673,14.8613,26.1355,14.0252,25.7628,13.3314C25.3919,12.6287,24.6449,12.1982,23.8173,12.1982L17.1043,12.1982L18.2643,2.2944C18.3745,1.36041,17.8251,0.497596,16.9031,0.152465Z" fill="#FFFFFF" fill-opacity="1"/></g></svg>
\ No newline at end of file
......@@ -53,6 +53,7 @@ body {
}
}
.flex {
display: flex;
}
......@@ -62,8 +63,8 @@ body {
}
.header {
height: 6vh;
width: 60vw;
height: 11vh;
width: 65vw;
max-width: 766px;
background: url('./assets/top-bg.png') no-repeat;
background-size: 100% 100%;
......@@ -72,10 +73,11 @@ body {
right: 0;
margin: auto;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
color: #fff;
font-size: 30px;
font-size: 24px;
padding-bottom: 10px;
}
......@@ -136,7 +138,7 @@ body {
flex: 2;
}
.echarts-box1#distribution-charts {
#distribution-charts {
height: 380px;
flex: 2;
background: rgba(8, 16, 24, 0.27);
......@@ -175,6 +177,12 @@ body {
flex-shrink: 0;
}
.top-15-wrap > .items .index img {
width: 22px;
height: 18px;
margin-top: 3px;
}
.top-15-wrap > .items .company-name {
margin: 0 20px 0 10px;
width: 300px;
......@@ -267,12 +275,12 @@ body {
.production-portrait-bottom {
background: rgba(8, 16, 24, 0.27);
padding: 10px 0 25px 55px;
margin-top:30px;
margin-top: 30px;
}
.production-portrait > div {
width: calc(100% / 2 - 10px);
height: 300px;
height: 380px;
display: inline-flex;
}
......@@ -298,6 +306,17 @@ body {
box-sizing: border-box;
white-space: wrap;
text-align: center;
margin-top: 30px;
}
.popup > p {
position: absolute;
top: 30px;
left: 30px;
ont-size: 18px;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #FFFFFF;
}
.popup > span:nth-of-type(1) {
......@@ -325,6 +344,7 @@ body {
position: relative;
width: 110px;
height: 110px;
margin-top: 30px;
}
.popup > div:nth-of-type(1) > span {
......@@ -445,9 +465,11 @@ body {
.echarts-title-repair-left {
margin-right: 3%;
}
.echarts-title-repair-all{
.echarts-title-repair-all {
margin-top: 20px;
}
.echarts-title-repair-list {
display: flex;
margin-top: 13px;
......@@ -499,7 +521,7 @@ body {
.chart-desc-task-two {
position: relative;
display: flex;
width: 85%;
width: 90%;
margin-top: 15px;
}
......@@ -508,9 +530,15 @@ body {
bottom: 0;
left: 0;
top: 10px;
height: 30px;
width:300px;
}
width: 100%
}
@media screen and (min-width: 1650px) {
.chart-desc-task-two img {
top: 2%;
}
}
.chart-desc-task {
position: relative;
......@@ -540,7 +568,7 @@ body {
.chart-desc-text-left {
display: flex;
justify-content: space-between;
width: 280px;
width: 85%;
}
.chart-desc-value-two {
......@@ -633,11 +661,25 @@ body {
border: 2px solid #5cb3ff;
}
.chart-desc-centerPro-icon2 {
width: 8px;
height: 8px;
background: rgba(63, 241, 217, 0.302);
border: 1px solid #3ff1d9;
}
.chart-desc-centerPro-icon3 {
width: 8px;
height: 8px;
background: rgba(255, 100, 100, 0.302);
border: 1px solid #ff6464;
}
.echarts-box1-right {
display: flex;
align-items: center;
justify-content: center;
padding-right: 50px;;
padding-right: 70px;;
flex: 1;
}
......@@ -647,6 +689,7 @@ body {
align-items: center;
justify-content: center;
}
.invest-wrapper-content1 {
height: 108px;
......@@ -667,9 +710,11 @@ body {
.invest-wrapper-right-bracket img {
height: 68px;
}
.invest-wrapper-left-bracket1 img {
height: 108px;
}
.invest-wrapper-content-customers {
color: #c8565b;
}
......@@ -691,7 +736,7 @@ body {
background: rgba(8, 16, 24, 0.27);
padding: 15px;
margin-right: 30px;
height: 304px;
height: 354px;
}
#repair-require6 {
......@@ -703,16 +748,33 @@ body {
flex: 1;
background: rgba(8, 16, 24, 0.27);
padding: 15px;
height: 304px;
height: 354px;
}
#repair-require7 {
height: 200px;
margin-top: -10px;
background: url('./assets/yd.svg') no-repeat;
background-position: 50%;
}
.centerPro-total {
font-size: 30px;
font-family: DINAlternate-Bold-Regular, DINAlternate-Bold;
font-weight: 400;
color: #FFFFFF;
text-align: center;
margin-top: -20px;
margin-bottom: 10px;
}
.centerPro-total span:nth-of-type(2) {
font-size: 18px;
}
.chart-desc-task-centerPro {
display: flex;
justify-content: space-around;
}
.chart-centerPro-text {
......@@ -720,6 +782,7 @@ body {
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #FFFFFF;
margin-left: 10px;
}
.chart-desc-task-right {
......@@ -733,8 +796,8 @@ body {
.chart-desc-task-title {
display: flex;
justify-content: space-between;
width: 70%;
align-items: center;
}
.chart-centerPro-value {
......@@ -742,7 +805,13 @@ body {
font-family: DINAlternate-Bold-Regular, DINAlternate-Bold;
font-weight: 400;
color: #FFFFFF;
width: 90%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
-o-text-overflow: ellipsis;
margin-left: 20px;
margin-top: 14px;
}
.centerPro-right-title {
......@@ -780,11 +849,18 @@ body {
margin-left: 20px;
margin-top: 13px;
}
.echarts-timePeriod1{
padding: 0 20px 20px 0;
background: rgba(8, 16, 24, 0.27);
.echarts-timePeriod1 {
padding: 20px;
background: rgba(8, 16, 24, 0.27);
margin-bottom: 24px;
}
.echarts-content {
padding: 20px;
background: rgba(8, 16, 24, 0.27);
}
.echarts-timePeriod {
height: 360px;
......@@ -864,7 +940,7 @@ body {
width: 100%;
height: 20px;
background: rgba(8, 16, 24, 0.27);
padding-top: 20px;
padding-top: 20px;
}
.timePeriod-legend2 {
......
......@@ -13,7 +13,8 @@
<body>
<div class="energy-wrap">
<div class="header">
成阿园区月度用电报告
<div>园区名or企业名</div>
<div>2023-05月度用电报告</div>
</div>
<!-- 用电趋势 -->
<div class="chart-wrap">
......@@ -21,7 +22,9 @@
<img src="./assets/title-arrow.png" alt="">
用电趋势
</div>
<div id="repair-require" class="echarts-box"></div>
<div class="echarts-content">
<div class="echarts-box" id="repair-require"></div>
</div>
</div>
<!-- 企业用电量排名TOP15 -->
<div class="top-15">
......@@ -31,13 +34,25 @@
</div>
<div class="top-15-wrap">
<div class="items">
<span class="index">01</span>
<span class="index"><img src="./assets/no-1.svg"></span>
<p class="company-name text-overflow">成都金瑞纳生物科技有限公司</p>
<p class="process"><span style="width: 70%;"></span></p>
<p class="unit text-overflow">90000<span>MWh</span></p>
</div>
<div class="items">
<span class="index"><img src="./assets/no-2.svg"></span>
<p class="company-name text-overflow">成都金瑞纳生物科技有限公司</p>
<p class="process"><span style="width: 70%;"></span></p>
<p class="unit text-overflow">90000<span>MWh</span></p>
</div>
<div class="items">
<span class="index"><img src="./assets/no-3.svg"></span>
<p class="company-name text-overflow">成都金瑞纳生物科技有限公司</p>
<p class="process"><span style="width: 70%;"></span></p>
<p class="unit text-overflow">90000<span>MWh</span></p>
</div>
<div class="items">
<span class="index">02</span>
<span class="index">03</span>
<p class="company-name text-overflow">成都金瑞纳生物科技有限公司</p>
<p class="process"><span style="width: 70%;"></span></p>
<p class="unit text-overflow">90000<span>MWh</span></p>
......@@ -57,6 +72,7 @@
</div>
<div class="production-portrait">
<div class="left popup">
<p>工作制</p>
<span></span>
<span></span>
<span>白天8小时制</span>
......@@ -65,6 +81,8 @@
<span>非规律生产</span>
</div>
<div class="right popup">
<p>生产状态</p>
<span></span>
<span></span>
<span>白天8小时制</span>
......@@ -75,14 +93,71 @@
</div>
<div class="production-portrait-bottom">
<div class="echarts-title-repair-list"><img src="./assets/icon1.png">
<div class="echarts-title-repair-list-right"><span>达产率:一共有<span
class="echarts-title-repair-list-right-red">880家</span>企业在<span
class="echarts-title-repair-list-right-red">2023年5月</span>已达到往期正常生产水平,<span
class="echarts-title-repair-list-right-red">占比61%</span></span></div>
<div class="echarts-title-repair-list-right">
<span> <span
class="echarts-title-repair-list-right-red">成都精亮科技有限公司</span><span
class="echarts-title-repair-list-right-red">24小时工作制,</span>当前生产状态为<span
class="echarts-title-repair-list-right-red">不景气,</span>请持续关注该企业生产情况</span></div>
</div>
</div>
<!-- 月度用电分析 -->
<div class="chart-wrap">
<div class="title">
<img alt="" src="./assets/title-arrow.png"/>
月度用电分析
</div>
<div class="echarts-content">
<div class="echarts-box" id="month-power"></div>
<div class="echarts-title-repair-list"><img src="./assets/icon1.png">
<div class="echarts-title-repair-list-right">
<span>分析可知<span
class="echarts-title-repair-list-right-red">3日、5日、12日、20日、22日</span>用电较多,分别为<span
class="echarts-title-repair-list-right-red">29385KWh、29385KWh、29385KWh、29385KWh、29385KWh</span> </span>
</div>
</div>
</div>
</div>
<!-- 月度功率因数趋势 -->
<div class="chart-wrap">
<div class="title">
<img alt="" src="./assets/title-arrow.png"/>
月度功率因数趋势
</div>
<div class="echarts-content">
<div class="echarts-box" id="month-trend"></div>
<div class="echarts-title-repair-list">
<img src="./assets/icon1.png"/>
<div class="echarts-title-repair-list-right">
<span
>分析可知<span class="echarts-title-repair-list-right-red"
>3日</span
>该企业当日的平均功率因数低于0.8,需要密切关注,必要时加装或启用无功补偿装置,提高企业用电功率因数。</span
>
</div>
</div>
<div class="echarts-title-repair-list">
<img src="./assets/icon1.png"/>
<div class="echarts-title-repair-list-right">
<span>分析可知该企业每日的平均功率因数均高于0.8,请持续关注。</span>
</div>
</div>
<div class="echarts-title-repair-list">
<img src="./assets/icon1.png"/>
<div class="echarts-title-repair-list-right">
<span
>分析可知<span class="echarts-title-repair-list-right-red"
>5日</span
>功率因数不稳定,请密切关注。</span
>
</div>
</div>
</div>
</div>
<!-- 功率因数企业分布 -->
<div class="distribution">
<div class="title">
......@@ -90,7 +165,7 @@
功率因数企业分布
</div>
<div class="distribution-wrap ">
<div id="distribution-charts" class="echarts-box1"></div>
<div id="distribution-charts"></div>
<div class="distribution-right">
<div id="slide">
<div id="slide1" class="distribution-right-top">
......@@ -138,10 +213,19 @@
</div>
</div>
</div>
<div class="production-portrait-bottom">
<div class="echarts-title-repair-list"><img src="./assets/icon1.png">
<div class="echarts-title-repair-list-right">
<span>其中功率因数大于等于0.8的企业的总用电量为<span
class="echarts-title-repair-list-right-red">【用电量】</span><span
class="echarts-title-repair-list-right-red">24小时工作制,</span>KWh,占总用电量的<span
class="echarts-title-repair-list-right-red">【占比百分比】。</span>功率因数小于0.8的企业的总用电量为<span
class="echarts-title-repair-list-right-red">【用电量】</span>KWh,占总用电量的<span
class="echarts-title-repair-list-right-red">【占比百分比】。</span></span></div>
</div>
</div>
</div>
<!-- 月度功率因数趋势 -->
<!-- 分时段企业用电情况分析 -->
<div class="timePeriod">
<div class="title">
......@@ -160,6 +244,11 @@
</div>
<div class="echarts-timePeriod1">
<div id="timePeriod-barCharts-1" class="echarts-timePeriod"></div>
<div class="echarts-title-repair-list"><img src="./assets/icon1.png">
<div class="echarts-title-repair-list-right">
<span>根据以上数据显示,该企业在<span
class="echarts-title-repair-list-right-red">生产时段1、生产时段2、生产时段3</span>进行生产的频率最高</span></div>
</div>
</div>
<!-- 各时段生产企业 月度平均数(家) -->
......@@ -207,32 +296,33 @@
</div>
<div id="repair-require6"></div>
<div class="echarts-title-repair-list"><img src="./assets/icon1.png">
<div class="echarts-title-repair-list-right">
<span>根据以上数据显示,该企业在<span
class="echarts-title-repair-list-right-red">集中生产时段1、集中生产时段2、集中生产时段3</span>进行集中生产的频率最高</span>
</div>
</div>
</div>
<div class="centerPro-right">
<div class="centerPro-right-title">集中生产时段用电量占比</div>
<div id="repair-require7"></div>
<div>
<div class="chart-desc-task">
<div class="chart-desc-icon chart-desc-icon2"></div>
<div class="chart-desc-task-right">
<div class="chart-desc-task-title">
<div class="chart-centerPro-text">非集中生产时间段</div>
<div class="chart-centerPro-value">75%</div>
</div>
<div class="chart-centerPro-value">200KWh</div>
<div class="centerPro-total"><span>20011111.11</span><span>KWh</span></div>
<div class="chart-desc-task-centerPro">
<div class="chart-desc-task-centerPro-list">
<div class="chart-desc-task-title">
<div class="chart-desc-centerPro-icon2"></div>
<div class="chart-centerPro-text">非集中生产时间段</div>
</div>
<div class="chart-centerPro-value">75%</div>
<div class="chart-centerPro-value" title="20011111.11KWh">20011111.11KWh</div>
</div>
<div class="chart-desc-task-centerPro">
<div class="chart-desc-icon chart-desc-icon3"></div>
<div class="chart-desc-task-right">
<div class="chart-desc-task-title">
<div class="chart-centerPro-text">集中生产时间段</div>
<div class="chart-centerPro-value">7.25%</div>
</div>
<div class="chart-centerPro-value">20KWh</div>
<div class="chart-desc-task-centerPro-list">
<div class="chart-desc-task-title">
<div class="chart-desc-centerPro-icon3"></div>
<div class="chart-centerPro-text">集中生产时间段</div>
</div>
<div class="chart-centerPro-value">7.25%</div>
<div class="chart-centerPro-value">20KWh</div>
</div>
</div>
</div>
......@@ -280,11 +370,12 @@
<div class="timePeriod-legend">
<img src="./assets/legend.svg" class="timePeriod-legend-img"/>
</div>
<div class="echarts-timePeriod1"> <div id="timePeriod-barCharts-3" class="echarts-timePeriod"></div></div>
<div class="echarts-timePeriod1">
<div class="echarts-timePeriod" id="timePeriod-barCharts-3"></div>
</div>
</div>
</div>
<!--用电结构-->
<div class="flex electricity-content">
<div class=" echarts-box2">
......@@ -454,9 +545,7 @@
let slide1 = document.getElementById("slide1");
let listH = document.getElementsByClassName('distribution-right-top-list')[0]
slide2.innerHTML = slide1.innerHTML
function rowUp() {
if (slide2.offsetTop - slide.scrollTop <= 0)
slide.scrollTop -= slide1.offsetHeight
else {
......@@ -464,7 +553,6 @@
slide.scrollTop++
}
}
let timer = setInterval(rowUp, speed)
slide.onmouseover = function () {
clearInterval(timer) , $(slide).css(
......@@ -480,7 +568,6 @@
}
var myChart7, myChart8, myChart9, myChart10, myChart11;
const myChart = {}
function initEcharts(el, option) {
......@@ -489,9 +576,7 @@
option && ele.setOption({...option})
}
const getOption = () => {
return {}
}
//用电趋势
const getEcharts = () => {
let option = {
tooltip: {
......@@ -506,42 +591,42 @@
color: "#fff"
},
},
dataZoom: [//给x轴设置滚动条
{
type: 'slider',//slider表示有滑动块的,inside表示内置的
// startValue: 8,//可用于设置开始显示的柱子的长度
// endValue: 1,//可用于设置结束显示的柱子的长度
start: 80,//默认为0 可设置滚动条从在后进行展示
end: 100,//默认为100
show: true,
xAxisIndex: [0],
handleSize: 0,//滑动条的 左右2个滑动条的大小
height: 8,//组件高度
left: '10%', //左边的距离
right: '10%',//右边的距离
bottom: -2,//右边的距离
borderColor: "#F4F4F4",
fillerColor: '#E7E7E7',
backgroundColor: '#F4F4F4',//两边未选中的滑动条区域的颜色
showDataShadow: false,//是否显示数据阴影 默认auto
showDetail: false,//即拖拽时候是否显示详细数值信息 默认true
realtime: true, //是否实时更新
filterMode: 'filter',
handleStyle: {
borderRadius: '20',
},
},
//下面这个属性是里面拖到
{
type: 'inside',
show: true,
xAxisIndex: [0],
start: 0,//默认为1
end: 100,//默认为100
moveOnMouseWheel: false,
preventDefaultMouseMove: false,
},
],
// dataZoom: [//给x轴设置滚动条
// {
// type: 'slider',//slider表示有滑动块的,inside表示内置的
// // startValue: 8,//可用于设置开始显示的柱子的长度
// // endValue: 1,//可用于设置结束显示的柱子的长度
// start: 80,//默认为0 可设置滚动条从在后进行展示
// end: 100,//默认为100
// show: true,
// xAxisIndex: [0],
// handleSize: 0,//滑动条的 左右2个滑动条的大小
// height: 8,//组件高度
// left: '10%', //左边的距离
// right: '10%',//右边的距离
// bottom: -2,//右边的距离
// borderColor: "#F4F4F4",
// fillerColor: '#E7E7E7',
// backgroundColor: '#F4F4F4',//两边未选中的滑动条区域的颜色
// showDataShadow: false,//是否显示数据阴影 默认auto
// showDetail: false,//即拖拽时候是否显示详细数值信息 默认true
// realtime: true, //是否实时更新
// filterMode: 'filter',
// handleStyle: {
// borderRadius: '20',
// },
// },
// //下面这个属性是里面拖到
// {
// type: 'inside',
// show: true,
// xAxisIndex: [0],
// start: 0,//默认为1
// end: 100,//默认为100
// moveOnMouseWheel: false,
// preventDefaultMouseMove: false,
// },
// ],
xAxis: [
{
axisLine: {
......@@ -569,37 +654,38 @@
data: ['2018年', '2019年', '2020年', '2021年', '2022年']
}
],
yAxis: [{
name: '单位:MWh',
alignWithLabel: true,
"position": "left",
nameTextStyle: {
color: '#fff',
},
type: 'value',
splitLine: {
show: true,
lineStyle: {
type: 'dashed',//线的类型 虚线0
opacity: 0.2//透明度
yAxis: [
{
name: '单位:MWh',
alignWithLabel: true,
"position": "left",
nameTextStyle: {
color: '#fff',
},
},
axisTick: {
show: false
},
axisLine: {
show: true,
lineStyle: {
width: 1,
color: 'rgba(8, 16, 24, 0.27)'
type: 'value',
splitLine: {
show: true,
lineStyle: {
type: 'dashed',//线的类型 虚线0
opacity: 0.2//透明度
},
},
textStyle: {
color: '#fff',
fontSize: '10'
}
},
axisLabel: {
textStyle: {
axisTick: {
show: false
},
axisLine: {
show: true,
lineStyle: {
width: 1,
color: 'rgba(8, 16, 24, 0.27)'
},
textStyle: {
color: '#fff',
fontSize: '10'
}
},
axisLabel: {
textStyle: {
color: 'rgba(255, 255, 255, 1)',
}
},
......@@ -609,7 +695,6 @@
color: '#fff',
align: 'left',
},
// nameLocation: 'end',
type: 'value',
position: 'right',
splitLine: {show: false},
......@@ -641,6 +726,8 @@
{offset: 0, color: 'rgba(63, 241, 217, 1)'},
])
},
stack: "one",
},
{
name: '去年用电量',
......@@ -682,7 +769,7 @@
},
showBackground: true,
data: [50, 110, 110, 210, 150],//这个数据无所谓,反正不显示,只要data的长度和另外两个一样长就行了
barWidth: '50%',
barWidth: '60%',
backgroundStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{offset: 0, color: 'rgba(255, 255, 255, 0.05)'},
......@@ -702,22 +789,13 @@
initEcharts('#repair-require', option)
}
getEcharts();
//功率因数企业分布
const getEcharts2 = () => {
var option = {
tooltip: {
//提示框组件
trigger: 'axis',
tooltip: {
trigger: "axis",
axisPointer: {
//type: "shadow",
},
},
},
grid: {
left: '1%',
right: '1%',
right: '5%',
bottom: '6%',
top: 30,
padding: '0 0 10 0',
......@@ -731,58 +809,56 @@
color: "#fff"
},
},
dataZoom: [//给x轴设置滚动条
{
type: 'slider',//slider表示有滑动块的,inside表示内置的
// startValue: 8,//可用于设置开始显示的柱子的长度
// endValue: 1,//可用于设置结束显示的柱子的长度
start: 80,//默认为0 可设置滚动条从在后进行展示
end: 100,//默认为100
show: true,
xAxisIndex: [0],
handleSize: 0,//滑动条的 左右2个滑动条的大小
height: 8,//组件高度
left: '10%', //左边的距离
right: '10%',//右边的距离
bottom: -2,//右边的距离
borderColor: "#F4F4F4",
fillerColor: '#E7E7E7',
backgroundColor: '#F4F4F4',//两边未选中的滑动条区域的颜色
showDataShadow: false,//是否显示数据阴影 默认auto
showDetail: false,//即拖拽时候是否显示详细数值信息 默认true
realtime: true, //是否实时更新
filterMode: 'filter',
handleStyle: {
borderRadius: '20',
},
},
//下面这个属性是里面拖到
{
type: 'inside',
show: true,
xAxisIndex: [0],
start: 0,//默认为1
end: 100,//默认为100
moveOnMouseWheel: false,
preventDefaultMouseMove: false,
tooltip: {
trigger: 'axis',
borderWidth: 0,
textStyle: {
lineHeight: 20,
},
formatter: function (params) {
let data;
if (!(Number(params[0].axisValue) * 10 - 1)) {
data = `0 - ${params[0].axisValue}`;
} else {
data = `0.${(Number(params[0].axisValue) * 10 - 1)} - ${params[0].axisValue}`;
}
let tip = '';
tip += `<div style=" width: 200px; padding-bottom: 5px;"><div>${data}</div> </div>`;
for (let i = 0; i < params.length; i++) {
tip += `<div style="display: flex;width: 200px;justify-content: space-between; align-items: center;margin-top: 5px"> <div>${
params[i].marker + params[i].seriesName
}</div><div>${params[i].value}</div></div>`;
}
return tip;
},
],
},
xAxis: [
{
type: 'category',
name: '功率因数',
nameTextStyle: {
color: '#fff',
verticalAlign: 'bottom',
lineHeight: -26,
},
boundaryGap: true, //坐标轴两边留白
data: ['7:00', '8:00', '9:00', '10:00', '11:00', '12:00', '13:00', '14:00', '17:00', '8:00'],
data: ['0.1', '0.2', '0.3', '0.4', '0.5', '0.6', '0.7', '0.8', '0.9', '1.0'],
axisLabel: {
//坐标轴刻度标签的相关设置。
interval: 0, //设置为 1,表示『隔一个标签显示一个标签』
margin: 15,
interval: 'auto', //设置为 1,表示『隔一个标签显示一个标签』
// margin: 15,
textStyle: {
color: 'rgba(255, 255, 255, 1)',
}
},
// align: 'center',
padding: [0, 0, 0, 65]
},
// offset:5,
axisTick: {
//坐标轴刻度相关设置。
show: false,
show: true,
},
axisLine: {
//坐标轴轴线相关设置
......@@ -795,6 +871,11 @@
show: false,
},
},
{
type: 'category',
show: false,
data: ['7:00', '8:00', '9:00', '10:00', '11:00', '12:00', '13:00', '14:00', '17:00', '8:00'],
}
],
yAxis: [
{
......@@ -802,7 +883,7 @@
nameTextStyle: {
color: '#fff',
},
name: '企业数',
name: '企业数:ge',
position: 'left',
splitNumber: 5,
axisLabel: {
......@@ -829,13 +910,14 @@
nameTextStyle: {
color: '#fff',
},
name: '用电量',
name: '用电量:KWH',
position: 'right',
splitNumber: 5,
// splitNumber: 5,
axisLabel: {
textStyle: {
color: 'rgba(255, 255, 255, 1)',
}
},
padding: [0, 20, 0, 0]
},
axisLine: {
show: false,
......@@ -854,7 +936,7 @@
],
series: [
{
name: '企业数',
name: '企业数:个',
yAxisIndex: 0,
type: 'pictorialBar', //设置类型为象形柱状图
symbol: 'roundRect', //图形类型,带圆角的矩形
......@@ -887,7 +969,7 @@
stack: '2',
},
{
name: '用电数',
name: '用电数:KWH',
yAxisIndex: 1,
type: 'pictorialBar', //设置类型为象形柱状图
symbol: 'roundRect', //图形类型,带圆角的矩形
......@@ -915,558 +997,776 @@
barGap: 0, //柱间距离
symbolRepeat: true, //图形是否重复
symbolSize: [14, 5], //图形元素的尺寸
data: [2.9, 5, 4.4, 2.7, 5.7, 9, 5, 4, 2, 4],
data: [29, 522, 40, 2.7, 5.7, 9, 5, 4, 2, 4],
animationEasing: 'elasticOut', //动画效果
stack: '1',
},
{
xAxisIndex: 1,
itemStyle: {
show: false,
color: 'transparent',
opacity: 0//透明度
},
showBackground: true,
data: [2.9, 5, 4.4, 2.7, 5.7, 9, 5, 4, 2, 4],
barWidth: '60%',
backgroundStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{offset: 0, color: 'rgba(255, 255, 255, 0.05)'},
{offset: 1, color: 'rgba(255, 255, 255, 0.05)'},
])
},
z: 0,
tooltip: {
show: false,
trigger: 'axis',
type: 'none',
},
type: 'bar'
}
],
};
initEcharts('#distribution-charts', option)
}
getEcharts2()
//集中生产时段用电量占比
var chartDom7 = document.getElementById("repair-require7");
myChart7 = echarts.init(chartDom7)
var option7;
option7 = {
tooltip: {},
color: ["#3DEBD5", "#E86265"],
title: {
text: '400',
// subtext: 7789,
subtext: 'KWh',
itemGap: 0,
textStyle: {
color: '#f2f2f2',
fontSize: 23,
fontWeight: 800,
top: '0px'
// align: 'center'
},
subtextStyle: {
fontSize: 18,
color: '#FFFFFF'
},
x: 'center',
y: 'center'
},
legend: false,
series: [
// 主要展示层的
{
radius: ['40%', '60%'],
center: ['50%', '50%'],
type: 'pie',
label: {
normal: {
show: false,
const getEcharts3 = () => {
var option = {
tooltip: {},
color: ["#3DEBD5", "#E86265"],
legend: false,
series: [
// 主要展示层的
{
radius: ['40%', '60%'],
center: ['50%', '50%'],
type: 'pie',
label: {
normal: {
show: false,
},
emphasis: {
show: false
}
},
emphasis: {
show: false
}
},
labelLine: {
normal: {
show: false,
labelLine: {
normal: {
show: false,
},
emphasis: {
show: false
}
},
emphasis: {
show: false
}
},
itemStyle: {
borderColor: '#111D2E',
borderWidth: 3,
},
data: [
{value: 18, name: "非集中生产时段用电量占比"},
{value: 5, name: "集中上产时间段"},
]
},
// 内边框的设置
{
radius: ['40%', '47%'],
center: ['50%', '50%'],
type: 'pie',
label: {
normal: {
show: false
},
emphasis: {
show: false
}
},
labelLine: {
normal: {
show: false
itemStyle: {
borderColor: '#111D2E',
borderWidth: 3,
},
emphasis: {
show: false
}
},
hoverAnimation: false, //鼠标移入变大
animation: false,
tooltip: {
show: false
data: [
{value: 18, name: "非集中生产时段用电量占比"},
{value: 5, name: "集中上产时间段"},
]
},
itemStyle: {
borderColor: 'rgba(33, 45, 63, 1)',
borderWidth: 2,
},
data: [
{
value: 18, name: "非集中生产时段用电量占比", itemStyle: {
color: '#1E5A60'
// 内边框的设置
{
radius: ['40%', '47%'],
center: ['50%', '50%'],
type: 'pie',
label: {
normal: {
show: false
},
emphasis: {
show: false
}
},
{
value: 5, name: "集中上产时间段", itemStyle: {
color: '#58323E'
labelLine: {
normal: {
show: false
},
emphasis: {
show: false
}
},
]
hoverAnimation: false, //鼠标移入变大
},
{
name: '外边框',
type: 'pie',
clockWise: false, //顺时加载
hoverAnimation: false, //鼠标移入变大
center: ['50%', '50%'],
radius: ['65%', '65%'],
tooltip: {
show: false
},
label: {
normal: {
animation: false,
tooltip: {
show: false
},
emphasis: {
show: false
}
itemStyle: {
borderColor: 'rgba(33, 45, 63, 1)',
borderWidth: 2,
},
data: [
{
value: 18, name: "非集中生产时段用电量占比", itemStyle: {
color: '#1E5A60'
}
},
{
value: 5, name: "集中上产时间段", itemStyle: {
color: '#58323E'
}
},
]
},
labelLine: {
normal: {
{
name: '外边框',
type: 'pie',
clockWise: false, //顺时加载
hoverAnimation: false, //鼠标移入变大
center: ['50%', '50%'],
radius: ['65%', '65%'],
tooltip: {
show: false
},
emphasis: {
show: false
}
},
data: [
{
value: '1',
name: '22 ',
itemStyle: {
normal: {
borderWidth: 3,
borderColor: 'rgba(47, 89, 130, 1)'
label: {
normal: {
show: false
},
emphasis: {
show: false
}
},
labelLine: {
normal: {
show: false
},
emphasis: {
show: false
}
},
data: [
{
value: '1',
name: '22 ',
itemStyle: {
normal: {
borderWidth: 3,
borderColor: 'rgba(47, 89, 130, 1)'
}
}
}
}
]
}
]
]
}
]
}
initEcharts('#repair-require7', option)
}
option7 && myChart7.setOption(option7);
getEcharts3()
//用电结构
var chartDom9 = document.getElementById("repair-require9");
myChart9 = echarts.init(chartDom9)
var option9;
option9 = {
tooltip: {},
legend: false,
color: ["#F68500", "#3FF1D9", "#FF6464", "#00DDFF"],
series: [
{
name: "",
type: "pie",
radius: ["40%", "60%"],
hoverAnimation: false,
itemStyle: {
borderRadius: 2,
borderColor: '#202F41',
borderWidth: 3,
},
avoidLabelOverlap: false,
label: {
normal: {
show: false,
const getEcharts4 = () => {
var option = {
tooltip: {},
legend: false,
color: ["#F68500", "#3FF1D9", "#FF6464", "#00DDFF"],
series: [
{
name: "",
type: "pie",
radius: ["40%", "60%"],
hoverAnimation: false,
itemStyle: {
borderRadius: 2,
borderColor: '#202F41',
borderWidth: 3,
},
emphasis: {
show: false
}
},
labelLine: {
normal: {
show: false,
avoidLabelOverlap: false,
label: {
normal: {
show: false,
},
emphasis: {
show: false
}
},
emphasis: {
show: false
}
labelLine: {
normal: {
show: false,
},
emphasis: {
show: false
}
},
data: [
{value: 18, name: "峰"},
{value: 5, name: "平"},
{value: 7, name: "尖"},
{value: 7, name: "谷"},
],
},
data: [
{value: 18, name: "峰"},
{value: 5, name: "平"},
{value: 7, name: "尖"},
{value: 7, name: "谷"},
],
},
{
radius: ['40%', '47%'],
center: ['50%', '50%'],
type: 'pie',
label: {
normal: {
show: false
},
emphasis: {
show: false
}
},
labelLine: {
normal: {
show: false
},
emphasis: {
show: false
}
},
hoverAnimation: false, //鼠标移入变大
animation: false,
tooltip: {
show: false
},
itemStyle: {
borderColor: 'rgba(33, 45, 63, 1)',
borderWidth: 2,
},
data: [
{
value: 18, name: "峰", itemStyle: {
color: '#614C32'
{
radius: ['40%', '47%'],
center: ['50%', '50%'],
type: 'pie',
label: {
normal: {
show: false
},
emphasis: {
show: false
}
},
{
value: 5, name: "平", itemStyle: {
color: '#1E5A60'
labelLine: {
normal: {
show: false
},
emphasis: {
show: false
}
},
{
value: 7, name: "尖", itemStyle: {
color: '#58323E'
}
hoverAnimation: false, //鼠标移入变大
animation: false,
tooltip: {
show: false
},
{
value: 7, name: "谷", itemStyle: {
color: '#38638B'
}
itemStyle: {
borderColor: 'rgba(33, 45, 63, 1)',
borderWidth: 2,
},
data: [
{
value: 18, name: "峰", itemStyle: {
color: '#614C32'
}
},
{
value: 5, name: "平", itemStyle: {
color: '#1E5A60'
}
},
{
value: 7, name: "尖", itemStyle: {
color: '#58323E'
}
},
{
value: 7, name: "谷", itemStyle: {
color: '#38638B'
}
},
]
]
},
],
};
option9 && myChart9.setOption(option9);
},
],
};
initEcharts('#repair-require9', option)
}
getEcharts4()
//园区企业生产状态分析
var chartDom10 = document.getElementById("repair-require10");
myChart10 = echarts.init(chartDom10)
var option10;
option10 = {
tooltip: {
trigger: "item",
},
legend: false,
color: ["#5CB3FF", "#E86265", "#E9EFF2"],
series: [
{
name: "",
type: "pie",
radius: ["40%", "60%"],
hoverAnimation: false,
itemStyle: {
borderColor: '#202F41',
borderWidth: 3,
},
avoidLabelOverlap: false,
label: {
normal: {
show: false,
const getEcharts5 = () => {
var option = {
tooltip: {
trigger: "item",
},
legend: false,
color: ["#5CB3FF", "#E86265", "#E9EFF2"],
series: [
{
name: "",
type: "pie",
radius: ["40%", "60%"],
hoverAnimation: false,
itemStyle: {
borderColor: '#202F41',
borderWidth: 3,
},
emphasis: {
show: false
}
},
labelLine: {
normal: {
show: false,
avoidLabelOverlap: false,
label: {
normal: {
show: false,
},
emphasis: {
show: false
}
},
emphasis: {
show: false
}
},
data: [
{value: 18, name: "达产"},
{value: 5, name: "超产"},
{value: 7, name: "不景气"},
],
},
{
radius: ['40%', '47%'],
center: ['50%', '50%'],
type: 'pie',
label: {
normal: {
show: false
},
emphasis: {
show: false
}
},
labelLine: {
normal: {
show: false
},
emphasis: {
show: false
}
},
hoverAnimation: false, //鼠标移入变大
labelLine: {
normal: {
show: false,
animation: false,
tooltip: {
show: false
},
itemStyle: {
borderColor: 'rgba(33, 45, 63, 1)',
borderWidth: 2,
},
data: [
{
value: 18, name: "达产", itemStyle: {
color: '#38638B'
},
emphasis: {
show: false
}
},
{
value: 5, name: "超产", itemStyle: {
color: '#58323E'
data: [
{value: 18, name: "达产"},
{value: 5, name: "超产"},
{value: 7, name: "不景气"},
],
},
{
radius: ['40%', '47%'],
center: ['50%', '50%'],
type: 'pie',
label: {
normal: {
show: false
},
emphasis: {
show: false
}
},
{
value: 7, name: "不景气", itemStyle: {
color: '#596977'
labelLine: {
normal: {
show: false
},
emphasis: {
show: false
}
},
hoverAnimation: false, //鼠标移入变大
animation: false,
tooltip: {
show: false
},
itemStyle: {
borderColor: 'rgba(33, 45, 63, 1)',
borderWidth: 2,
},
data: [
{
value: 18, name: "达产", itemStyle: {
color: '#38638B'
}
},
{
value: 5, name: "超产", itemStyle: {
color: '#58323E'
}
},
{
value: 7, name: "不景气", itemStyle: {
color: '#596977'
}
},
]
},
],
};
option10 && myChart10.setOption(option10);
]
//企业生产工作制分析
var chartDom11 = document.getElementById("repair-require11");
myChart11 = echarts.init(chartDom11)
var option11;
option11 = {
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'cross',
crossStyle: {
color: '#999'
}
}
},
legend: {
show: true,
textStyle: {
color: '#fff',
},
],
};
initEcharts('#repair-require10', option)
}
getEcharts5()
},
itemHeight: 10,
itemWidth: 14,
},
grid: {
left: '1%',
right: '1%',
bottom: '6%',
top: 30,
padding: '0 0 10 0',
containLabel: true,
},
xAxis: [
{
type: 'category',
data: ['非规律生产', '白天8小时工作制', '24小时工作制'],
//企业生产工作制分析
const getEcharts6 = () => {
var option = {
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow'
},
axisLabel: {
interval: 0,
textStyle: {
fontSize: 14, //更改坐标轴文字大小
color: "#fff",
padding: [0, 0, 0, 0],
},
}
}
],
yAxis: [
{
type: 'value',
name: '企业数:个',
nameTextStyle: {
color: "#fff",
top: -10,
},
min: 0,
max: 900,
interval: 300,
axisLabel: {
interval: 0,
textStyle: {
fontSize: 14, //更改坐标轴文字大小
color: "#fff",
padding: [0, 0, 0, 0],
},
},
splitLine: {
show: true,
lineStyle: {
type: 'dashed',
color: '#354050'
type: 'cross',
crossStyle: {
color: '#999'
}
}
},
{
type: 'value',
name: '用电量:KWh',
nameTextStyle: {
color: "#fff",
legend: {
show: true,
textStyle: {
color: '#fff',
},
min: 0,
max: 900,
interval: 300,
axisLabel: {
interval: 0,
textStyle: {
fontSize: 14, //更改坐标轴文字大小
color: "#fff",
padding: [0, 0, 0, 0],
itemHeight: 10,
itemWidth: 14,
},
grid: {
left: '1%',
right: '1%',
bottom: '6%',
top: 30,
padding: '0 0 10 0',
containLabel: true,
},
xAxis: [
{
type: 'category',
data: ['非规律生产', '白天8小时工作制', '24小时工作制'],
axisPointer: {
type: 'shadow'
},
axisLabel: {
interval: 0,
textStyle: {
fontSize: 14, //更改坐标轴文字大小
color: "#fff",
padding: [0, 0, 0, 0],
},
}
},
splitLine: {
{
type: 'category',
show: false,
lineStyle: {
type: 'dashed',
color: '#354050'
}
data: ['非规律生产', '白天8小时工作制', '24小时工作制'],
}
}
],
series: [
{
name: '企业数:个',
type: 'pictorialBar',
symbol: 'rect',
],
yAxis: [
{
type: 'value',
name: '企业数:个',
nameTextStyle: {
color: "#fff",
top: -10,
},
data: [
200, 400, 900,
],
symbolSize: ['55%', 10],
symbolRepeat: true,
symbolMargin: 2,
barWidth: 40,
itemStyle: {
normal: {
color: {
type: 'liner',
x: 1,
y: 0,
x2: 1,
y2: 1,
colorStops: [
{
offset: 0,
color: '#FF9615', // 0% 处的颜色
},
{
offset: 1,
color: '#7E4602', // 100% 处的颜色
},
],
axisLabel: {
interval: 0,
textStyle: {
fontSize: 14, //更改坐标轴文字大小
color: "#fff",
padding: [0, 0, 0, 0],
},
},
splitLine: {
show: true,
lineStyle: {
type: 'dashed',
color: '#354050'
}
}
},
{
type: 'value',
name: '用电量:KWh',
nameTextStyle: {
color: "#fff",
},
{
name: '用电量:KWh',
type: 'pictorialBar',
symbol: 'rect',
},
barGap: '1%',
axisLabel: {
interval: 0,
textStyle: {
fontSize: 14, //更改坐标轴文字大小
color: "#fff",
padding: [0, 0, 0, 0],
},
},
splitLine: {
show: false,
lineStyle: {
type: 'dashed',
color: '#354050'
}
}
},
yAxisIndex: 1,
data: [
100, 300, 600
],
symbolSize: ['55%', 10],
symbolRepeat: true,
symbolMargin: 2,
barWidth: 40,
itemStyle: {
normal: {
color: {
type: 'liner',
x: 1,
y: 0,
x2: 1,
y2: 1,
colorStops: [
{
offset: 0,
color: '#3FF1D9', // 0% 处的颜色
},
{
offset: 1,
color: '#0D332E', // 100% 处的颜色
},
],
],
series: [
{
name: '企业数:个',
type: 'pictorialBar',
symbol: 'rect',
symbolOffset: [0, 0],
symbolSize: [14, 5], //图形元素的尺寸
data: [
200, 400, 900,
],
symbolRepeat: true,
symbolMargin: 1,
barWidth: '10%', //柱图宽度
barMaxWidth: '20%', //最大宽度
itemStyle: {
normal: {
color: {
type: 'liner',
x: 1,
y: 0,
x2: 1,
y2: 1,
colorStops: [
{
offset: 0,
color: '#FF9615', // 0% 处的颜色
},
{
offset: 1,
color: '#7E4602', // 100% 处的颜色
},
],
},
},
},
},
{
name: '用电量:KWh',
type: 'pictorialBar',
symbol: 'rect',
symbolOffset: [5, 0],
symbolSize: [14, 5], //图形元素的尺寸
},
barGap: 0,
]
};
option11 && myChart11.setOption(option11);
<!-- 分时段企业用电情况分析 -->
yAxisIndex: 1,
data: [
100, 300, 600
],
symbolRepeat: true,
symbolMargin: 1,
barWidth: '10%', //柱图宽度
barMaxWidth: '20%', //最大宽度
itemStyle: {
normal: {
color: {
type: 'liner',
x: 1,
y: 0,
x2: 1,
y2: 1,
colorStops: [
{
offset: 0,
color: '#3FF1D9', // 0% 处的颜色
},
{
offset: 1,
color: '#0D332E', // 100% 处的颜色
},
],
},
},
},
},
{
xAxisIndex: 1,
itemStyle: {
show: false,
color: 'transparent',
opacity: 0//透明度
},
showBackground: true,
data: [50, 110, 110, 210, 150],//这个数据无所谓,反正不显示,只要data的长度和另外两个一样长就行了
barWidth: '35%',
backgroundStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{offset: 0, color: 'rgba(255, 255, 255, 0.05)'},
{offset: 1, color: 'rgba(255, 255, 255, 0.05)'},
])
},
z: 0,
tooltip: {
show: false,
trigger: 'axis',
type: 'none',
},
type: 'bar'
}
]
};
initEcharts('#repair-require11', option)
}
getEcharts6()
// <!-- 分时段企业用电情况分析 -->
const allTimeData = [
{
value: 25,
value: 25,
name: "尖峰时段",
},
{
value: 22,
name: "尖峰时段",
},
{
value: 21,
name: "尖峰时段",
},
{
value: 20,
name: "尖峰时段",
},
{
value: 15,
name: "平均时段",
},
{
value: 14,
name: "平均时段",
},
{
value: 15,
name: "平均时段",
},
{
value: 11,
name: "平均时段",
},
{
value: 11,
name: "平均时段",
},
{
value: 18,
name: "高峰时段",
},
{
value: 16,
name: "高峰时段",
},
{
value: 19,
name: "高峰时段",
},
{
value: 21,
name: "尖峰时段",
},
{
value: 11,
name: "高峰时段",
},
{
value: 11,
name: "高峰时段",
},
{
value: 4,
name: "低谷时段",
},
{
value: 4,
name: "低谷时段",
},
{
value: 5,
name: "低谷时段",
},
{
value: 7,
name: "低谷时段",
},
{
value: 8,
name: "低谷时段",
},
{
value: 14,
name: "高峰时段",
},
{
value: 3,
name: "高峰时段",
},
{
value: 1,
name: "低谷时段",
},
];
const allTimeData1 = [
{
value: 35,
name: "尖峰时段",
},
{
value: 22,
name: "尖峰时段",
},
{
value: 21,
name: "尖峰时段",
},
{
value: 20,
name: "尖峰时段",
},
{
value: 15,
name: "平均时段",
},
{
value: 14,
name: "平均时段",
},
{
value: 15,
name: "平均时段",
},
{
value: 11,
name: "平均时段",
},
{
value: 11,
name: "平均时段",
},
{
value: 18,
name: "高峰时段",
},
{
value: 16,
name: "高峰时段",
},
{
value: 19,
name: "高峰时段",
},
{
value: 21,
name: "尖峰时段",
},
{
value: 11,
name: "高峰时段",
},
{
value: 11,
name: "高峰时段",
},
{
value: 4,
name: "低谷时段",
},
{
value: 4,
name: "低谷时段",
},
{
value: 5,
name: "低谷时段",
},
{
value: 7,
name: "低谷时段",
},
{
value: 8,
name: "低谷时段",
},
{
value: 14,
name: "高峰时段",
},
{
value: 3,
name: "高峰时段",
},
{
value: 1,
name: "低谷时段",
},
];
const allTimeData2 = [
{
value: 45,
name: "尖峰时段",
},
{
......@@ -1558,53 +1858,57 @@
name: "低谷时段",
},
];
const newData = [];
if (allTimeData && allTimeData.length > 0) {
allTimeData.forEach((i) => {
if (i.name === "低谷时段") {
newData.push({
...i,
itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{offset: 0, color: `rgba(0, 221, 255, 0.2)`},
{offset: 1, color: "#00DDFF"},
]),
},
});
} else if (i.name === "平均时段") {
newData.push({
...i,
itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{offset: 0, color: `rgba(63, 241, 217, 0.2)`},
{offset: 1, color: "#3FF1D9"},
]),
},
});
} else if (i.name === "高峰时段") {
newData.push({
...i,
itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{offset: 0, color: `rgba(246, 133, 0, 0.2)`},
{offset: 1, color: "#F68500"},
]),
},
});
} else if (i.name === "尖峰时段") {
newData.push({
...i,
itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{offset: 0, color: `rgba(255, 100, 100, 0.2)`},
{offset: 1, color: "#FF6464"},
]),
},
});
}
});
function TimeData(dataList) {
const newData = [];
if (dataList && dataList.length > 0) {
dataList.forEach((i) => {
if (i.name === "低谷时段") {
newData.push({
...i,
itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{offset: 0, color: `rgba(0, 221, 255, 0.2)`},
{offset: 1, color: "#00DDFF"},
]),
},
});
} else if (i.name === "平均时段") {
newData.push({
...i,
itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{offset: 0, color: `rgba(63, 241, 217, 0.2)`},
{offset: 1, color: "#3FF1D9"},
]),
},
});
} else if (i.name === "高峰时段") {
newData.push({
...i,
itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{offset: 0, color: `rgba(246, 133, 0, 0.2)`},
{offset: 1, color: "#F68500"},
]),
},
});
} else if (i.name === "尖峰时段") {
newData.push({
...i,
itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{offset: 0, color: `rgba(255, 100, 100, 0.2)`},
{offset: 1, color: "#FF6464"},
]),
},
});
}
});
}
return newData
}
console.log(newData);
//尖峰平谷各时段,进行生产的企业月度平均数
const getBarEcharts = () => {
let option = {
......@@ -1617,7 +1921,7 @@
xAxis: {
type: "category",
data: [
1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19,
0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19,
20, 21, 22, 23,
],
axisLabel: {
......@@ -1671,7 +1975,7 @@
},
series: [
{
data: newData,
data: TimeData(allTimeData),
type: "bar",
barGap: "0%",
barWidth: 18,
......@@ -1747,7 +2051,7 @@
},
series: [
{
data: newData,
data: TimeData(allTimeData1),
type: "bar",
barGap: "0%",
barWidth: 18,
......@@ -1823,7 +2127,7 @@
},
series: [
{
data: newData,
data: TimeData(allTimeData2),
type: "bar",
barGap: "0%",
barWidth: 18,
......@@ -1833,12 +2137,346 @@
initEcharts("#repair-require6", option);
};
getBarEcharts4();
window.onresize = function () {
myChart8.resize();
myChart9.resize();
myChart10.resize();
myChart11.resize();
};
//月度用电分析
const getEcharts7 = () => {
var option = {
tooltip: {
trigger: "axis",
axisPointer: {
type: "cross",
crossStyle: {
color: "#999",
},
},
},
legend: {
show: true,
textStyle: {
color: "#fff",
fontSize: 16,
},
itemHeight: 10,
itemWidth: 14,
},
xAxis: [
{
type: "category",
data: [
1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 1,
2, 3, 4, 5, 6, 7, 8, 9, 10,
],
axisPointer: {
type: "shadow",
},
axisLabel: {
interval: 0,
textStyle: {
fontSize: 14, //更改坐标轴文字大小
color: "#fff",
padding: [0, 0, 0, 0],
},
},
},
{
type: "category",
data: [
1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 1,
2, 3, 4, 5, 6, 7, 8, 9, 10,
],
show: false,
},
],
yAxis: [
{
type: "value",
name: "单位:MWh",
nameTextStyle: {
color: "#fff",
fontSize: 16,
top: -10,
},
min: 0,
// max: 900,
// interval: 300,
axisLabel: {
interval: 0,
textStyle: {
fontSize: 14, //更改坐标轴文字大小
color: "#fff",
padding: [0, 0, 0, 0],
},
},
splitLine: {
show: true,
lineStyle: {
type: "dashed",
color: "#354050",
},
},
},
{
type: "value",
name: "同比%",
nameTextStyle: {
color: "#fff",
fontSize: 16,
},
// min: -50,
// max: 200,
// interval: 25,
axisLabel: {
interval: 0,
textStyle: {
fontSize: 14, //更改坐标轴文字大小
color: "#fff",
padding: [0, 0, 0, 0],
},
formatter: "{value} %",
},
splitLine: {
show: false,
lineStyle: {
type: "dashed",
color: "#354050",
},
},
},
{
type: "value",
name: "",
min: 0,
max: 100,
show: false
},
],
grid: {
top: 50,
left: "1%",
right: "1%",
bottom: 20,
containLabel: true,
},
series: [
{
name: "当月用电量",
type: "bar",
data: [136296.770, 136114.330, 130937.710, 128811.420, 136217.500, 136560.100, 142997.550, 144501.440, 150104.850, 147947.450, 134496.190, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
stack: "one",
itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{offset: 0, color: "#0D332E"},
{offset: 1, color: "#3FF1D9"},
]),
},
barWidth: "25%",
},
{
name: "",
type: "bar",
data: [
1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0, 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1
],
yAxisIndex: 2,
stack: "one",
color: "#37F1C8",
barWidth: "25%",
tooltip: {
show: false,
},
},
{
name: "上月用电量",
type: "bar",
data: [36263.050, 55479.250, 88524.650, 132205.970, 147379.820, 153868.390, 135878.660, 139844.390, 141156.850, 145195.760, 152567.230, 158905.090, 158802.080, 141452.540, 155269.020, 143850.890, 150561.280, 133303.860, 146315.850, 134842.180, 94732.810, 1001.490, 318410.620, 138384.030, 148923.660, 144025.280, 135101.050, 121167.230, 152633.180, 155588.950],
stack: "two",
itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{offset: 0, color: "#00525E"},
{offset: 1, color: "#00DDFF"},
]),
},
barWidth: "25%",
},
{
name: "",
type: "bar",
data: [
1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1
],
yAxisIndex: 2,
stack: "two",
color: "#00DDFF",
barWidth: "25%",
tooltip: {
show: false,
},
},
{
name: "同比",
type: "line",
tooltip: {
valueFormatter: function (value) {
return value + " %";
},
},
yAxisIndex: 1,
data: [
0, 10, 2300, 2, -10, 22, 45, 10, 23, 2, -10, 22, 45, 21, 10, 23,
2, -10, 22, 45, 21, 10, 0, 10, 23, 2, -10, 22, 10,
],
symbolSize: 9,
itemStyle: {
color: "rgba(255, 100, 100, 1)",
},
},
{
xAxisIndex: 1,
itemStyle: {
show: false,
color: "transparent",
opacity: 0, //透明度
},
showBackground: true,
data: [
1, 2, 3, 4, 5, 6, 7, 8, 9, 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 0, 1, 2,
3, 4, 5, 6, 7, 8, 9, 0,
], //这个数据无所谓,反正不显示,只要data的长度和另外两个一样长就行了
barWidth: "90%",
backgroundStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{offset: 0, color: "rgba(255, 255, 255, 0.05)"},
{offset: 1, color: "rgba(255, 255, 255, 0.05)"},
]),
},
z: 0,
tooltip: {
show: false,
trigger: "axis",
type: "none",
},
type: "bar",
},
],
};
initEcharts('#month-power', option)
}
getEcharts7()
//月度功率因数趋势
const getEcharts8 = () => {
var option = {
tooltip: {
trigger: "axis",
axisPointer: {
type: "cross",
crossStyle: {
color: "#999",
},
},
},
legend: {
show: true,
textStyle: {
color: "#fff",
fontSize: 16,
},
itemHeight: 10,
itemWidth: 14,
},
xAxis: [
{
type: "category",
data: [
1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 1,
2, 3, 4, 5, 6, 7, 8, 9, 10,
],
axisPointer: {
type: "shadow",
},
axisLabel: {
interval: 0,
textStyle: {
fontSize: 14, //更改坐标轴文字大小
color: "#fff",
padding: [0, 0, 0, 0],
},
},
},
],
yAxis: [
{
type: "value",
name: "功率因数",
nameTextStyle: {
color: "#fff",
fontSize: 16,
top: -10,
},
min: 0,
max: 1,
interval: 0.25,
axisLabel: {
interval: 0,
textStyle: {
fontSize: 14, //更改坐标轴文字大小
color: "#fff",
padding: [0, 0, 0, 0],
},
},
splitLine: {
show: true,
lineStyle: {
type: "dashed",
color: "#354050",
},
},
},
],
grid: {
top: 50,
left: "1%",
right: "1%",
bottom: 20,
containLabel: true,
},
series: [
{
name: "",
type: "line",
symbol: "none",
data: [
0.2, 0.5, 0.3, 0.1, 0.2, 0.2, 0.5, 0.3, 0.1, 0.2, 0.2, 0.5, 0.3,
0.1, 0.2, 0.2, 0.5, 0.3, 0.1, 0.2, 0.2, 0.5, 0.3, 0.1, 0.2, 0.2,
0.5, 0.3, 0.1, 0.2,
],
color: "#5CB3FF",
markLine: {
symbol: "none",
lineStyle: {
color: "#FF6464",
type: "solid",
width: 2,
},
label: {
position: "start",
distance: 10,
fontSize: 14, //更改坐标轴文字大小
color: "#fff",
},
data: [
{
yAxis: 0.8,
},
],
silent: true,
},
},
],
};
initEcharts('#month-trend', option)
}
getEcharts8()
window.onresize = function () {
Object.values(myChart).forEach(chart => chart.resize())
};
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论