MediaWiki

MediaWiki:CharacterDistribution.js

From Illustrations in German Translations of Mark Twain's Works

Revision as of 19:09, 31 August 2025 by HMHTEST (talk | contribs)

Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.
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);
});