help@rskworld.in +91 93305 39277
RSK World
  • Home
  • Development
    • Web Development
    • Mobile Apps
    • Software
    • Games
    • Project
  • Technologies
    • Data Science
    • AI Development
    • Cloud Development
    • Blockchain
    • Cyber Security
    • Dev Tools
    • Testing Tools
  • Blog
  • About
  • Contact

Theme Settings

Color Scheme
Display Options
Font Size
100%
Back to Project
RSK World
fitness-coach-bot
/
static
/
js
RSK World
fitness-coach-bot
Fitness Coach Bot - Python + Flask + SQLAlchemy + Workout Plans + Exercise Guidance + Health Tracking + AI Fitness Coach
js
  • analytics_dashboard.js11.7 KB
  • app.js11.7 KB
  • pose_detection.js21.3 KB
  • voice_recognition.js8 KB
analytics_dashboard.js
static/js/analytics_dashboard.js
Raw Download
Find: Go to:
/**
 * Advanced Analytics Dashboard with Visualizations
 * Author: RSK World (https://rskworld.in)
 * Founded by: Molla Samser
 * Designer & Tester: Rima Khatun
 * Contact: help@rskworld.in, +91 93305 39277
 * Year: 2026
 */

class AnalyticsDashboard {
    constructor() {
        this.charts = {};
        this.data = {};
        this.init();
    }

    async init() {
        await this.loadChartsLibrary();
        this.loadAnalyticsData();
        this.setupEventListeners();
    }

    async loadChartsLibrary() {
        // Load Chart.js
        if (typeof Chart === 'undefined') {
            const script = document.createElement('script');
            script.src = 'https://cdn.jsdelivr.net/npm/chart.js@4.4.0/dist/chart.umd.min.js';
            document.head.appendChild(script);
            await new Promise(resolve => script.onload = resolve);
        }
    }

    async loadAnalyticsData() {
        try {
            const response = await fetch('/api/analytics?timeframe=30');
            const data = await response.json();
            
            if (data.success) {
                this.data = data.analytics;
                this.renderAllCharts();
            }
        } catch (error) {
            console.error('Error loading analytics:', error);
        }
    }

    renderAllCharts() {
        this.renderWorkoutFrequencyChart();
        this.renderProgressChart();
        this.renderStrengthChart();
        this.renderNutritionChart();
        this.renderRecoveryChart();
        this.renderRadarChart();
    }

    renderWorkoutFrequencyChart() {
        const ctx = document.getElementById('workoutFrequencyChart');
        if (!ctx) return;

        const categories = this.data.categories || {};
        const workout = categories.workout || {};

        this.charts.workoutFrequency = new Chart(ctx, {
            type: 'line',
            data: {
                labels: this.generateDateLabels(30),
                datasets: [{
                    label: 'Workouts per Week',
                    data: this.generateWorkoutData(),
                    borderColor: 'rgb(75, 192, 192)',
                    backgroundColor: 'rgba(75, 192, 192, 0.2)',
                    tension: 0.4,
                    fill: true
                }]
            },
            options: {
                responsive: true,
                plugins: {
                    title: {
                        display: true,
                        text: 'Workout Frequency Trend'
                    },
                    legend: {
                        display: true
                    }
                },
                scales: {
                    y: {
                        beginAtZero: true,
                        ticks: {
                            stepSize: 1
                        }
                    }
                }
            }
        });
    }

    renderProgressChart() {
        const ctx = document.getElementById('progressChart');
        if (!ctx) return;

        const body = this.data.categories?.body || {};
        const metrics = body.body_metrics || {};

        this.charts.progress = new Chart(ctx, {
            type: 'bar',
            data: {
                labels: ['Weight', 'Body Fat %', 'Muscle Mass'],
                datasets: [{
                    label: 'Current',
                    data: [
                        metrics.weight?.current || 0,
                        metrics.body_fat?.current || 0,
                        metrics.muscle_mass?.current || 0
                    ],
                    backgroundColor: [
                        'rgba(54, 162, 235, 0.8)',
                        'rgba(255, 99, 132, 0.8)',
                        'rgba(75, 192, 192, 0.8)'
                    ]
                }, {
                    label: 'Start',
                    data: [
                        metrics.weight?.start || 0,
                        metrics.body_fat?.start || 0,
                        metrics.muscle_mass?.start || 0
                    ],
                    backgroundColor: [
                        'rgba(54, 162, 235, 0.4)',
                        'rgba(255, 99, 132, 0.4)',
                        'rgba(75, 192, 192, 0.4)'
                    ]
                }]
            },
            options: {
                responsive: true,
                plugins: {
                    title: {
                        display: true,
                        text: 'Body Composition Progress'
                    }
                },
                scales: {
                    y: {
                        beginAtZero: true
                    }
                }
            }
        });
    }

    renderStrengthChart() {
        const ctx = document.getElementById('strengthChart');
        if (!ctx) return;

        const strength = this.data.categories?.strength || {};
        const exercises = strength.strength_exercises || {};

        const exerciseNames = Object.keys(exercises);
        const improvements = exerciseNames.map(name => exercises[name].improvement || 0);

        this.charts.strength = new Chart(ctx, {
            type: 'line',
            data: {
                labels: exerciseNames.map(name => name.replace('_', ' ').toUpperCase()),
                datasets: [{
                    label: 'Strength Improvement %',
                    data: improvements,
                    borderColor: 'rgb(255, 99, 132)',
                    backgroundColor: 'rgba(255, 99, 132, 0.2)',
                    tension: 0.4,
                    fill: true
                }]
            },
            options: {
                responsive: true,
                plugins: {
                    title: {
                        display: true,
                        text: 'Strength Progress by Exercise'
                    }
                },
                scales: {
                    y: {
                        beginAtZero: true,
                        ticks: {
                            callback: function(value) {
                                return value + '%';
                            }
                        }
                    }
                }
            }
        });
    }

    renderNutritionChart() {
        const ctx = document.getElementById('nutritionChart');
        if (!ctx) return;

        const nutrition = this.data.categories?.nutrition || {};
        const macros = nutrition.macro_distribution || {};

        this.charts.nutrition = new Chart(ctx, {
            type: 'doughnut',
            data: {
                labels: ['Protein', 'Carbs', 'Fats'],
                datasets: [{
                    data: [
                        macros.protein || 0,
                        macros.carbs || 0,
                        macros.fat || 0
                    ],
                    backgroundColor: [
                        'rgba(255, 99, 132, 0.8)',
                        'rgba(54, 162, 235, 0.8)',
                        'rgba(255, 206, 86, 0.8)'
                    ]
                }]
            },
            options: {
                responsive: true,
                plugins: {
                    title: {
                        display: true,
                        text: 'Macronutrient Distribution'
                    },
                    legend: {
                        position: 'bottom'
                    }
                }
            }
        });
    }

    renderRecoveryChart() {
        const ctx = document.getElementById('recoveryChart');
        if (!ctx) return;

        const recovery = this.data.categories?.recovery || {};
        const sleep = recovery.sleep_data || {};

        this.charts.recovery = new Chart(ctx, {
            type: 'radar',
            data: {
                labels: ['Sleep Duration', 'Sleep Quality', 'Consistency', 'Recovery Score'],
                datasets: [{
                    label: 'Recovery Metrics',
                    data: [
                        (sleep.avg_duration || 0) * 10, // Scale to 0-100
                        sleep.avg_quality || 0,
                        sleep.consistency || 0,
                        recovery.recovery_score || 0
                    ],
                    backgroundColor: 'rgba(75, 192, 192, 0.2)',
                    borderColor: 'rgb(75, 192, 192)',
                    pointBackgroundColor: 'rgb(75, 192, 192)'
                }]
            },
            options: {
                responsive: true,
                plugins: {
                    title: {
                        display: true,
                        text: 'Recovery Overview'
                    }
                },
                scales: {
                    r: {
                        beginAtZero: true,
                        max: 100
                    }
                }
            }
        });
    }

    renderRadarChart() {
        const ctx = document.getElementById('overallRadarChart');
        if (!ctx) return;

        const categories = this.data.categories || {};

        this.charts.overall = new Chart(ctx, {
            type: 'radar',
            data: {
                labels: ['Workout', 'Strength', 'Cardio', 'Nutrition', 'Recovery', 'Body'],
                datasets: [{
                    label: 'Overall Fitness Score',
                    data: [
                        categories.workout?.score || 0,
                        categories.strength?.score || 0,
                        categories.cardio?.score || 0,
                        categories.nutrition?.score || 0,
                        categories.recovery?.score || 0,
                        categories.body?.score || 0
                    ],
                    backgroundColor: 'rgba(153, 102, 255, 0.2)',
                    borderColor: 'rgb(153, 102, 255)',
                    pointBackgroundColor: 'rgb(153, 102, 255)'
                }]
            },
            options: {
                responsive: true,
                plugins: {
                    title: {
                        display: true,
                        text: 'Overall Fitness Profile'
                    }
                },
                scales: {
                    r: {
                        beginAtZero: true,
                        max: 100
                    }
                }
            }
        });
    }

    generateDateLabels(days) {
        const labels = [];
        const today = new Date();
        for (let i = days - 1; i >= 0; i--) {
            const date = new Date(today);
            date.setDate(date.getDate() - i);
            labels.push(date.toLocaleDateString('en-US', { month: 'short', day: 'numeric' }));
        }
        return labels;
    }

    generateWorkoutData() {
        // Generate sample data - in real app, would come from backend
        const data = [];
        for (let i = 0; i < 30; i++) {
            data.push(Math.floor(Math.random() * 7) + 1);
        }
        return data;
    }

    setupEventListeners() {
        const timeframeSelect = document.getElementById('timeframeSelect');
        if (timeframeSelect) {
            timeframeSelect.addEventListener('change', (e) => {
                this.loadAnalyticsData(e.target.value);
            });
        }
    }

    exportReport() {
        // Export analytics report as PDF/image
        window.print();
    }
}

// Initialize dashboard when DOM is ready
document.addEventListener('DOMContentLoaded', () => {
    if (document.getElementById('analyticsDashboard')) {
        window.analyticsDashboard = new AnalyticsDashboard();
    }
});
363 lines•11.7 KB
javascript

About RSK World

Founded by Molla Samser, with Designer & Tester Rima Khatun, RSK World is your one-stop destination for free programming resources, source code, and development tools.

Founder: Molla Samser
Designer & Tester: Rima Khatun

Development

  • Game Development
  • Web Development
  • Mobile Development
  • AI Development
  • Development Tools

Legal

  • Terms & Conditions
  • Privacy Policy
  • Disclaimer

Contact Info

Nutanhat, Mongolkote
Purba Burdwan, West Bengal
India, 713147

+91 93305 39277

hello@rskworld.in
support@rskworld.in

© 2026 RSK World. All rights reserved.

Content used for educational purposes only. View Disclaimer