// JScript File
var objGetGraphicalReportdata = null;

function ajaxGetGraphicalReport(ReportName, dtFrom, dtto, EmpName, EmpID, Level, EmpCategory, EmpType, ParentLevelId, UserGroupName, GradeLevel, SwipeCard, Designation, Gender, Shift, ReportType, Grade, absentType, ReportHeaderName, MinExceptHours) {
    if (window.ActiveXObject) {
        try {
            objGetGraphicalReportdata = new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e) {
            try {
                objGetGraphicalReportdata = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e1) {
                objGetGraphicalReportdata = null;
            }
        }
    } else if (window.XMLHttpRequest) {
        try {
            objGetGraphicalReportdata = new XMLHttpRequest("Msxml2.XMLHTTP");
        } catch (e) {
            try {
                objGetGraphicalReportdata = new XMLHttpRequest("Microsoft.XMLHTTP");
            } catch (e1) {
                objGetGraphicalReportdata = null;
            }
        }
    }
    if (objGetGraphicalReportdata != null) {
        var k = Math.floor(Math.random() * 111);
        if (window.ActiveXObject) {
            objGetGraphicalReportdata.onreadystatechange = Process_Response_GetGraphicalReportsData;
            objGetGraphicalReportdata.open("GET", "GetGraphicalReportData.aspx?ReportName=" + ReportName + "&dtFrom=" + dtFrom + "&dtto=" + dtto + "&MinExceptHours=" + MinExceptHours + "&EmpName=" + EmpName + "&EmpID=" + EmpID + "&Level=" + Level + "&EmpCategory=" + EmpCategory + "&EmpType=" + EmpType + "&ParentLevelId=" + ParentLevelId + "&UserGroupName=" + UserGroupName + "&GradeLevel=" + GradeLevel + "&SwipeCard=" + SwipeCard + "&Designation=" + Designation + "&Gender=" + Gender + "&shft=" + Shift + "&ReportType=" + ReportType + "&Grade=" + Grade + "&absentType=" + absentType, false);
            objGetGraphicalReportdata.send(null);
        } else if (window.XMLHttpRequest) {
            objGetGraphicalReportdata.open("GET", "GetGraphicalReportData.aspx?ReportName=" + ReportName + "&dtFrom=" + dtFrom + "&dtto=" + dtto + "&MinExceptHours=" + MinExceptHours + "&EmpName=" + EmpName + "&EmpID=" + EmpID + "&Level=" + Level + "&EmpCategory=" + EmpCategory + "&EmpType=" + EmpType + "&ParentLevelId=" + ParentLevelId + "&UserGroupName=" + UserGroupName + "&GradeLevel=" + GradeLevel + "&SwipeCard=" + SwipeCard + "&Designation=" + Designation + "&Gender=" + Gender + "&shft=" + Shift + "&ReportType=" + ReportType + "&Grade=" + Grade + "&absentType=" + absentType, false);
            objGetGraphicalReportdata.send(null);
            objGetGraphicalReportdata.onreadystatechange = Process_Response_GetGraphicalReportsData(ReportName, dtFrom, dtto, ReportHeaderName);
        }
    }
    return false;
}

function Process_Response_GetGraphicalReportsData(ReportName, dtFrom, dtto, ReportHeaderName) {
    if (objGetGraphicalReportdata.readyState == 4) {
        if (objGetGraphicalReportdata.status == 200) {
            var retval = objGetGraphicalReportdata.responseText;
            if (retval == "") {
                alert('There is no record');
                window.close();
                return;
            }
            if (ReportName == "Absentees") {
                if (retval.length > 0 && retval != "Fail") {

                    var TArr = retval.split('~');
                    var arr = TArr[0].split('%');
                    var data = [];
                    var arr1 = [];
                    var DataPoints = [];
                    for (var i = 0; i < arr.length; i++) {
                        arr1 = arr[i].split('$');
                        if (arr1[1] != 0) {
                            if (i == 0) {
                                DataPoints.push({
                                    y: arr1[1],
                                    name: arr1[0],
                                    exploded: true
                                });
                            } else {
                                DataPoints.push({
                                    y: arr1[1],
                                    name: arr1[0]
                                });
                            }

                        }
                    }
                    /*Absent Report Type 1 */
                    var chart = new CanvasJS.Chart("PieChart", {
                        fontFamily: "Verdana",
                        title: {
                            text: ReportHeaderName,
                            fontSize: 18,
                            fontFamily: "Verdana",
                            fontColor: "Gray",
                        },
                        subtitles: [{
                            text: "Absent Report - Pie Chart - From : " + dtFrom + " - To : " + dtto,
                            //Uncomment properties below to see how they behave
                            fontFamily: "Verdana",
                            fontColor: "Gray",
                            //fontFamily: "robotoregular",
                            fontSize: 15
                        }],
                        exportFileName: "Absent Report",
                        exportEnabled: true,
                        animationEnabled: true,
                        legend: {
                            fontFamily: "Verdana",
                            cursor: "pointer",
                        },

                        data: [{
                            type: "pie",
                            showInLegend: true,
                            toolTipContent: "{name}: <strong>{y}</strong>",
                            indexLabel: "{name} : {y}",
                            dataPoints: DataPoints,
                            fontFamily: "Verdana",
                        }]
                    });
                    chart.render();
                    /*End*/
                    /*Absent Report Type 2*/
                    var chart1 = new CanvasJS.Chart("DoughnutChart", {
                        theme: "theme2",
                        fontFamily: "Verdana",
                        title: {
                            text: ReportHeaderName,
                            fontSize: 18,
                            fontFamily: "Verdana",
                            fontColor: "Gray",
                        },
                        subtitles: [{
                            text: "Absent Report - doughnut Chart - From : " + dtFrom + " - To : " + dtto,
                            fontFamily: "Verdana",
                            fontColor: "Gray",
                            fontSize: 15
                        }],
                        exportFileName: "Absent Report",
                        exportEnabled: true,
                        animationEnabled: true,
                        legend: {
                            cursor: "pointer",
                            fontFamily: "Verdana",
                        },
                        data: [{
                            type: "doughnut",
                            showInLegend: true,
                            toolTipContent: "{name}: <strong>{y}</strong>",
                            indexLabel: "{name}: {y}",
                            indexLabelFontSize: 14,
                            indexLabelFontFamily: "Verdana",
                            dataPoints: DataPoints,
                        }]
                    });
                    chart1.render();
                    /*End*/
                    /*Absent Report Type 3*/
                    var chart2 = new CanvasJS.Chart("SplineChart", {
                        animationEnabled: true,
                        zoomEnabled: true,
                        title: {
                            text: ReportHeaderName,
                            fontFamily: "Verdana",
                            fontColor: "black",
                            fontSize: 16
                        },
                        toolTip: {
                            shared: true
                        },
                        axisX: {
                            labelAngle: 130,
                            title: "Date(s)",
                            labelFontColor: 'black',
                            titleFontColor: 'black',
                            //labelFontSize: 20,

                        },
                        axisY: {
                            title: "No Of Employees",
                            includeZero: false,
                            titleFontColor: 'black',
                            //titleFontSize:20,
                        },
                        subtitles: [{
                            text: "Absent Report From " + dtFrom + " To " + dtto,
                            fontFamily: "Verdana",
                            fontColor: "black",
                            fontSize: 15
                        }],
                        exportFileName: "Absent Report",
                        exportEnabled: true,
                        legend: {
                            cursor: "pointer",
                            fontFamily: "Verdana",
                            fontSize: 12,
                            itemclick: function (e) {
                                if (typeof (e.dataSeries.visible) === "undefined" || e.dataSeries.visible) {
                                    e.dataSeries.visible = false;
                                } else {
                                    e.dataSeries.visible = true;
                                }
                                chart2.render();
                            }
                        },
                    });
                    chart2.options.data = [];
                    if (retval.length > 0 && retval != "Fail") {
                        var TArr = retval.split('~');
                        var arr = TArr[1].split('#');
                        var data = [];
                        var arr1 = [];
                        var arr2 = [];
                        var arr3 = [];
                        var DataPoints = [];
                        for (i = 0; i < arr.length; i++) {
                            arr1 = arr[i].split('@');
                            arr2 = arr1[1].split('%');
                            for (k = 0; k < arr2.length; k++) {
                                arr3 = arr2[k].split('$');
                                DataPoints.push({
                                    y: Number(arr3[1]),
                                    label: arr3[0],
                                });
                            }
                            window["text" + i] = { //dataSeries - first quarter
                                type: "spline",
                                fontFamily: "Verdana",
                                showInLegend: true,
                                lineThickness: 3,
                                name: arr1[0],
                                legendText: arr1[0],
                            };
                            chart2.options.data.push(window["text" + i]);
                            window["text" + i].dataPoints = DataPoints;
                            DataPoints = [];
                        }
                        chart2.render();
                        document.getElementById('PieChart').style.display = "none";
                        document.getElementById('DoughnutChart').style.display = "none";
                        document.getElementById('SplineChart').style.display = "block";
                        document.getElementById('CloumnChart').style.display = "none";
                    }
                    /*End*/
                }
            } else if (ReportName == "LateEntry") {
                if (retval.length > 0 && retval != "Fail") {
                    document.getElementById('PieChart').style.display = "none";
                    document.getElementById('DoughnutChart').style.display = "none";
                    document.getElementById('SplineChart').style.display = "block";
                    document.getElementById('CloumnChart').style.display = "none";
                    /*Late Entry Chart Type 1*/
                    var chart1 = new CanvasJS.Chart("SplineChart", {
                        animationEnabled: true,
                        zoomEnabled: true,
                        title: {
                            text: ReportHeaderName,
                            fontFamily: "Verdana",
                            fontColor: "black",
                            fontSize: 16
                        },
                        toolTip: {
                            shared: true
                        },
                        axisX: {
                            labelAngle: 130,
                            title: "Date(s)",
                            labelFontColor: 'black',
                            titleFontColor: 'black',
                        },

                        axisY: {
                            //    interval: 1,
                            title: "No Of Employees",
                            includeZero: false,
                            titleFontColor: 'black',
                        },
                        subtitles: [{
                            text: "Late Entry report From " + dtFrom + " To " + dtto,
                            fontFamily: "Verdana",
                            fontColor: "black",
                            fontSize: 15
                        }],
                        exportFileName: "Late Report",
                        exportEnabled: true,
                        legend: {
                            cursor: "pointer",
                            fontFamily: "Verdana",
                            fontSize: 12,
                            itemclick: function (e) {
                                if (typeof (e.dataSeries.visible) === "undefined" || e.dataSeries.visible) {
                                    e.dataSeries.visible = false;
                                } else {
                                    e.dataSeries.visible = true;
                                }
                                chart1.render();
                            }
                        },
                    });
                    chart1.options.data = [];
                    if (retval.length > 0 && retval != "Fail") {
                        var arr = retval.split('#');
                        var data = [];
                        var arr1 = [];
                        var arr2 = [];
                        var arr3 = [];
                        var DataPoints = [];
                        for (i = 0; i < arr.length; i++) {
                            arr1 = arr[i].split('@');
                            arr2 = arr1[1].split('%');
                            for (k = 0; k < arr2.length; k++) {
                                arr3 = arr2[k].split('$');
                                DataPoints.push({
                                    y: Number(arr3[1]),
                                    label: arr3[0]
                                });
                            }
                            //if (i == 0) {
                            //    window["text" + i] = { //dataSeries - first quarter
                            //        type: "spline",
                            //        fontFamily: "Verdana",
                            //        showInLegend: true,
                            //        lineThickness: 3,
                            //        markerType: "square",
                            //        name: arr1[0],
                            //        legendText: arr1[0],
                            //    };
                            //}
                            //else {
                            window["text" + i] = { //dataSeries - first quarter
                                type: "spline",
                                fontFamily: "Verdana",
                                showInLegend: true,
                                lineThickness: 3,
                                name: arr1[0],
                                legendText: arr1[0],
                            };
                            //}
                            chart1.options.data.push(window["text" + i]);
                            window["text" + i].dataPoints = DataPoints;
                            DataPoints = [];
                        }
                        chart1.render();
                        /*End*/
                        /*Late Entry Chart Type 2*/

                        /*End*/
                    }
                    /*End*/
                    /*Late Entry Chart Type 2*/
                    var chart2 = new CanvasJS.Chart("CloumnChart", {
                        theme: "theme2",
                        animationEnabled: true,
                        zoomEnabled: true,
                        fontFamily: "Verdana",
                        title: {
                            text: ReportHeaderName,
                            fontFamily: "Verdana",
                            fontColor: "Gray",
                            fontSize: 18
                        },
                        toolTip: {
                            shared: true
                        },
                        axisX: {
                            labelAngle: 130,

                        },
                        //axisY: {
                        //    interval: 1,
                        //},
                        subtitles: [{
                            text: "Late Report - Column Chart - From : " + dtFrom + " - To : " + dtto,
                            fontFamily: "Verdana",
                            fontColor: "Gray",
                            fontSize: 15
                        }],
                        exportFileName: "Late Report",
                        exportEnabled: true,
                        legend: {
                            cursor: "pointer",
                            fontFamily: "Verdana",
                            itemclick: function (e) {
                                if (typeof (e.dataSeries.visible) === "undefined" || e.dataSeries.visible) {
                                    e.dataSeries.visible = false;
                                } else {
                                    e.dataSeries.visible = true;
                                }
                                chart2.render();
                            }
                        },
                    });
                    chart2.options.data = [];
                    if (retval.length > 0 && retval != "Fail") {
                        var arr = retval.split('#');
                        var data = [];
                        var arr1 = [];
                        var arr2 = [];
                        var arr3 = [];
                        var DataPoints = [];
                        for (i = 0; i < arr.length; i++) {
                            arr1 = arr[i].split('@');
                            arr2 = arr1[1].split('%');
                            for (k = 0; k < arr2.length; k++) {
                                arr3 = arr2[k].split('$');
                                DataPoints.push({
                                    y: Number(arr3[1]),
                                    label: arr3[0]
                                });
                            }
                            window["text" + i] = { //dataSeries - first quarter
                                type: "column",
                                fontFamily: "Verdana",
                                showInLegend: true,
                                lineThickness: 3,
                                markerType: "square",
                                name: arr1[0],
                                legendText: arr1[0],
                            };
                            chart2.options.data.push(window["text" + i]);
                            window["text" + i].dataPoints = DataPoints;
                            DataPoints = [];
                        }
                        chart2.render();
                        /*End*/
                    }
                    /*End*/
                }
            }
            else if (ReportName == "EarlyExit") {
                if (retval.length > 0 && retval != "Fail") {
                    document.getElementById('PieChart').style.display = "none";
                    document.getElementById('DoughnutChart').style.display = "none";
                    document.getElementById('SplineChart').style.display = "block";
                    document.getElementById('CloumnChart').style.display = "none";
                    /*Early Exit Chart Type 1*/
                    var chart1 = new CanvasJS.Chart("SplineChart", {
                        animationEnabled: true,
                        zoomEnabled: true,
                        title: {
                            text: ReportHeaderName,
                            fontFamily: "Verdana",
                            fontColor: "black",
                            fontSize: 16
                        },
                        toolTip: {
                            shared: true
                        },
                        axisX: {
                            labelAngle: 130,
                            title: "Date(s)",
                            labelFontColor: 'black',
                            titleFontColor: 'black',
                        },

                        axisY: {
                            //    interval: 1,
                            title: "No Of Employees",
                            includeZero: false,
                            titleFontColor: 'black',
                        },
                        subtitles: [{
                            text: "Early Exit report From " + dtFrom + " To " + dtto,
                            fontFamily: "Verdana",
                            fontColor: "black",
                            fontSize: 15
                        }],
                        exportFileName: "Early Exit Report",
                        exportEnabled: true,
                        legend: {
                            cursor: "pointer",
                            fontFamily: "Verdana",
                            fontSize: 12,
                            itemclick: function (e) {
                                if (typeof (e.dataSeries.visible) === "undefined" || e.dataSeries.visible) {
                                    e.dataSeries.visible = false;
                                } else {
                                    e.dataSeries.visible = true;
                                }
                                chart1.render();
                            }
                        },
                    });
                    chart1.options.data = [];
                    if (retval.length > 0 && retval != "Fail") {
                        var arr = retval.split('#');
                        var data = [];
                        var arr1 = [];
                        var arr2 = [];
                        var arr3 = [];
                        var DataPoints = [];
                        for (i = 0; i < arr.length; i++) {
                            arr1 = arr[i].split('@');
                            arr2 = arr1[1].split('%');
                            for (k = 0; k < arr2.length; k++) {
                                arr3 = arr2[k].split('$');
                                DataPoints.push({
                                    y: Number(arr3[1]),
                                    label: arr3[0]
                                });
                            }
                            //if (i == 0) {
                            //    window["text" + i] = { //dataSeries - first quarter
                            //        type: "spline",
                            //        fontFamily: "Verdana",
                            //        showInLegend: true,
                            //        lineThickness: 3,
                            //        markerType: "square",
                            //        name: arr1[0],
                            //        legendText: arr1[0],
                            //    };
                            //}
                            //else {
                            window["text" + i] = { //dataSeries - first quarter
                                type: "spline",
                                fontFamily: "Verdana",
                                showInLegend: true,
                                lineThickness: 3,
                                name: arr1[0],
                                legendText: arr1[0],
                            };
                            //}
                            chart1.options.data.push(window["text" + i]);
                            window["text" + i].dataPoints = DataPoints;
                            DataPoints = [];
                        }
                        chart1.render();
                    }
                    /*End*/
                    /*Early Exit Chart Type 2*/
                    var chart2 = new CanvasJS.Chart("CloumnChart", {
                        theme: "theme2",
                        animationEnabled: true,
                        zoomEnabled: true,
                        fontFamily: "Verdana",
                        title: {
                            text: ReportHeaderName,
                            fontFamily: "Verdana",
                            fontColor: "Gray",
                            fontSize: 18
                        },
                        toolTip: {
                            shared: true
                        },
                        //axisY:{
                        //    interval:1,
                        //},
                        axisX: {
                            labelAngle: 130,

                        },
                        subtitles: [{
                            text: "Early Exit report - Column Chart - From : " + dtFrom + " - To : " + dtto,
                            fontFamily: "Verdana",
                            fontColor: "Gray",
                            fontSize: 15
                        }],
                        exportFileName: "Early Exit Report",
                        exportEnabled: true,
                        legend: {
                            cursor: "pointer",
                            fontFamily: "Verdana",
                            itemclick: function (e) {
                                if (typeof (e.dataSeries.visible) === "undefined" || e.dataSeries.visible) {
                                    e.dataSeries.visible = false;
                                } else {
                                    e.dataSeries.visible = true;
                                }
                                chart2.render();
                            }
                        },
                    });
                    chart2.options.data = [];
                    if (retval.length > 0 && retval != "Fail") {
                        var arr = retval.split('#');
                        var data = [];
                        var arr1 = [];
                        var arr2 = [];
                        var arr3 = [];
                        var DataPoints = [];
                        for (i = 0; i < arr.length; i++) {
                            arr1 = arr[i].split('@');
                            arr2 = arr1[1].split('%');
                            for (k = 0; k < arr2.length; k++) {
                                arr3 = arr2[k].split('$');
                                DataPoints.push({
                                    y: Number(arr3[1]),
                                    label: arr3[0]
                                });
                            }

                            window["text" + i] = { //dataSeries - first quarter
                                type: "column",
                                fontFamily: "Verdana",
                                showInLegend: true,
                                lineThickness: 3,
                                markerType: "square",
                                name: arr1[0],
                                legendText: arr1[0],
                            };

                            chart2.options.data.push(window["text" + i]);
                            window["text" + i].dataPoints = DataPoints;
                            DataPoints = [];
                        }
                        chart2.render();
                    }
                    /*End*/
                }
            }
            else if (ReportName == "EarlyEntry") {
                if (retval.length > 0 && retval != "Fail") {
                    document.getElementById('PieChart').style.display = "none";
                    document.getElementById('DoughnutChart').style.display = "none";
                    document.getElementById('SplineChart').style.display = "block";
                    document.getElementById('CloumnChart').style.display = "none";
                    var chart1 = new CanvasJS.Chart("SplineChart", {
                        theme: "theme2",
                        animationEnabled: true,
                        zoomEnabled: true,
                        fontFamily: "Verdana",
                        title: {
                            text: ReportHeaderName,
                            fontFamily: "Verdana",
                            fontColor: "Gray",
                            fontSize: 18
                        },
                        toolTip: {
                            shared: true
                        },
                        //axisY: {
                        //    interval: 1,
                        //},
                        axisX: {
                            labelAngle: 130,
                            labelFontColor: 'black',
                            titleFontColor: 'black',

                        },
                        subtitles: [{
                            text: "Early Entry report - Spline Chart - From : " + dtFrom + " - To : " + dtto,
                            fontFamily: "Verdana",
                            fontColor: "Gray",
                            fontSize: 15
                        }],
                        exportFileName: "Early Entry Report",
                        exportEnabled: true,
                        legend: {
                            cursor: "pointer",
                            fontFamily: "Verdana",
                            itemclick: function (e) {
                                if (typeof (e.dataSeries.visible) === "undefined" || e.dataSeries.visible) {
                                    e.dataSeries.visible = false;
                                } else {
                                    e.dataSeries.visible = true;
                                }
                                chart1.render();
                            }
                        },
                    });

                    chart1.options.data = [];
                    if (retval.length > 0 && retval != "Fail") {
                        var arr = retval.split('#');
                        var data = [];
                        var arr1 = [];
                        var arr2 = [];
                        var arr3 = [];
                        var DataPoints = [];
                        for (i = 0; i < arr.length; i++) {
                            arr1 = arr[i].split('@');
                            arr2 = arr1[1].split('%');
                            for (k = 0; k < arr2.length; k++) {
                                arr3 = arr2[k].split('$');
                                DataPoints.push({
                                    y: Number(arr3[1]),
                                    label: arr3[0]
                                });
                            }
                            //if (i == 0) {
                            //    window["text" + i] = { //dataSeries - first quarter
                            //        type: "spline",
                            //        fontFamily: "Verdana",
                            //        showInLegend: true,
                            //        lineThickness: 3,
                            //        markerType: "square",
                            //        name: arr1[0],
                            //        legendText: arr1[0],
                            //    };
                            //}
                            //else {
                            window["text" + i] = { //dataSeries - first quarter
                                type: "spline",
                                fontFamily: "Verdana",
                                showInLegend: true,
                                lineThickness: 3,
                                name: arr1[0],
                                legendText: arr1[0],
                            };
                            //}
                            chart1.options.data.push(window["text" + i]);
                            window["text" + i].dataPoints = DataPoints;
                            DataPoints = [];
                        }
                        chart1.render();
                    }
                }
            }
            else if (ReportName == "Discrepancy") {
                if (retval.length > 0 && retval != "Fail") {
                    document.getElementById('PieChart').style.display = "none";
                    document.getElementById('DoughnutChart').style.display = "none";
                    document.getElementById('SplineChart').style.display = "block";
                    document.getElementById('CloumnChart').style.display = "none";
                    var chart1 = new CanvasJS.Chart("SplineChart", {
                        animationEnabled: true,
                        zoomEnabled: true,
                        title: {
                            text: ReportHeaderName,
                            fontFamily: "Verdana",
                            fontColor: "black",
                            fontSize: 16
                        },
                        toolTip: {
                            shared: true
                        },
                        axisY: {
                            //interval: 1,
                            title: "No Of Employees",
                            includeZero: false,
                            titleFontColor: 'black',
                        },
                        axisX: {
                            labelAngle: 130,
                            title: "Date(s)",
                            labelFontColor: 'black',
                            titleFontColor: 'black',
                        },
                        subtitles: [{
                            text: "Discrepancy report From " + dtFrom + " To " + dtto,
                            fontFamily: "Verdana",
                            fontColor: "black",
                            fontSize: 15
                        }],
                        exportFileName: "Discrepancy Report",
                        exportEnabled: true,
                        legend: {
                            cursor: "pointer",
                            fontFamily: "Verdana",
                            fontSize:12,
                            itemclick: function (e) {
                                if (typeof (e.dataSeries.visible) === "undefined" || e.dataSeries.visible) {
                                    e.dataSeries.visible = false;
                                } else {
                                    e.dataSeries.visible = true;
                                }
                                chart1.render();
                            }
                        },
                    });
                    chart1.options.data = [];
                    if (retval.length > 0 && retval != "Fail") {
                        var arr = retval.split('#');
                        var data = [];
                        var arr1 = [];
                        var arr2 = [];
                        var arr3 = [];
                        var DataPoints = [];
                        for (i = 0; i < arr.length; i++) {
                            arr1 = arr[i].split('@');
                            arr2 = arr1[1].split('%');
                            for (k = 0; k < arr2.length; k++) {
                                arr3 = arr2[k].split('$');
                                DataPoints.push({
                                    y: Number(arr3[1]),
                                    label: arr3[0]
                                });
                            }
                            //if (i == 0) {
                            //    window["text" + i] = { //dataSeries - first quarter
                            //        type: "splineArea",
                            //        fontFamily: "Verdana",
                            //        showInLegend: true,
                            //        lineThickness: 3,
                            //        markerType: "square",
                            //        name: arr1[0],
                            //        legendText: arr1[0],
                            //    };
                            //}
                            //else {
                            window["text" + i] = { //dataSeries - first quarter
                                type: "splineArea",
                                fontFamily: "Verdana",
                                showInLegend: true,
                                lineThickness: 3,
                                name: arr1[0],
                                legendText: arr1[0],
                            };
                            //}
                            chart1.options.data.push(window["text" + i]);
                            window["text" + i].dataPoints = DataPoints;
                            DataPoints = [];
                        }
                        chart1.render();
                    }

                    var chart2 = new CanvasJS.Chart("CloumnChart", {
                        theme: "theme3",
                        animationEnabled: true,
                        zoomEnabled: true,
                        fontFamily: "Verdana",
                        title: {
                            text: ReportHeaderName,
                            fontFamily: "Verdana",
                            fontSize: 20
                        },
                        toolTip: {
                            shared: true
                        },
                        axisX: {
                            labelAngle: 130,
                            fontFamily: "Verdana",
                        },
                        //axisY: {
                        //    interval: 1,
                        //},
                        subtitles: [{
                            text: "Discrepancy report - Column Chart - From : " + dtFrom + " - To : " + dtto,
                            fontFamily: "Verdana",
                            fontSize: 15
                        }],
                        exportFileName: "Discrepancy Report",
                        exportEnabled: true,
                        legend: {
                            cursor: "pointer",
                            itemclick: function (e) {
                                if (typeof (e.dataSeries.visible) === "undefined" || e.dataSeries.visible) {
                                    e.dataSeries.visible = false;
                                } else {
                                    e.dataSeries.visible = true;
                                }
                                chart2.render();
                            }
                        },
                    });
                    chart2.options.data = [];
                    if (retval.length > 0 && retval != "Fail") {
                        var arr = retval.split('#');
                        var data = [];
                        var arr1 = [];
                        var arr2 = [];
                        var arr3 = [];
                        var DataPoints = [];
                        for (i = 0; i < arr.length; i++) {
                            arr1 = arr[i].split('@');
                            arr2 = arr1[1].split('%');
                            for (k = 0; k < arr2.length; k++) {
                                arr3 = arr2[k].split('$');
                                DataPoints.push({
                                    y: Number(arr3[1]),
                                    label: arr3[0]
                                });
                            }

                            window["text" + i] = { //dataSeries - first quarter
                                type: "column",
                                showInLegend: true,
                                fontFamily: "Verdana",
                                name: arr1[0],
                                legendText: arr1[0],
                            };

                            chart2.options.data.push(window["text" + i]);
                            window["text" + i].dataPoints = DataPoints;
                            DataPoints = [];
                        }
                        chart2.render();
                    }
                }
            }
            else if (ReportName == "SummaryReport") {
                if (retval.length > 0 && retval != "Fail") {
                    document.getElementById('PieChart').style.display = "none";
                    document.getElementById('DoughnutChart').style.display = "none";
                    document.getElementById('SplineChart').style.display = "none";
                    document.getElementById('CloumnChart').style.display = "block";
                    /*Head Count Report Type 1*/
                    var chart1 = new CanvasJS.Chart("SplineChart", {
                        //theme: "theme3",
                        animationEnabled: true,
                        zoomEnabled: true,
                        title: {
                            text: ReportHeaderName,
                            fontFamily: "Verdana",
                            fontColor: "black",
                            fontSize: 18
                        },
                        toolTip: {
                            shared: true
                        },
                        axisX: {
                            labelAngle: 130,
                            labelFontColor: 'black',
                            titleFontColor: 'black',
                        },
                        //axisY: {
                        //    interval: 1,
                        //},
                        subtitles: [{
                            text: "Head Count Summary Report - Column Chart - : " + dtFrom,
                            fontFamily: "Verdana",
                            fontColor: "Gray",
                            fontSize: 15
                        }],
                        exportFileName: "Head Count Summary Report",
                        exportEnabled: true,
                        legend: {
                            cursor: "pointer",
                            fontFamily: "Verdana",
                            itemclick: function (e) {
                                if (typeof (e.dataSeries.visible) === "undefined" || e.dataSeries.visible) {
                                    e.dataSeries.visible = false;
                                } else {
                                    e.dataSeries.visible = true;
                                }
                                chart1.render();
                            }
                        },
                    });
                    chart1.options.data = [];
                    if (retval.length > 0 && retval != "Fail") {
                        var arr = retval.split('#');
                        var data = [];
                        var arr1 = [];
                        var arr2 = [];
                        var arr3 = [];
                        var DataPoints = [];
                        for (i = 0; i < arr.length; i++) {
                            arr1 = arr[i].split('$');
                            arr2 = arr1[1].split('~');
                            DataPoints = [];
                            for (k = 0; k < arr2.length; k++) {
                                if (k == 0) {
                                    DataPoints.push({
                                        y: Number(arr2[k]),
                                        label: "Total Employees"
                                    });
                                }
                                else if (k == 1) {
                                    DataPoints.push({
                                        y: Number(arr2[k]),
                                        label: "Present First Half"
                                    });
                                }
                                else if (k == 2) {
                                    DataPoints.push({
                                        y: Number(arr2[k]),
                                        label: "Present Second Half"
                                    });
                                }
                                else if (k == 3) {
                                    DataPoints.push({
                                        y: Number(arr2[k]),
                                        label: "Absent First Half"
                                    });
                                }
                                else if (k == 4) {
                                    DataPoints.push({
                                        y: Number(arr2[k]),
                                        label: "Absent Second Half"
                                    });
                                }
                                else if (k == 5) {
                                    DataPoints.push({
                                        y: Number(arr2[k]),
                                        label: "Leave First Half"
                                    });
                                }
                                else if (k == 6) {
                                    DataPoints.push({
                                        y: Number(arr2[k]),
                                        label: "Leave Second Half"
                                    });
                                }
                                else if (k == 7) {
                                    DataPoints.push({
                                        y: Number(arr2[k]),
                                        label: "LOP First Half"
                                    });
                                }
                                else if (k == 8) {
                                    DataPoints.push({
                                        y: Number(arr2[k]),
                                        label: "LOP Second Half"
                                    });
                                }
                            }
                            window["text" + i] = { //dataSeries - first quarter
                                type: "column",
                                fontFamily: "Verdana",
                                name: arr1[0],
                                legendText: arr1[0],
                                showInLegend: true,
                                dataPoints: DataPoints
                            };
                            chart1.options.data.push(window["text" + i]);


                        }
                        chart1.render();
                    }
                    /*End*/
                    /*Head Count Report Type 2*/
                    var chart2 = new CanvasJS.Chart("CloumnChart", {
                        animationEnabled: true,
                        zoomEnabled: true,
                        title: {
                            text: ReportHeaderName,
                            fontFamily: "Verdana",
                            fontSize: 16
                        },
                        toolTip: {
                            shared: true
                        },
                        axisX: {
                            labelAngle: 180,
                            labelFontColor: 'black',
                            titleFontColor: 'black',
                        },
                        axisY: {
                            title: "No Of Employees",
                            includeZero: false,
                            titleFontColor: 'black',
                        },
                        subtitles: [{
                            text: "Head Count Summary Report " + dtFrom,
                            fontFamily: "Verdana",
                            fontSize: 15
                        }],
                        exportFileName: "Head Count Summary Report",
                        exportEnabled: true,
                        legend: {
                            cursor: "pointer",
                            fontFamily: "Verdana",
                            fontSize: 12,
                            itemclick: function (e) {
                                if (typeof (e.dataSeries.visible) === "undefined" || e.dataSeries.visible) {
                                    e.dataSeries.visible = false;
                                } else {
                                    e.dataSeries.visible = true;
                                }
                                chart2.render();
                            }
                        },
                    });
                    chart2.options.data = [];
                    if (retval.length > 0 && retval != "Fail") {
                        var arr = retval.split('#');
                        var data = [];
                        var arr1 = [];
                        var arr2 = [];
                        var arr3 = [];
                        var DataPoints = [];
                        for (i = 0; i < arr.length; i++) {
                            arr1 = arr[i].split('$');
                            arr2 = arr1[1].split('~');
                            DataPoints = [];
                            for (k = 0; k < arr2.length; k++) {
                                if (k == 0) {
                                    DataPoints.push({
                                        y: Number(arr2[k]),
                                        label: "Total Employees"
                                    });
                                }
                                else if (k == 1) {
                                    DataPoints.push({
                                        y: Number(arr2[k]),
                                        label: "Present First Half"
                                    });
                                }
                                else if (k == 2) {
                                    DataPoints.push({
                                        y: Number(arr2[k]),
                                        label: "Present Second Half"
                                    });
                                }
                                else if (k == 3) {
                                    DataPoints.push({
                                        y: Number(arr2[k]),
                                        label: "Absent First Half"
                                    });
                                }
                                else if (k == 4) {
                                    DataPoints.push({
                                        y: Number(arr2[k]),
                                        label: "Absent Second Half"
                                    });
                                }
                                else if (k == 5) {
                                    DataPoints.push({
                                        y: Number(arr2[k]),
                                        label: "Leave First Half"
                                    });
                                }
                                else if (k == 6) {
                                    DataPoints.push({
                                        y: Number(arr2[k]),
                                        label: "Leave Second Half"
                                    });
                                }
                                else if (k == 7) {
                                    DataPoints.push({
                                        y: Number(arr2[k]),
                                        label: "LOP First Half"
                                    });
                                }
                                else if (k == 8) {
                                    DataPoints.push({
                                        y: Number(arr2[k]),
                                        label: "LOP Second Half"
                                    });
                                }
                            }
                            window["text" + i] = { //dataSeries - first quarter
                                type: "spline",
                                name: arr1[0],
                                lineThickness: 3,
                                legendText: arr1[0],
                                showInLegend: true,
                                dataPoints: DataPoints
                            };
                            chart2.options.data.push(window["text" + i]);
                        }
                        chart2.render();
                    }
                    /*End*/
                }
            }
            else if (ReportName == "Punctuality") {
                if (retval.length > 0 && retval != "Fail") {
                    document.getElementById('PieChart').style.display = "none";
                    document.getElementById('DoughnutChart').style.display = "none";
                    document.getElementById('SplineChart').style.display = "block";
                    document.getElementById('CloumnChart').style.display = "none";
                    /*Punctuality Chart Type 1*/
                    var chart1 = new CanvasJS.Chart("SplineChart", {
                        animationEnabled: true,
                        zoomEnabled: true,
                        //theme: "theme3",
                        title: {
                            text: ReportHeaderName,
                            fontFamily: "Verdana",
                            fontColor: "black",
                            fontSize: 16
                        },
                        toolTip: {
                            shared: true
                        },
                        //axisY: {
                        //    interval: 1,
                        //},
                        axisX: {
                            labelAngle: 130,
                            title: 'Date(s)',
                            labelFontColor: 'black',
                            titleFontColor: 'black',
                        },
                        axisY: {
                            title: 'No Of Employees',
                            includeZero: false,
                            titleFontColor: 'black',
                        },
                        subtitles: [{
                            text: "Punctuality report From " + dtFrom + " To " + dtto,
                            fontFamily: "Verdana",
                            fontColor: "black",
                            fontSize: 15
                        }],
                        exportFileName: "Punctuality Report",
                        exportEnabled: true,
                        legend: {
                            cursor: "pointer",
                            fontFamily: "Verdana",
                            fontSize: 12,
                            itemclick: function (e) {
                                if (typeof (e.dataSeries.visible) === "undefined" || e.dataSeries.visible) {
                                    e.dataSeries.visible = false;
                                } else {
                                    e.dataSeries.visible = true;
                                }
                                chart1.render();
                            }
                        },
                    });

                    chart1.options.data = [];
                    if (retval.length > 0 && retval != "Fail") {
                        var arr = retval.split('#');
                        var data = [];
                        var arr1 = [];
                        var arr2 = [];
                        var arr3 = [];
                        var DataPoints = [];
                        for (i = 0; i < arr.length; i++) {
                            arr1 = arr[i].split('@');
                            arr2 = arr1[1].split('%');
                            for (k = 0; k < arr2.length; k++) {
                                arr3 = arr2[k].split('$');
                                DataPoints.push({
                                    y: Number(arr3[1]),
                                    label: arr3[0]
                                });
                            }
                            //if (i == 0) {
                            //    window["text" + i] = { //dataSeries - first quarter
                            //        type: "spline",
                            //        showInLegend: true,
                            //        lineThickness: 3,
                            //        fontFamily: "Verdana",
                            //        markerType: "square",
                            //        name: arr1[0],
                            //        legendText: arr1[0],
                            //    };
                            //}
                            //else {
                            window["text" + i] = { //dataSeries - first quarter
                                type: "spline",
                                showInLegend: true,
                                lineThickness: 3,
                                fontFamily: "Verdana",
                                name: arr1[0],
                                legendText: arr1[0],
                            };
                            //}
                            chart1.options.data.push(window["text" + i]);
                            window["text" + i].dataPoints = DataPoints;
                            DataPoints = [];
                        }
                        chart1.render();
                    }
                    /*End*/
                    /*Punctuality Chart Type 2*/
                    var chart2 = new CanvasJS.Chart("CloumnChart", {
                        theme: "theme2",
                        animationEnabled: true,
                        zoomEnabled: true,
                        fontFamily: "Verdana",
                        title: {
                            text: ReportHeaderName,
                            fontFamily: "Verdana",
                            fontColor: "Gray",
                            fontSize: 20
                        },
                        toolTip: {
                            shared: true
                        },
                        //axisY: {
                        //    interval: 1,
                        //},
                        axisX: {
                            labelAngle: 130,
                            gridColor: "Silver",
                            tickColor: "silver",
                        },
                        subtitles: [{
                            text: "Punctuality report - Spline Area Chart - From : " + dtFrom + " - To : " + dtto,
                            fontFamily: "Verdana",
                            fontColor: "Gray",
                            fontSize: 15
                        }],
                        exportFileName: "Punctuality Report",
                        exportEnabled: true,
                        legend: {
                            cursor: "pointer",
                            itemclick: function (e) {
                                if (typeof (e.dataSeries.visible) === "undefined" || e.dataSeries.visible) {
                                    e.dataSeries.visible = false;
                                } else {
                                    e.dataSeries.visible = true;
                                }
                                chart2.render();
                            }
                        },
                    });

                    chart2.options.data = [];
                    if (retval.length > 0 && retval != "Fail") {
                        var arr = retval.split('#');
                        var data = [];
                        var arr1 = [];
                        var arr2 = [];
                        var arr3 = [];
                        var DataPoints = [];
                        for (i = 0; i < arr.length; i++) {
                            arr1 = arr[i].split('@');
                            arr2 = arr1[1].split('%');
                            for (k = 0; k < arr2.length; k++) {
                                arr3 = arr2[k].split('$');
                                DataPoints.push({
                                    y: Number(arr3[1]),
                                    label: arr3[0]
                                });
                            }
                            //if (i == 0) {
                            //    window["text" + i] = { //dataSeries - first quarter
                            //        type: "splineArea",
                            //        showInLegend: true,
                            //        lineThickness: 3,
                            //        markerType: "square",
                            //        name: arr1[0],
                            //        legendText: arr1[0],
                            //    };
                            //}
                            //else {
                            window["text" + i] = { //dataSeries - first quarter
                                type: "splineArea",
                                showInLegend: true,
                                lineThickness: 3,
                                name: arr1[0],
                                legendText: arr1[0],
                            };
                            //}
                            chart2.options.data.push(window["text" + i]);
                            window["text" + i].dataPoints = DataPoints;
                            DataPoints = [];
                        }
                        chart2.render();
                    }
                    /*End*/
                }
            }
        }
    }
}