1 line
12 KiB
JavaScript
Executable File
1 line
12 KiB
JavaScript
Executable File
function generateDayWiseTimeSeries(e,t,a){let o=0;for(var r=[];o<t;){var n=e,i=Math.floor(Math.random()*(a.max-a.min+1))+a.min;r.push([n,i]),e+=864e5,o++}return r}new CustomApexChart({selector:"#line-chart",options:()=>({chart:{height:380,type:"line",zoom:{enabled:!1}},dataLabels:{enabled:!1},colors:[ins("primary")],stroke:{width:[2],curve:"smooth"},series:[{name:"Revenue",data:[12,28,18,34,42,39,48,55,63]}],grid:{row:{colors:["transparent","transparent"],opacity:.2},borderColor:[ins("border-color")]},labels:["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep"],xaxis:{categories:["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep"]},responsive:[{breakpoint:600,options:{chart:{toolbar:{show:!1}},legend:{show:!1}}}]})}),new CustomApexChart({selector:"#line-chart-datalabel",options:()=>({chart:{height:380,type:"line",zoom:{enabled:!1},toolbar:{show:!1}},colors:[ins("info"),ins("danger")],dataLabels:{enabled:!0,style:{fontSize:"10px",fontWeight:"bold",colors:[ins("info"),ins("danger")]},background:{enabled:!0,padding:8,borderRadius:4},offsetY:3},stroke:{width:[2,2],curve:"smooth"},series:[{name:"Revenue - 2024",data:[45,52,48,58,63,72,80]},{name:"Expenses - 2024",data:[25,35,32,40,38,36,34]}],grid:{row:{colors:["transparent","transparent"],opacity:.2},borderColor:[ins("border-color")],padding:{top:0,right:20,bottom:0,left:20}},xaxis:{categories:["Jan","Feb","Mar","Apr","May","Jun","Jul"]},yaxis:{title:{text:"Amount (in K)",offsetX:0,style:{fontSize:"14px",fontWeight:500}},labels:{offsetX:-7}},legend:{position:"top",horizontalAlign:"center",offsetY:5},responsive:[{breakpoint:600,options:{chart:{toolbar:{show:!1}},legend:{show:!1}}}]})});let userGrowthData=[[new Date("2024-02-01").getTime(),42e5],[new Date("2024-02-02").getTime(),43e5],[new Date("2024-02-03").getTime(),412e4],[new Date("2024-02-04").getTime(),44e5],[new Date("2024-02-05").getTime(),45e5],[new Date("2024-02-06").getTime(),46e5],[new Date("2024-02-07").getTime(),438e4],[new Date("2024-02-08").getTime(),445e4],[new Date("2024-02-09").getTime(),47e5],[new Date("2024-02-10").getTime(),465e4],[new Date("2024-02-11").getTime(),485e4],[new Date("2024-02-12").getTime(),47e5],[new Date("2024-02-13").getTime(),488e4],[new Date("2024-02-14").getTime(),495e4],[new Date("2024-02-15").getTime(),51e5],[new Date("2024-02-16").getTime(),505e4],[new Date("2024-02-17").getTime(),498e4],[new Date("2024-02-18").getTime(),52e5],[new Date("2024-02-19").getTime(),53e5],[new Date("2024-02-20").getTime(),518e4],[new Date("2024-02-21").getTime(),55e5],[new Date("2024-02-22").getTime(),54e5],[new Date("2024-02-23").getTime(),552e4],[new Date("2024-02-24").getTime(),565e4],[new Date("2024-02-25").getTime(),58e5]],common=(new CustomApexChart({selector:"#line-chart-zoomable",options:()=>({chart:{type:"area",stacked:!1,height:380,zoom:{enabled:!0},toolbar:{show:!0}},plotOptions:{line:{curve:"straight"}},dataLabels:{enabled:!1},stroke:{width:[3]},series:[{name:"User Growth",data:userGrowthData}],markers:{size:0,style:"full"},colors:[ins("danger")],grid:{row:{colors:["transparent","transparent"],opacity:.2},borderColor:[ins("border-color")],padding:{right:20}},fill:{gradient:{enabled:!0,shadeIntensity:1,inverseColors:!1,opacityFrom:.5,opacityTo:.1,stops:[0,70,80,100]}},yaxis:{min:1e6,max:6e6,labels:{formatter:function(e){return(e/1e3).toFixed(0)+"K"}},title:{text:"Users",offsetX:-5,style:{fontSize:"14px",fontWeight:500}}},xaxis:{type:"datetime"},tooltip:{shared:!1,y:{formatter:function(e){return(e/1e3).toFixed(0)+"K"}}},responsive:[{breakpoint:600,options:{chart:{toolbar:{show:!1}},legend:{show:!1}}}]})}),new CustomApexChart({selector:"#line-chart-annotations",options:()=>({annotations:{yaxis:[{y:4200,borderColor:ins("primary"),label:{borderColor:ins("primary"),style:{color:"#ffffff",background:ins("primary"),fontWeight:"bold"},text:"Support Level"}}],xaxis:[{x:new Date("2024-09-07").getTime(),borderColor:ins("purple"),label:{borderColor:ins("purple"),style:{color:"#ffffff",background:ins("purple"),fontWeight:"bold"},text:"Launch Event"}},{x:new Date("2024-10-01").getTime(),borderColor:ins("warning"),label:{borderColor:ins("warning"),style:{color:"#ffffff",background:ins("warning"),fontWeight:"bold"},orientation:"horizontal",text:"Campaign Start"}}],points:[{x:new Date("2024-09-20").getTime(),y:4800,marker:{size:8,fillColor:"#ffffff",strokeColor:ins("danger"),radius:2},label:{borderColor:ins("danger"),offsetY:0,style:{color:"#ffffff",background:ins("danger"),fontWeight:"bold"},text:"Peak Point"}}]},chart:{height:380,type:"line",id:"custom-line-chart",toolbar:{show:!1}},colors:[ins("secondary")],dataLabels:{enabled:!1},stroke:{width:3,curve:"smooth"},series:[{name:"Visitors",data:[{x:new Date("2024-09-01").getTime(),y:4100},{x:new Date("2024-09-05").getTime(),y:4300},{x:new Date("2024-09-10").getTime(),y:4500},{x:new Date("2024-09-15").getTime(),y:4700},{x:new Date("2024-09-20").getTime(),y:4800},{x:new Date("2024-09-25").getTime(),y:4600},{x:new Date("2024-10-01").getTime(),y:4400},{x:new Date("2024-10-10").getTime(),y:4200},{x:new Date("2024-10-15").getTime(),y:4e3}]}],xaxis:{type:"datetime"},yaxis:{title:{text:"Unique Visitors",offsetX:-5,style:{fontSize:"14px",fontWeight:500}}},grid:{row:{colors:["transparent","transparent"],opacity:.2},borderColor:"#dee2e6",padding:{right:20}},responsive:[{breakpoint:600,options:{chart:{toolbar:{show:!1}},legend:{show:!1}}}]})}),new CustomApexChart({selector:"#line-chart-syncing",options:()=>({chart:{type:"line",height:160,id:"fb",group:"social",toolbar:{show:!1}},colors:[ins("primary")],stroke:{width:[3],curve:"straight"},fill:{opacity:1},tooltip:{followCursor:!1,theme:"light",x:{show:!1},marker:{show:!1},y:{formatter:function(e){return e}}},series:[{data:[[new Date("2024-05-01").getTime(),28],[new Date("2024-05-02").getTime(),35],[new Date("2024-05-03").getTime(),32],[new Date("2024-05-04").getTime(),30],[new Date("2024-05-05").getTime(),34],[new Date("2024-05-06").getTime(),38],[new Date("2024-05-07").getTime(),36],[new Date("2024-05-08").getTime(),40],[new Date("2024-05-09").getTime(),42],[new Date("2024-05-10").getTime(),39]]}],xaxis:{type:"datetime",labels:{datetimeFormatter:{day:"dd MMM"}}},grid:{row:{colors:["transparent","transparent"],opacity:.2},borderColor:[ins("border-color")],padding:{right:20}}})}),new CustomApexChart({selector:"#line-chart-syncing2",options:()=>({chart:{height:200,type:"line",id:"yt",group:"social",toolbar:{show:!1}},colors:[ins("danger")],dataLabels:{enabled:!1},tooltip:{followCursor:!1,theme:"light",x:{show:!1},marker:{show:!1},y:{formatter:function(e){return e}}},stroke:{width:[3],curve:"smooth"},series:[{data:[[new Date("2024-05-01").getTime(),120],[new Date("2024-05-02").getTime(),160],[new Date("2024-05-03").getTime(),150],[new Date("2024-05-04").getTime(),180],[new Date("2024-05-05").getTime(),170],[new Date("2024-05-06").getTime(),200],[new Date("2024-05-07").getTime(),190],[new Date("2024-05-08").getTime(),210],[new Date("2024-05-09").getTime(),230],[new Date("2024-05-10").getTime(),240]]}],fill:{gradient:{enabled:!0,opacityFrom:.6,opacityTo:.8}},legend:{position:"top",horizontalAlign:"left"},xaxis:{type:"datetime",labels:{datetimeFormatter:{day:"dd MMM"}}},grid:{row:{colors:["transparent","transparent"],opacity:.2},borderColor:[ins("border-color")],padding:{right:20}}})}),new CustomApexChart({selector:"#line-chart-gradient",options:()=>({chart:{height:374,type:"line",toolbar:{show:!1},shadow:{enabled:!1,color:"#bbb",top:3,left:2,blur:3,opacity:1}},forecastDataPoints:{count:7},stroke:{width:5,curve:"smooth"},series:[{name:"Followers",data:[3,5,9,12,18,25,21,17,13,19,23,16,20,22,19,15,11,14]}],xaxis:{type:"datetime",categories:["01/01/2000","02/01/2000","03/01/2000","04/01/2000","05/01/2000","06/01/2000","07/01/2000","08/01/2000","09/01/2000","10/01/2000","11/01/2000","12/01/2000","01/01/2001","02/01/2001","03/01/2001","04/01/2001","05/01/2001","06/01/2001"]},fill:{type:"gradient",gradient:{shade:"dark",gradientToColors:["#007bff"],shadeIntensity:1,type:"vertical",opacityFrom:.8,opacityTo:1,stops:[0,100]}},markers:{size:4,opacity:.9,colors:["#ffbc00"],strokeColor:"#fff",strokeWidth:2,style:"inverted",hover:{size:7}},yaxis:{min:-10,max:40,title:{text:"Followers Count",offsetX:-5,style:{fontSize:"14px",fontWeight:500}}},grid:{row:{colors:["transparent","transparent"],opacity:.2},borderColor:[ins("border-color")],padding:{right:20}},responsive:[{breakpoint:600,options:{chart:{toolbar:{show:!1}},legend:{show:!1}}}]})}),new CustomApexChart({selector:"#line-chart-missing",options:()=>({chart:{height:380,type:"line",zoom:{enabled:!1},animations:{enabled:!1},toolbar:{show:!1}},stroke:{width:[5,5,4],curve:"straight"},series:[{name:"Slack",data:[45,50,48,60,42,55,null,56,null,60,null,66,50,69,75,71]},{name:"Zoom",data:[30,28,35,null,25,42,39,null,47,32,50,41,null,53,45,55]},{name:"Notion",data:[null,25,35,20,30,22,38,null,34,29,37,39,45,41,33,44]}],labels:["01 Jan","02 Jan","03 Jan","04 Jan","05 Jan","06 Jan","07 Jan","08 Jan","09 Jan","10 Jan","11 Jan","12 Jan","13 Jan","14 Jan","15 Jan","16 Jan"],colors:[ins("secondary"),ins("warning"),ins("info")],grid:{row:{colors:["transparent","transparent"],opacity:.2},borderColor:[ins("border-color")],padding:{bottom:5}},legend:{offsetY:5}})}),new CustomApexChart({selector:"#line-chart-dashed",options:()=>({chart:{height:380,type:"line",zoom:{enabled:!1},toolbar:{show:!1}},dataLabels:{enabled:!1},stroke:{width:[3,5,3],curve:"straight",dashArray:[0,8,5]},series:[{name:"Charging Time",data:[30,45,28,20,36,25,22,18,10,12,20,15]},{name:"Energy Delivered",data:[22,35,55,38,16,21,33,40,39,53,30,34]},{name:"Sessions Completed",data:[60,50,65,85,58,40,70,60,90,63,48,52]}],markers:{size:0,style:"hollow"},xaxis:{categories:["01 Mar","02 Mar","03 Mar","04 Mar","05 Mar","06 Mar","07 Mar","08 Mar","09 Mar","10 Mar","11 Mar","12 Mar"]},colors:[ins("primary"),ins("secondary"),ins("gray")],tooltip:{y:{title:{formatter:function(e){return"Charging Time"===e?"Charging Time (mins)":"Energy Delivered"===e?"Energy Delivered (kWh)":"Sessions Completed"===e?"Sessions":e}}}},grid:{borderColor:[ins("border-color")]},legend:{offsetY:7}})}),new CustomApexChart({selector:"#line-chart-stepline",options:()=>({chart:{type:"line",height:360,toolbar:{show:!1}},stroke:{curve:"stepline"},dataLabels:{enabled:!1},series:[{data:[120,115,130,90,70,95,85,75,140,140,125]}],colors:[ins("purple")],markers:{hover:{sizeOffset:4}},grid:{padding:{right:20}}})}),generateDayWiseTimeSeries(new Date("01 Jan 2024").getTime(),185,{min:40,max:90})),lastDate=(new CustomApexChart({selector:"#chart-line2",options:()=>({series:[{data:common}],chart:{id:"chart2",type:"line",height:230,toolbar:{autoSelected:"pan",show:!1}},colors:[ins("secondary")],stroke:{width:3},dataLabels:{enabled:!1},fill:{opacity:1},markers:{size:0},xaxis:{type:"datetime"}})}),new CustomApexChart({selector:"#chart-line",options:()=>({series:[{data:common}],chart:{id:"chart1",height:130,type:"area",brush:{target:"chart2",enabled:!0},selection:{enabled:!0,xaxis:{min:new Date("15 Mar 2024").getTime(),max:new Date("15 May 2024").getTime()}}},colors:[ins("secondary")],fill:{type:"gradient",gradient:{opacityFrom:.91,opacityTo:.1}},xaxis:{type:"datetime",tooltip:{enabled:!1}},yaxis:{tickAmount:2}})}),0),data=generateDayWiseTimeSeries(new Date("11 May 2024 GMT").getTime(),10,{min:10,max:90});function getNewSeries(e,t){e+=864e5;lastDate=e,data.push([e,Math.floor(Math.random()*(t.max-t.min+1))+t.min])}function resetData(){data=data.slice(data.length-10,data.length)}lastDate=data[data.length-1][0];let realtimeChart=new CustomApexChart({selector:"#line-chart-realtime",options:()=>({chart:{height:350,type:"line",animations:{enabled:!0,easing:"linear",dynamicAnimation:{speed:2e3}},toolbar:{show:!1},zoom:{enabled:!1}},dataLabels:{enabled:!1},stroke:{curve:"smooth",width:[3]},colors:[ins("primary")],series:[{data:data}],markers:{size:0},xaxis:{type:"datetime",range:7776e5},yaxis:{max:100},legend:{show:!1},grid:{borderColor:[ins("border-color")]}})});window.setInterval(()=>{getNewSeries(lastDate,{min:10,max:90}),realtimeChart.chart.updateSeries([{data:data}])},2e3),window.setInterval(()=>{resetData(),realtimeChart.chart.updateSeries([{data:data}],!1,!0)},6e4); |