New
Bonjour,
Tu es professeur de SES dans un lycée et tu souhaites intégrer un graphique interactif à un contenu moodle pour évaluer la capacité de tes élèves à interpréter un document statistique. Les données portent sur le taux de croissance du PIB français en volume de 1950 à 2023. Les voici :
1950
1951 5,66 %
1952 3,13 %
1953 3,37 %
1954 5,70 %
1955 5,38 %
1956 5,05 %
1957 5,62 %
1958 2,78 %
1959 2,77 %
1960 7,95 %
1961 4,95 %
1962 6,86 %
1963 6,10 %
1964 6,58 %
1965 4,84 %
1966 5,16 %
1967 4,80 %
1968 4,54 %
1969 7,09 %
1970 6,20 %
1971 5,29 %
1972 4,51 %
1973 6,19 %
1974 4,41 %
1975 -0,95 %
1976 4,34 %
1977 3,55 %
1978 3,95 %
1979 3,70 %
1980 1,68 %
1981 1,19 %
1982 2,44 %
1983 1,26 %
1984 1,61 %
1985 1,57 %
1986 2,39 %
1987 2,55 %
1988 4,81 %
1989 4,41 %
1990 2,83 %
1991 1,24 %
1992 1,52 %
1993 -0,36 %
1994 2,38 %
1995 2,30 %
1996 1,40 %
1997 2,53 %
1998 3,45 %
1999 3,40 %
2000 4,14 %
2001 1,90 %
2002 1,07 %
2003 0,97 %
2004 2,87 %
2005 1,89 %
2006 2,71 %
2007 2,53 %
2008 0,38 %
2009 -2,82 %
2010 2,00 %
2011 2,44 %
2012 0,18 %
2013 0,78 %
2014 1,00 %
2015 1,07 %
2016 0,86 %
2017 2,08 %
2018 1,65 %
2019 2,03 %
2020 -7,44 %
2021 6,88 %
2022 2,57 %
2023 0,94 %
PeuxPeux-tu me générer un code html à intégrer à une page moodle pour représenter ces données ?
Mar 15, 11:22pm

Pour créer un graphique interactif représentant le taux de croissance du PIB français en volume de 1950 à 2023, nous pouvons utiliser une bibliothèque JavaScript comme Chart.js. Voici un exemple de code HTML que vous pouvez intégrer dans une page Moodle :

html
<!DOCTYPE html>
<html lang="fr">
<head>
    <meta charset="UTF-8">
    <title>Taux de croissance du PIB français</title>
    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
</head>
<body>
    <h2>Taux de croissance du PIB français en volume (1950-2023)</h2>
    <canvas id="pibChart" width="600" height="400"></canvas>
    <script>
        const ctx = document.getElementById('pibChart').getContext('2d');
        const pibChart = new Chart(ctx, {
            type: 'line',
            data: {
                labels: [
                    '1950', '1951', '1952', '1953', '1954', '1955', '1956', '1957', '1958', '1959',
                    '1960', '1961', '1962', '1963', '1964', '1965', '1966', '1967', '1968', '1969',
                    '1970', '1971', '1972', '1973', '1974', '1975', '1976', '1977', '1978', '1979',
                    '1980', '1981', '1982', '1983', '1984', '1985', '1986', '1987', '1988', '1989',
                    '1990', '1991', '1992', '1993', '1994', '1995', '1996', '1997', '1998', '1999',
                    '2000', '2001', '2002', '2003', '2004', '2005', '2006', '2007', '2008', '2009',
                    '2010', '2011', '2012', '2013', '2014', '2015', '2016', '2017', '2018', '2019',
                    '2020', '2021', '2022', '2023'
                ],
                datasets: [{
                    label: 'Taux de croissance du PIB (%)',
                    data: [
                        null, 5.66, 3.13, 3.37, 5.70, 5.38, 5.05, 5.62, 2.78, 2.77,
                        7.95, 4.95, 6.86, 6.10, 6.58, 4.84, 5.16, 4.80, 4.54, 7.09,
                        6.20, 5.29, 4.51, 6.19, 4.41, -0.95, 4.34, 3.55, 3.95, 3.70,
                        1.68, 1.19, 2.44, 1.26, 1.61, 1.57, 2.39, 2.55, 4.81, 4.41,
                        2.83, 1.24, 1.52, -0.36, 2.38, 2.30, 1.40, 2.53, 3.45, 3.40,
                        4.14, 1.90, 1.07, 0.97, 2.87, 1.89, 2.71, 2.53, 0.38, -2.82,
                        2.00, 2.44, 0.18, 0.78, 1.00, 1.07, 0.86, 2.08, 1.65, 2.03,
                        -7.44, 6.88, 2.57, 0.94
                    ],
                    borderColor: 'rgba(75, 192, 192, 1)',
                    borderWidth: 1,
                    fill: false
                }]
            },
            options: {
                scales: {
                    y: {
                        beginAtZero: true
                    }
                }
            }
        });
    </script>
</body>
</html>

Instructions pour l'intégration dans Moodle :

  1. Accédez à votre cours Moodle et activez le mode édition.
  2. Ajoutez une ressource de type "Page" ou "Étiquette".
  3. Collez le code HTML ci-dessus dans l'éditeur de texte.
  4. Enregistrez les modifications.

Ce code crée un graphique interactif en ligne qui affiche le taux de croissance du PIB français de 1950 à 2023. Les élèves pourront interagir avec le graphique pour mieux comprendre les variations du PIB au fil des ans.

Mar 15, 11:22pm
Peux-tu préciser le troisième point ? En effet, si je copie du code dans l'éditeur de texte de moodle comme tel, il ne sera pas interpréter.
Mar 15, 11:56pm

Vous avez raison, l'éditeur de texte de Moodle ne permet pas d'insérer directement du code HTML brut sans une configuration appropriée. Voici comment vous pouvez intégrer le graphique interactif dans Moodle :

Étapes pour intégrer le code HTML dans Moodle :

  1. Accédez à votre cours Moodle et activez le mode édition.

  2. Ajoutez une ressource :

    • Vous pouvez ajouter une "Page" ou une "Étiquque" pour insérer du contenu HTML.

  3. Utilisez l'éditeur HTML :

    • Dans l'éditeur de texte, cliquez sur l'icône "HTML" ou "Code source" (souvent représentée par <>). Cela vous permet d'accéder directement au code HTML.

  4. Collez le code HTML :

    • Collez le code HTML fourni dans la zone de code source. Assurez-vous que tout le code, y compris les balises <script>, est inclus.

  5. Enregistrez les modifications :

    • Sauvegardez la page ou l'étiquette. Le graphique devrait maintenant s'afficher correctement.

Remarque :

  • Permissions : Assurez-vous que votre rôle dans Moodle vous permet d'insérer du code HTML. Parfois, les administrateurs restreignent cette fonctionnalité pour des raisons de sécurité.
  • Compatibilité : Vérifiez que Moodle est configuré pour autoriser l'exécution de scripts JavaScript. Si ce n'est pas le cas, vous devrez peut-être contacter l'administrateur du site pour activer cette fonctionnalité.

En suivant ces étapes, vous devriez pouvoir intégrer le graphique interactif dans votre cours Moodle. Si vous rencontrez des problèmes, il peut être utile de consulter la documentation de Moodle ou de contacter l'assistance technique de votre établissement.

Mar 15, 11:56pm

This Chat is read-only. Login to resume chatting.

<!DOCTYPE html> <html lang="fr"> <head> <meta charset="UTF-8"> <title>Taux de croissance du PIB français</title> <script src="https://cdn.jsdelivr.net/npm/chart.js"></script> </head> <body> <h2>Taux de croissance du PIB français en volume (1950-2023)</h2> <canvas id="pibChart" width="600" height="400"></canvas> <script> const ctx = document.getElementById('pibChart').getContext('2d'); const pibChart = new Chart(ctx, { type: 'line', data: { labels: [ '1950', '1951', '1952', '1953', '1954', '1955', '1956', '1957', '1958', '1959', '1960', '1961', '1962', '1963', '1964', '1965', '1966', '1967', '1968', '1969', '1970', '1971', '1972', '1973', '1974', '1975', '1976', '1977', '1978', '1979', '1980', '1981', '1982', '1983', '1984', '1985', '1986', '1987', '1988', '1989', '1990', '1991', '1992', '1993', '1994', '1995', '1996', '1997', '1998', '1999', '2000', '2001', '2002', '2003', '2004', '2005', '2006', '2007', '2008', '2009', '2010', '2011', '2012', '2013', '2014', '2015', '2016', '2017', '2018', '2019', '2020', '2021', '2022', '2023' ], datasets: [{ label: 'Taux de croissance du PIB (%)', data: [ null, 5.66, 3.13, 3.37, 5.70, 5.38, 5.05, 5.62, 2.78, 2.77, 7.95, 4.95, 6.86, 6.10, 6.58, 4.84, 5.16, 4.80, 4.54, 7.09, 6.20, 5.29, 4.51, 6.19, 4.41, -0.95, 4.34, 3.55, 3.95, 3.70, 1.68, 1.19, 2.44, 1.26, 1.61, 1.57, 2.39, 2.55, 4.81, 4.41, 2.83, 1.24, 1.52, -0.36, 2.38, 2.30, 1.40, 2.53, 3.45, 3.40, 4.14, 1.90, 1.07, 0.97, 2.87, 1.89, 2.71, 2.53, 0.38, -2.82, 2.00, 2.44, 0.18, 0.78, 1.00, 1.07, 0.86, 2.08, 1.65, 2.03, -7.44, 6.88, 2.57, 0.94 ], borderColor: 'rgba(75, 192, 192, 1)', borderWidth: 1, fill: false }] }, options: { scales: { y: { beginAtZero: true } } } }); </script> </body> </html>