Raffales-LMS/public/newtemplate/js/charts/marketing-chart.js
2024-04-16 15:43:24 +05:45

1 line
11 KiB
JavaScript
Vendored

!function(NioApp){"use strict";let campaignChart={labels:["M","T","W","T","F","S","S"],legend:!1,ticksColor:NioApp.hexRGB(NioApp.Colors.white,.4),ticksFontSize:10,ticksFontWeight:400,gridColorX:NioApp.hexRGB(NioApp.Colors.white,.1),gridColorY:NioApp.hexRGB(NioApp.Colors.white,.1),gridBorderColorX:NioApp.hexRGB(NioApp.Colors.white,.1),gridBorderColorY:NioApp.hexRGB(NioApp.Colors.white,.1),datasets:[{borderRadius:10,borderWidth:1,color:"transparent",background:NioApp.hexRGB(NioApp.Colors.white,.8),hoverBackgroundColor:NioApp.Colors.white,label:"Visitors",data:[600,680,470,770,570,810,670]}]},campaignOverviewChart={labels:["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],legend:!1,lineTension:.4,ticksValue:"k",ticksColor:"#9CA3AF",ticksFontSize:11,ticksFontWeight:100,gridBorderDash:[8,4],gridColorX:NioApp.Colors.white,gridColorY:NioApp.Colors.gray100,gridBorderColorX:NioApp.Colors.gray100,gridBorderColorY:NioApp.Colors.white,datasets:[{borderWidth:2,color:NioApp.Colors.primary,backgroundGradient:NioApp.Colors.primary,pointBorderColor:NioApp.Colors.white,pointBackgroundColor:NioApp.Colors.primary,pointHoverBackgroundColor:NioApp.Colors.primary,label:"Social",data:[0,15,10,28,20,38,30,22,30,12,38,30]},{borderWidth:2,backgroundGradient:NioApp.Colors.success,pointBorderColor:NioApp.Colors.white,pointBackgroundColor:NioApp.Colors.success,color:NioApp.Colors.success,pointHoverBackgroundColor:NioApp.Colors.success,label:"Email Newsletter",data:[30,24,49,36,40,49,39,38,59,50,56,66]},{borderWidth:2,pointBorderColor:NioApp.Colors.white,pointBackgroundColor:NioApp.Colors.warning,color:NioApp.Colors.warning,pointHoverBackgroundColor:NioApp.Colors.warning,label:"Google Ads",borderDash:[8,4],data:[44,34,39,68,29,61,10,48,45,70,46,55]}]},effectivenessChart={labels:["AdSense","Facebook","Video ads","Pop-ups","Email marketing","Banners"],legend:!1,ticksColor:"#9CA3AF",ticksFontSize:11,ticksFontWeight:100,gridBorderDash:[8,4],yAxis:!1,xAxis:!1,gridColorX:"transparent",gridColorY:"transparent",gridBorderColorX:"transparent",gridBorderColorY:"transparent",ticksNumberLabel:!1,datasets:[{borderWidth:2,color:NioApp.Colors.primary,backgroundGradient:NioApp.Colors.primary,pointBorderColor:NioApp.Colors.white,pointBackgroundColor:NioApp.Colors.primary,pointHoverBackgroundColor:NioApp.Colors.primary,label:"Dataset",data:[80,70,56,91,86,80]}]};NioApp.Chart={tooltip:{rtl:NioApp.State.isRTL,textDirection:NioApp.State.isRTL?"rtl":"ltr",padding:12,boxWidth:10,boxHeight:10,boxPadding:6,backgroundColor:NioApp.Colors.gray100,titleColor:NioApp.Colors.gray900,bodyColor:NioApp.Colors.bodyColor},legend:{rtl:NioApp.State.isRTL,position:"top",labels:{boxWidth:12,boxHeight:12,fontColor:NioApp.Colors.bodyColor,padding:10}},bar:function(selector,data){let elm=document.querySelectorAll(selector);elm.forEach(item=>{let chartId=item.id,setData=void 0===data?eval(chartId):data,chartLegend=void 0!==setData.legend&&setData.legend,chartStacked=void 0!==setData.stacked&&setData.stacked,chartxAxis=void 0===setData.xAxis||setData.xAxis,chartyAxis=void 0===setData.yAxis||setData.yAxis,chartTicksColor=setData.ticksColor,chartTicksFontSize=setData.ticksFontSize,chartTicksFontWeight=setData.ticksFontWeight,chartMaxTicksLimit=setData.maxTicksLimit,chartTicksValue=void 0!==setData.ticksValue&&setData.ticksValue,chartGridColorX=setData.gridColorX,chartGridColorY=setData.gridColorY,chartGridBorderColorX=setData.gridBorderColorX,chartGridBorderColorY=setData.gridBorderColorY,chartGridBorderDash=setData.gridBorderDash,chartBarPercentage=void 0===setData.barPercentage?.1:setData.barPercentage,chartCategoryPercentage=void 0===setData.categoryPercentage?.1:setData.categoryPercentage,chartBarThickness=void 0===setData.barThickness?10:setData.barThickness,chartData=[];for(let t=0;t<setData.datasets.length;t++)chartData.push({label:setData.datasets[t].label,backgroundColor:void 0===setData.datasets[t].background?"transparent":setData.datasets[t].background,borderWidth:void 0===setData.datasets[t].border?1:setData.datasets[t].border,borderColor:setData.datasets[t].color,data:setData.datasets[t].data,borderRadius:void 0===setData.datasets[t].borderRadius?0:setData.datasets[t].borderRadius,borderSkipped:!1,hoverBackgroundColor:setData.datasets[t].hoverBackgroundColor});let canvas=document.getElementById(chartId).getContext("2d"),chart=new Chart(canvas,{type:"bar",data:{labels:setData.labels,datasets:chartData},options:{categoryPercentage:chartCategoryPercentage,barPercentage:chartBarPercentage,barThickness:chartBarThickness,plugins:{legend:{display:chartLegend,...NioApp.Chart.legend},tooltip:{enabled:!0,...NioApp.Chart.tooltip}},responsive:!0,maintainAspectRatio:!1,scales:{x:{stacked:chartStacked,display:chartxAxis,grid:{color:chartGridColorX,borderColor:chartGridBorderColorX,borderDash:chartGridBorderDash},ticks:{color:chartTicksColor,beginAtZero:!0,maxTicksLimit:chartMaxTicksLimit,font:{size:chartTicksFontSize,weight:chartTicksFontWeight}}},y:{stacked:chartStacked,display:chartyAxis,grid:{color:chartGridColorY,borderColor:chartGridBorderColorY,borderDash:chartGridBorderDash},ticks:{callback:function(t,a,r){return t+chartTicksValue},color:chartTicksColor,beginAtZero:!0,maxTicksLimit:chartMaxTicksLimit,font:{size:chartTicksFontSize,weight:chartTicksFontWeight}}}}}})})},line:function(selector,data){let elm=document.querySelectorAll(selector);elm.forEach(item=>{let chartId=item.id,setData=void 0===data?eval(chartId):data,chartLegend=void 0!==setData.legend&&setData.legend,chartxAxis=void 0===setData.xAxis||setData.xAxis,chartyAxis=void 0===setData.yAxis||setData.yAxis,chartTicksColor=setData.ticksColor,chartTicksFontSize=setData.ticksFontSize,chartTicksFontWeight=setData.ticksFontWeight,chartMaxTicksLimit=setData.maxTicksLimit,chartTicksValue=void 0!==setData.ticksValue&&setData.ticksValue,chartGridColorX=setData.gridColorX,chartGridColorY=setData.gridColorY,chartGridBorderColorX=setData.gridBorderColorX,chartGridBorderColorY=setData.gridBorderColorY,chartGridBorderDash=setData.gridBorderDash,canvas=document.getElementById(chartId).getContext("2d"),chartData=[];for(let t=0;t<setData.datasets.length;t++){let a=void 0===setData.datasets[t].background?"transparent":setData.datasets[t].background;chartData.push({label:setData.datasets[t].label,tension:setData.lineTension,backgroundColor:setData.datasets[t].backgroundGradient?getGradient(setData.datasets[t].backgroundGradient):a,borderWidth:setData.datasets[t].borderWidth,borderColor:setData.datasets[t].color,pointBorderColor:setData.datasets[t].pointBorderColor,pointBackgroundColor:setData.datasets[t].pointBackgroundColor,pointHoverBackgroundColor:setData.datasets[t].pointHoverBackgroundColor,pointHoverBorderColor:setData.datasets[t].pointHoverBackgroundColor,pointBorderWidth:setData.datasets[t].pointBorderWidth,pointHoverRadius:setData.datasets[t].pointHoverRadius,pointHoverBorderWidth:setData.datasets[t].pointBorderWidth,pointRadius:setData.datasets[t].pointRadius,pointHitRadius:setData.datasets[t].pointHitRadius,fill:!0,data:setData.datasets[t].data,borderDash:setData.datasets[t].borderDash,borderCapStyle:setData.datasets[t].borderCapStyle})}function getGradient(t){let a=canvas.createLinearGradient(0,0,0,canvas.canvas.clientHeight);return a.addColorStop(0,""+NioApp.hexRGB(t,0)),a.addColorStop(.5,""+NioApp.hexRGB(t,.25)),a.addColorStop(1,""+NioApp.hexRGB(t,.1)),a}let chart=new Chart(canvas,{type:"line",data:{labels:setData.labels,datasets:chartData},options:{plugins:{legend:{display:chartLegend,...NioApp.Chart.legend},tooltip:{enabled:!0,...NioApp.Chart.tooltip}},interaction:{mode:"nearest"},responsive:!0,maintainAspectRatio:!1,scales:{y:{display:chartyAxis,grid:{color:chartGridColorY,borderColor:chartGridBorderColorY,borderDash:chartGridBorderDash},ticks:{callback:function(t,a,r){return t+chartTicksValue},color:chartTicksColor,beginAtZero:!0,maxTicksLimit:chartMaxTicksLimit,font:{size:chartTicksFontSize,weight:chartTicksFontWeight}}},x:{display:chartxAxis,grid:{color:chartGridColorX,borderColor:chartGridBorderColorX,borderDash:chartGridBorderDash},ticks:{color:chartTicksColor,beginAtZero:!0,maxTicksLimit:chartMaxTicksLimit,font:{size:chartTicksFontSize,weight:chartTicksFontWeight}}}}}})})},radar:function(selector,data){let elm=document.querySelectorAll(selector);elm.forEach(item=>{let chartId=item.id,setData=void 0===data?eval(chartId):data,chartLegend=void 0!==setData.legend&&setData.legend,chartxAxis=void 0===setData.xAxis||setData.xAxis,chartyAxis=void 0===setData.yAxis||setData.yAxis,chartTicksColor=setData.ticksColor,chartTicksFontSize=setData.ticksFontSize,chartTicksFontWeight=setData.ticksFontWeight,chartMaxTicksLimit=setData.maxTicksLimit,chartPointLabels=void 0===setData.pointLabels||setData.pointLabels,chartTicksNumberLabel=void 0===setData.ticksNumberLabel||setData.ticksNumberLabel,chartGridColorX=setData.gridColorX,chartGridColorY=setData.gridColorY,chartGridBorderColorX=setData.gridBorderColorX,chartGridBorderColorY=setData.gridBorderColorY,chartGridBorderDash=setData.gridBorderDash,canvas=document.getElementById(chartId).getContext("2d"),chartData=[];for(let t=0;t<setData.datasets.length;t++){let a=void 0===setData.datasets[t].background?"transparent":setData.datasets[t].background;chartData.push({label:setData.datasets[t].label,tension:setData.lineTension,backgroundColor:setData.datasets[t].backgroundGradient?getGradient(setData.datasets[t].backgroundGradient):a,borderWidth:setData.datasets[t].borderWidth,borderColor:setData.datasets[t].color,pointBorderColor:setData.datasets[t].pointBorderColor,pointBackgroundColor:setData.datasets[t].pointBackgroundColor,pointHoverBackgroundColor:setData.datasets[t].pointHoverBackgroundColor,pointHoverBorderColor:setData.datasets[t].pointHoverBackgroundColor,pointBorderWidth:setData.datasets[t].pointBorderWidth,pointHoverRadius:setData.datasets[t].pointHoverRadius,pointHoverBorderWidth:setData.datasets[t].pointBorderWidth,pointRadius:setData.datasets[t].pointRadius,pointHitRadius:setData.datasets[t].pointHitRadius,fill:!0,data:setData.datasets[t].data,borderDash:setData.datasets[t].borderDash})}function getGradient(t){let a=canvas.createLinearGradient(0,0,0,canvas.canvas.clientHeight);return a.addColorStop(0,""+NioApp.hexRGB(t,0)),a.addColorStop(.5,""+NioApp.hexRGB(t,.25)),a.addColorStop(1,""+NioApp.hexRGB(t,.1)),a}let chart=new Chart(canvas,{type:"radar",data:{labels:setData.labels,datasets:chartData},options:{plugins:{legend:{display:chartLegend,...NioApp.Chart.legend},tooltip:{enabled:!0,...NioApp.Chart.tooltip}},responsive:!0,maintainAspectRatio:!1,scales:{r:{pointLabels:{display:chartPointLabels},ticks:{display:chartTicksNumberLabel}},y:{display:chartyAxis,grid:{color:chartGridColorY,borderColor:chartGridBorderColorY,borderDash:chartGridBorderDash},ticks:{color:chartTicksColor,beginAtZero:!0,maxTicksLimit:chartMaxTicksLimit,font:{size:chartTicksFontSize,weight:chartTicksFontWeight}}},x:{display:chartxAxis,grid:{color:chartGridColorX,borderColor:chartGridBorderColorX,borderDash:chartGridBorderDash},ticks:{color:chartTicksColor,beginAtZero:!0,maxTicksLimit:chartMaxTicksLimit,font:{size:chartTicksFontSize,weight:chartTicksFontWeight}}}}}})})}},NioApp.Chart.init=function(){NioApp.Chart.bar('[data-nk-chart="bar"]'),NioApp.Chart.line('[data-nk-chart="line"]'),NioApp.Chart.radar('[data-nk-chart="radar"]')},NioApp.winLoad(NioApp.Chart.init)}(NioApp);