4NK_IA_back/services/web_interface/chart.min.js

// Chart.js minimal pour 4NK Notariat
window.Chart = class Chart {
    constructor(ctx, config) {
        this.ctx = ctx;
        this.config = config;
        this.destroyed = false;

        // Créer un canvas simple si Chart.js n'est pas disponible
        this.createSimpleChart();
    }

    createSimpleChart() {
        if (this.destroyed) return;

        const canvas = this.ctx;
        const ctx = canvas.getContext('2d');
        const config = this.config;

        // Effacer le canvas
        ctx.clearRect(0, 0, canvas.width, canvas.height);

        if (config.type === 'doughnut') {
            this.drawDoughnutChart(ctx, config);
        } else if (config.type === 'line') {
            this.drawLineChart(ctx, config);
        }
    }

    drawDoughnutChart(ctx, config) {
        const data = config.data;
        const labels = data.labels || [];
        const values = data.datasets[0].data || [];
        const colors = data.datasets[0].backgroundColor || ['#FF6384', '#36A2EB', '#FFCE56', '#4BC0C0', '#9966FF'];
        
        const canvas = this.ctx;
        const centerX = canvas.width / 2;
        const centerY = canvas.height / 2;
        const radius = Math.min(centerX, centerY) - 20;

        const total = values.reduce((sum, val) => sum + val, 0);
        let currentAngle = 0;

        // Dessiner les segments
        values.forEach((value, index) => {
            const sliceAngle = (value / total) * 2 * Math.PI;

            ctx.beginPath();
            ctx.moveTo(centerX, centerY);
            ctx.arc(centerX, centerY, radius, currentAngle, currentAngle + sliceAngle);
            ctx.closePath();
            ctx.fillStyle = colors[index % colors.length];
            ctx.fill();

            currentAngle += sliceAngle;
        });

        // Dessiner la légende
        let legendY = 20;
        labels.forEach((label, index) => {
            ctx.fillStyle = colors[index % colors.length];
            ctx.fillRect(10, legendY, 15, 15);
            ctx.fillStyle = '#333';
            ctx.font = '12px Arial';
            ctx.fillText(label, 30, legendY + 12);
            legendY += 20;
        });
    }

    drawLineChart(ctx, config) {
        const data = config.data;
        const labels = data.labels || [];
        const values = data.datasets[0].data || [];
        const color = data.datasets[0].borderColor || '#007bff';
        
        const canvas = this.ctx;
        const padding = 40;
        const chartWidth = canvas.width - 2 * padding;
        const chartHeight = canvas.height - 2 * padding;

        const maxValue = Math.max(...values);
        const minValue = Math.min(...values);
        const valueRange = maxValue - minValue || 1;

        // Dessiner les axes
        ctx.strokeStyle = '#ddd';
        ctx.lineWidth = 1;
        ctx.beginPath();
        ctx.moveTo(padding, padding);
        ctx.lineTo(padding, canvas.height - padding);
        ctx.lineTo(canvas.width - padding, canvas.height - padding);
        ctx.stroke();

        // Dessiner la ligne
        ctx.strokeStyle = color;
        ctx.lineWidth = 2;
        ctx.beginPath();

        values.forEach((value, index) => {
            const x = padding + (index / (values.length - 1)) * chartWidth;
            const y = canvas.height - padding - ((value - minValue) / valueRange) * chartHeight;

            if (index === 0) {
                ctx.moveTo(x, y);
            } else {
                ctx.lineTo(x, y);
            }
        });

        ctx.stroke();

        // Dessiner les points
        ctx.fillStyle = color;
        values.forEach((value, index) => {
            const x = padding + (index / (values.length - 1)) * chartWidth;
            const y = canvas.height - padding - ((value - minValue) / valueRange) * chartHeight;

            ctx.beginPath();
            ctx.arc(x, y, 4, 0, 2 * Math.PI);
            ctx.fill();
        });

        // Dessiner les labels
        ctx.fillStyle = '#333';
        ctx.font = '10px Arial';
        ctx.textAlign = 'center';
        labels.forEach((label, index) => {
            const x = padding + (index / (values.length - 1)) * chartWidth;
            ctx.fillText(label, x, canvas.height - 10);
        });
    }

    destroy() {
        this.destroyed = true;
        if (this.ctx && this.ctx.clearRect) {
            this.ctx.clearRect(0, 0, this.ctx.canvas.width, this.ctx.canvas.height);
        }
    }

    update() {
        if (!this.destroyed) {
            this.createSimpleChart();
        }
    }
};

// Simuler les options globales
window.Chart.defaults = {
    responsive: true,
    maintainAspectRatio: false
};