        <div class="col-lg-6">
            <div class="card user-detail-box">
            <div class="box-header">
              <!--Originalheadline-->
              <!--<h4>Zu welcher Wochentag aktive (in Sekunden)</h4>-->
              <!--Headline ggf. missverstaendlich-->
              <h4>Benutzeraktivität (gemessen in Sekunden/Wochentag)</h4>
            </div>
            <div class="box-body">
                    <canvas id="chartJSContainersumweekdayactive" width="600" height="400"></canvas>
                    <script>
                      var barUserActiveSumweekday;

                      jQuery( document ).ready(function() {
                        var userActiveSumweekdayOptions = {
                      type: 'bar',
                      data: {
                        labels: {{sumweekdayactive_l| raw}},
                        datasets: [
                            {
                              label: 'Aktivität in Sekunden/Wochentag',
                              backgroundColor: 'rgba(255,255,0,0.25)',
                              borderColor: 'rgba(255,255,0,1)',
                              hoverBackgroundColor: 'rgba(255,255,0,0.5)',
                              showLine: false,
                              borderWidth: 1,
                              data: {{sumweekdayactive_v| raw}}
                              
                            }
                          ]
                      },
                      options: {
                        scales: {
                          xAxes:{
                            scaleLabel:{
                              display:true,
                              labelString: 'Wochentag'
                            },
                            
                            ticks:{
                              // Reduzierung der Labels für jede Bar auf 2 Zeichen zur besseren Darstellung
                              callback: function(value, index, values){
                                var day = "-";
                                switch(value){
                                  
                                  case '0': day = "Mo"; break;
                                  case '1': day = "Di"; break;
                                  case '2': day = "Mi"; break;
                                  case '3': day = "Do"; break;
                                  case '4': day = "Fr"; break;
                                  case '5': day = "Sa"; break;
                                  case '6': day = "So"; break;

                                }
                                return day;
                              }
                            }
                            
                          },
                          yAxes:{
                            scaleLabel:{
                              display:true,
                              labelString: 'Zeit in Sekunden'
                            },
                            ticks:{
                              beginAtZero: true
                            }
                          }
                      },
                              plugins: {
                          zoom: {
                            zoom: {
                              wheel: {
                                enabled: true,
                              },
                              pinch: {
                                enabled: true
                              },          
                              mode: 'xy',
                            },
                            pan: {
                                enabled: true,
                                mode: 'xy'
                              },
                          }
                        },
                        tooltips:{
                          callbacks:{
                            // Stelle beim Hovern über eine Bar den vollen Namen des Labels dar
                            title:function(value){
                              var day = "-";

                              switch(value[0].xLabel){
                                case "Mo": day = "Montag"; break;
                                case "Di": day = "Dienstag"; break;
                                case "Mi": day = "Mittwoch"; break;
                                case "Do": day = "Donnerstag"; break;
                                case "Fr": day = "Freitag"; break;
                                case "Sa": day = "Samstag"; break;
                                case "So": day = "Sonntag"; break;
                              }
                              return day;
                            }
                          }
                        }
                          
                      }
                    }
                    var ctx = document.getElementById('chartJSContainersumweekdayactive').getContext('2d');
                    barUserActiveSumweekday = new Chart(ctx, userActiveSumweekdayOptions);

                      }); //document.ready


                    </script>
                    
            </div>
            <div class="box-footer d-flex justify-content-end">
                  <button type="button" class="btn btn-primary mr-2" id="systemstatistiken-excelexport-sumweekday" title="Chart als Excel-Datei speichern"><i class="fas fa-file-excel mr-2"></i>Download Excel</button>
                  <button type="button" class="btn btn-primary" id="systemstatistiken-pdfexport-sumweekday" title="Chart als PDF-Datei speichern"><i class="fas fa-file-pdf mr-2"></i>Download PDF</button>
            </div>
          </div>
        </div>
        <!--/lg-6-->