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>
<script src="https://cdn.jsdelivr.net/npm/chartjs-plugin-annotation@0.5.7/chartjs-plugin-annotation.min.js" defer></script>

<div class="chart-container" style="position: relative; height:auto; width:100%">
    <canvas id="bar_chart_1" width="350" height="250"></canvas>
</div>
<script>
    document.addEventListener("DOMContentLoaded", function(event) {
        var ctx = document.getElementById("bar_chart_1");
        var bar_chart_1 = new Chart(ctx, {
            type: 'bar',
            data: {
                labels: ["enero", "febrero", "marzo", "abril", "mayo", "junio"],
                datasets: [{
                    label: 'Gastos en miles de euro',
                    data: [8, 9, 10, 9, 12, 13],
                    backgroundColor: [
                        'rgba(255, 225, 159, 0.85)',
                        'rgba(255, 225, 159, 0.85)',
                        'rgba(255, 225, 159, 0.85)',
                        'rgba(255, 225, 159, 0.85)',
                        'rgba(255, 225, 159, 0.85)',
                        'rgba(255, 225, 159, 0.85)',
                    ]
                }]
            },

            options: {

                legend: {
                    display: false
                },
                title: {
                    display: true,
                    text: 'Líneas y anotaciones',
                    fontSize: 16,
                    fontFamily: '"Work Sans",sans-serif',
                    fontColor: '#212529'
                },
                layout: {
                    padding: {
                        bottom: 30
                    }
                },
                scales: {
                    yAxes: [{
                        ticks: {
                            beginAtZero: true,
                            fontFamily: '"Work...