`; } const renderChart = (id, type, data, options) => { if(charts[id]) charts[id].destroy(); charts[id] = new Chart(document.getElementById(id), { type, data, options }); }; function renderScoreDistributionChart(userScores) { const bins = Array(10).fill(0); userScores.forEach(u => { const binIndex = Math.min(Math.floor(u.score / 10), 9); bins[binIndex]++; }); const labels = Array.from({length: 10}, (_, i) => `${i*10+1}-${(i+1)*10}%`); renderChart('assess-score-dist-chart', 'bar', { labels, datasets: [{ label: 'Number of Participants', data: bins, backgroundColor: 'rgba(59, 130, 246, 0.7)' }] }, { responsive: true, maintainAspectRatio: false, scales: {y: {beginAtZero: true, ticks: {stepSize: 1}}} } ); } function renderTopicPerformanceChart(topicStats) { renderChart('assess-topic-perf-chart', 'bar', { labels: topicStats.map(t => t.topic), datasets: [{ label: '% Correct', data: topicStats.map(t => t.correctness), backgroundColor: 'rgba(22, 163, 74, 0.7)' }] }, { responsive: true, maintainAspectRatio: false, indexAxis: 'y', scales: {x: {max: 100, beginAtZero: true}} } ); } function renderQuestionAnalysisTable(questionStats) { elements.qTableHead.innerHTML = `Question IDTopic% Correct`; elements.qTableBody.innerHTML = questionStats .sort((a,b) => a.correctness - b.correctness) .map(q => `${q.qid}${q.topic}${q.correctness.toFixed(1)}%`).join(''); } window.assessDownloadPDF = () => { html2canvas(document.getElementById('assess-pdf-content'), { scale: 2 }).then(canvas => { const pdf = new jspdf.jsPDF({ orientation: 'landscape', unit: 'pt', format: 'a4' }); pdf.addImage(canvas.toDataURL('image/png'), 'PNG', 40, 40, pdf.internal.pageSize.getWidth() - 80, 0); pdf.save('Assessment_Dashboard_Report.pdf'); }); }; loadSampleData(); // Load sample data on page load });