Problem with the label in dashboard, no graph appears

I have a dashboard with 11 data, on desktop it looks good, but when I go to mobile it happens that only half of my data is seen and not the donut-shaped graph. The problem I detected is that the label conflicts, I remove the label and it's fine, but I don't have a description of my data (undefined). How could I make the label not cause me problems, I hope someone can help me how to solve this little problem. I use boostrap, chartjs and the AdminLTE template Image of how my mobile dashboard is:

Image of how it should be:

<script>
  function cargar_contenido(id,vista){
        $("#"+id).load(vista);

  }
var idioma_espanol = {

      select: {
      rows: "%d fila seleccionada"
      },
      "sProcessing":     "Procesando...",
      "sLengthMenu":     "Mostrar _MENU_ registros",
      "sZeroRecords":    "No se encontraron resultados",
      "sEmptyTable":     "Ning&uacute;n dato disponible en esta tabla",
      "sInfo":           "Registros del (_START_ al _END_) total de _TOTAL_ registros",
      "sInfoEmpty":      "Registros del (0 al 0) total de 0 registros",
      "sInfoFiltered":   "(filtrado de un total de _MAX_ registros)",
      "sInfoPostFix":    "",
      "sSearch":         "Buscar:",
      "sAll":            "Todos",
      "sUrl":            "",
      "sInfoThousands":  ",",
      "sLoadingRecords": "<b>No se encontraron datos</b>",
      "oPaginate": {
          "sFirst":    "Primero",
          "sLast":     "Último",
          "sNext":     "Siguiente",
          "sPrevious": "Anterior",
      },
      "oAria": {
          "sSortAscending":  ": Activar para ordenar la columna de manera ascendente",
          "sSortDescending": ": Activar para ordenar la columna de manera descendente"
      }
    }
</script>
<script>
  Cargar_select_Almacen();
  var chartalmacen;
  function Generar_Grafico_Almacen(){
    let id = document.getElementById('select_almacen').value;
    $.ajax({
        url:'../controller/usuario/controlador_traer_productos_almacen.php',
        type:'POST',
        data:{
          id:id,
        }
    }).done(function(resp){
        var data = JSON.parse(resp);
        if(data.length>0){
            let producto = new Array();
            let cantidad = new Array();
            let cantidad2 = new Array();
            let color = new Array();
              for (let index = 0; index < data.length; index++) {
                producto.push(data[index][0]);
                cantidad.push(data[index][1]);
                /* cantidad2.push(data[index][2]); */
                color.push(colorRGB());
              }
            var ctx = document.getElementById('grafico_elmacen').getContext('2d');
            if(chartalmacen){
              chartalmacen.reset();
              chartalmacen.destroy();
            }
            chartalmacen = new Chart(ctx, {
                type: 'doughnut',
                data: {
                    labels: producto,
                    datasets: [{
                        label: 'STOCK DE PRODUCTOS',
                        backgroundColor: color,
                        borderColor: color,
                        data: cantidad
                    }]
                },
                options: {
                    scales: {
                        xAxes: [{
                            stacked: true
                        }],
                        yAxes: [{
                            stacked: true
                        }]
                    }
                }
            });
        }else{
            var ctx = document.getElementById('grafico_elmacen').getContext('2d');
            if(chartalmacen){
              chartalmacen.reset();
              chartalmacen.destroy();
            }
            chartalmacen = new Chart(ctx, {
                type: 'doughnut',
                data: {
                    labels: ['NO HAY PRODUCTOS'],
                    datasets: [{
                        label: 'STOCK DE PRODUCTOS',
                        data: [0]
                    }]
                },

                options: {
                  scales:{
                    yAxes:[{
                      ticks:{
                        beginAtZero:true
                      }
                    }]
                  }
                }
            });
        }
    })
}
</script>

Comment the label of my code and if it works, you see the donut graph, but the labels do not appear