JSFiddle - React, Tailwind, and code Playground

by greenpeace

HTML

<!-- https://jsfiddle.net/greenpeace/7esyjqkm/ -->
<script src="https://cdn.jsdelivr.net/npm/chart.js@2.9.1/dist/Chart.bundle.min.js" defer></script>
<script src="https://cdn.jsdelivr.net/npm/chartjs-plugin-deferred@1.0.1" defer></script>
<p style="text-align: center;"><strong>Distribución de las 117 medidas de la propuesta “Darle la vuelta al sistema” según contenido</strong></p>
<div class="chart-container" style="position: relative; height:auto; width:100%">
    <canvas id="grafica_medidas" width="350" height="250"></canvas>
</div>
<script>
    document.addEventListener("DOMContentLoaded", function(event) {
        var ctx = document.getElementById("grafica_medidas").getContext("2d");
        var grafica_medidas = new Chart(ctx, {
                type: 'pie',
                data: {
                    datasets: [{
                        data: [
                            22.7,
                            43.2,
                            34.1
                        ],
                        backgroundColor: [
                            'rgba(122, 189, 148, 0.85)',
                            'rgba(255, 225, 159, 0.85)',
                            'rgba(255, 196, 167, 0.85)'
                        ],
                        label: 'Dataset 1'
                    }],
                    labels: [
                        'Cambio de prioridades en las actuaciones',
                        'Cambio normativo o regulatorio',
                        'Inversión o gasto'

                    ]
                },
                options: {
                    circumference: 2 * Math.PI,
                    rotation: -0.5 * Math.PI,
                    title: {
                        display: false,
                        text: 'Distribución de las 117 medidas de la propuesta “Darle la vuelta al sistema” según contenido',
                        fontSize: 16,
                        fontFamily: '"Work Sans",sans-serif',
                        fontColor:...