| 1012 | } |
| 1013 | |
| 1014 | function createActivityChart() { |
| 1015 | const canvas = document.getElementById("activityChart") |
| 1016 | if (!canvas) return |
| 1017 | |
| 1018 | const ctx = canvas.getContext("2d") |
| 1019 | const width = canvas.width |
| 1020 | const height = canvas.height |
| 1021 | |
| 1022 | // Clear canvas |
| 1023 | ctx.clearRect(0, 0, width, height) |
| 1024 | |
| 1025 | // Sample data for chart |
| 1026 | const data = [65, 59, 80, 81, 56, 55, 40] |
| 1027 | const labels = ["Dush", "Sesh", "Chor", "Pay", "Jum", "Shan", "Yak"] |
| 1028 | |
| 1029 | // Draw chart |
| 1030 | const maxValue = Math.max(...data) |
| 1031 | const barWidth = width / data.length |
| 1032 | |
| 1033 | ctx.fillStyle = "#3b82f6" |
| 1034 | |
| 1035 | data.forEach((value, index) => { |
| 1036 | const barHeight = (value / maxValue) * (height - 40) |
| 1037 | const x = index * barWidth + 10 |
| 1038 | const y = height - barHeight - 20 |
| 1039 | |
| 1040 | ctx.fillRect(x, y, barWidth - 20, barHeight) |
| 1041 | |
| 1042 | // Draw labels |
| 1043 | ctx.fillStyle = "#64748b" |
| 1044 | ctx.font = "12px Inter" |
| 1045 | ctx.textAlign = "center" |
| 1046 | ctx.fillText(labels[index], x + (barWidth - 20) / 2, height - 5) |
| 1047 | |
| 1048 | ctx.fillStyle = "#3b82f6" |
| 1049 | }) |
| 1050 | } |
| 1051 | |
| 1052 | // Initialize data in localStorage if not exists |
| 1053 | function initializeData() { |