JSFiddle - React, Tailwind, and code Playground

by Osvaldo

HTML

<script src="https://cdn.jsdelivr.net/npm/chart.js@2.9.3/dist/Chart.bundle.min.js" defer></script>
<script src="https://cdn.jsdelivr.net/npm/chartjs-plugin-deferred@1.0.2" defer></script>

<div class="chart-container" style="position: relative; height:auto; width:100%">
    <canvas id="line_chart_1" width="350" height="250"></canvas>
</div>

<script>
    document.addEventListener("DOMContentLoaded", function(event) {
        var ctx = document.getElementById("line_chart_1");
        var line_chart_1 = new Chart(ctx, {
            type: 'line',
            data: {
                labels: ["2007", "2008", "2009", "2010", "2011", "2012", "2013", "2014", "2015", "2016", "2017"],
                datasets: [{
                    label: 'Presupuesto',
                    data: [3756844090, 4159380510, 4121679700, 3596326890, 2434264360, 1901425200, 1662071410, 1928648280, 2141114160, 2106753660, 1803053560],
                    borderColor: 'rgba(142, 229, 187, 1)',
                    backgroundColor: 'rgba(0,0,0,0)'
                }]
            },
            options: {
                title: {
                    display: true,
                    text: 'Presupuesto de los programas de la Secretaría de Estado de Medio Ambiente',
                    fontSize: 16,
                    fontFamily: '"Work Sans",sans-serif',
                    fontColor: '#212529'
                },
                legend: {
                    display: true,
                    labels: {
                        fontName: '"Work Sans",sans-serif',
                        fontColor: '#212529',
                        fontSize: 13
                    }
                },
                layout: {
                    padding: {
                        bottom: 20
                    }
                },

                tooltips: {
                    callbacks: {
                        label: function(tooltipItem, data) {
                            var value = tooltipItem.yLabel;
       ...