관리-도구
편집 파일: dashboard-admin.js
"use strict"; let getInstructorByMonth = $("#getInstructorByMonth").val(); let instructorMonth = $("#instructorMonth").val(); instructorMonth = JSON.parse(instructorMonth); getInstructorByMonth = JSON.parse(getInstructorByMonth); let studentDate = $("#studentDate").val(); let getStudentByDate = $("#getStudentByDate").val(); studentDate = JSON.parse(studentDate); getStudentByDate = JSON.parse(getStudentByDate); // instructor Student register chart. const instructorStudent = { chart: { type: "area", height: 320, width: "100%", offsetX: -5, offsetY: 15, toolbar: { show: false, }, events: { mounted: (chart) => { chart.windowResizeHandler(); }, }, }, xaxis: { categories: studentDate, offsetX: 4, }, yaxis: { min: 5, max: 90, tickAmount: 5, labels: { formatter: (val) => val, }, }, series: [ { name: registerInstructor, data: getInstructorByMonth, }, { name: studentInstructor, data: getStudentByDate, }, ], plotOptions: { bar: { horizontal: false, columnWidth: "18%", endingShape: "rounded", }, }, grid: { borderColor: "#EEE", }, dataLabels: { enabled: false, }, stroke: { curve: "straight", colors: ["#795DED", "#76D466"], width: 2.5, }, fill: { type: "gradient", gradient: { opacityFrom: 0.4, opacityTo: 0.15, stops: [0, 60], }, }, legend: { position: "top", horizontalAlign: "left", offsetX: -30, offsetY: 0, markers: { width: 7, height: 7, radius: 99, fillColors: ["#795DED", "#76D466"], offsetX: -3, offsetY: -1, }, itemMargin: { horizontal: 20, }, }, tooltip: { y: { formatter: (val) => { return val; }, }, }, }; const averageEnroll = new ApexCharts( document.querySelector("#instructor-student-chart"), instructorStudent ); averageEnroll.render();