JSFiddle - React, Tailwind, and code Playground

by greenpeace

HTML

<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/Chart.bundle.min.js" defer></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]" defer></script>
<div style="text-align: center; font-weight: 700; font-family: 'Work Sans', sans-serif; margin-top: 1.5em;">Concentraciones de CO2 en la atmósfera entre 1958 y 2019</div>
<div class="chart-container" style="position: relative; height:auto; width:100%;">
    <canvas id="line_chart_by_year" width="350" height="280"></canvas>
</div>
<script>
    document.addEventListener("DOMContentLoaded", function(event) {
        var ctx = document.getElementById("line_chart_by_year");
        var line_chart_1 = new Chart(ctx, {
            type: 'line',
            data: {
                labels: [
                    "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",
               ...