CharacterDistribution.js: Difference between revisions

Revision as of 19:09, 31 August 2025

document.addEventListener('DOMContentLoaded', () => {
    // Container auf der Seite finden
    const container = document.getElementById('chart-placeholder');
    if (!container) return; // Abbruch, falls Container nicht gefunden

    // Canvas erzeugen und an Container anhängen
    const canvas = document.createElement('canvas');
    canvas.id = 'testChart';
    canvas.width = 800;
    canvas.height = 400;
    container.appendChild(canvas);

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

    // Minimaler Balken-Chart
    const data = {
        labels: ['A', 'B', 'C', 'D'],
        datasets: [{
            label: 'Test-Daten',
            data: [10, 20, 30, 25],
            backgroundColor: ['red', 'blue', 'green', 'orange'],
            borderColor: ['red', 'blue', 'green', 'orange'],
            borderWidth: 1
        }]
    };

    const config = {
        type: 'bar',
        data: data,
        options: {
            responsive: true,
            plugins: { legend: { display: true } },
            scales: {
                y: { beginAtZero: true }
            }
        }
    };

    new Chart(ctx, config);
});