Blame view

resources/views/vendor/consoletvs/charts/chartjs/donut.blade.php 2.33 KB
b7c7a5f6   Alexey Boroda   first commit
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
  @if(!$model->customId)
      @include('charts::_partials.container.canvas2')
  @endif
  
  <script type="text/javascript">
      var ctx = document.getElementById("{{ $model->id }}")
  
      var myChart = new Chart(ctx, {
          type: 'doughnut',
          data: {
              labels: [
                  @foreach($model->labels as $label)
                      "{!! $label !!}",
                  @endforeach
              ],
              datasets: [{
                  data: [
                      @foreach($model->values as $dta)
                          {{ $dta }},
                      @endforeach
                  ],
                  backgroundColor: [
                      @if($model->colors)
                          @foreach($model->colors as $color)
                              "{{ $color }}",
                          @endforeach
                      @else
                          @foreach($model->values as $dta)
                              "{{ sprintf('#%06X', mt_rand(0, 0xFFFFFF)) }}",
                          @endforeach
                      @endif
                  ],
              }]
          },
          options: {
              responsive: {{ $model->responsive || !$model->width ? 'true' : 'false' }},
              maintainAspectRatio: false,
              legend: {
                  display: true,
                  fullWidth: true,
                  position: 'right',
              },
              tooltips: {
                  callbacks: {
                      label: function(tooltipItem, data) {
                          var allData = data.datasets[tooltipItem.datasetIndex].data;
                          var tooltipLabel = data.labels[tooltipItem.index];
                          var tooltipData = allData[tooltipItem.index];
                          var total = 0;
  
                          var label = tooltipLabel.split(" - ");
  
                          for (var i in allData) {
                              total += allData[i];
                          }
  
                          var tooltipPercentage = Math.round((tooltipData / total) * 100);
  
                          return label[1] + ': ' + label[0] + ' (' + tooltipPercentage + '%)';
                      }
                  }
              },
              @if($model->title)
              title: {
                  display: true,
                  text: "{!! $model->title !!}",
                  fontSize: 20,
              }
              @endif
          }
      });
  </script>