@extends('adminlte::page')

@section('title', 'Dashboard')

@section('content_header')
    <h1>Inserisci dati </h1>
    <form action="{{route('Analisi.PdfSemi')}}" method="POST">
        @csrf
    <input type="hidden" name="Sesso" id = "Sesso" value="{{$data['anSx']->Sesso}}">
    <input type="hidden" name="" id = "BCMG" value="{{$data['anSx']->BCMG['val']}}">
    <input type="hidden" name="resSx" id = "res" value="{{$data['anSx']->Resistenza}}">
    <input type="hidden" name="resDx" id = "res" value="{{$data['anDx']->Resistenza}}">
    <input type="hidden" name="reaSx" id = "rea" value="{{$data['anSx']->Reattanza}}">
    <input type="hidden" name="reaDx" id = "rea" value="{{$data['anDx']->Reattanza}}">
    <input type="hidden" name="Altezza" id = "Altezza" value="{{$data['anSx']->Altezza}}">
    <input type="hidden" name="Laf" id = "LAF" value="{{$data['anSx']->Laf}}">
    <input type="hidden" name="Peso" id = "Peso" value="{{$data['anSx']->Peso}}">
    <input type="hidden" name="DataNascita" id = "DataNascita" value="{{$data['DataNascita']}}">
    <input type="hidden" name="Formule" id = "Formule" value="{{$data['Formule']}}">
    <input type="hidden" name="Nome" id = "Nome" value="{{$data['Nome']}}">
    <button type="submit" class="btn btn-primary"  >Esporta pdf</button>
    </form>
@stop

@section('content')

<div class="row mb-4">
  <div class="col-md-4"><canvas id="myChart4" data-rea="{{$data['anSx']->Reattanza}}" data-res="{{$data['anSx']->Resistenza}}" style="position: relative; height:40vh; width:40vw" ></canvas></div>
<div class="col-md-1" > <div style="height: 530px"> <p class="text-center">Sx</p>  <canvas id="myChart1"></canvas></div></div>
<div class="col-md-1"> <div style="height: 530px"> <p class="text-center">Dx</p> <canvas id="myChart1_d"></canvas></div></div>
  <div class="col-md-1"> <div style="height: 530px"> <p class="text-center">Sx</p>  <canvas id="myChart2"></canvas></div></div>
  <div class="col-md-1"> <div style="height: 530px">  <p class="text-center">Dx</p>  <canvas id="myChart2d"></canvas></div></div>
<div class="col-md-1"> <div style="height: 530px"> <p class="text-center">Sx</p>  <canvas id="myChart3"></canvas></div></div>
<div class="col-md-1"> <div style="height: 530px">  <p class="text-center">Dx</p>  <canvas id="myChart3d"></canvas></div></div>
</div>
<div>

  </div>
<div class="row">
    <div class="col-md-12">
<div class="card">
    <div class="card-header"><h3 class="text-center">COD Analisi: {{$data['Nome']}} - Genere: {{$data['anSx']->Sesso}}</h3> </div>
    <div class="card-body">
    <div class="row">
    <div class="col-md-4">
        <div class="row"><div class="col-md-6"><h4>Resistenza Sx:</h4></div> <div class="col-md-2"><h4  id="resistenza">{{$data['anSx']->Resistenza}}</h4></div></div>
        <div class="row"><div class="col-md-6"><h4>Reattanza Sx:</h4></div> <div class="col-md-2"><h4  id="resistenza">{{$data['anSx']->Reattanza}}</h4></div></div>
        <div class="row"><div class="col-md-6"><h4>Angolo di fase Sx:</h4></div> <div class="col-md-2"><h4  id="resistenza">{{round($data['anSx']->PA['val'],2)}}</h4></div></div>
    </div>

    <div class="col-md-4">
        <div class="row"><div class="col-md-6"><h4>Resistenza Dx:</h4></div> <div class="col-md-2"><h4  id="resistenza">{{$data['anDx']->Resistenza}}</h4></div></div>
        <div class="row"><div class="col-md-6"><h4>Reattanza Dx:</h4></div> <div class="col-md-2"><h4  id="resistenza">{{$data['anDx']->Reattanza}}</h4></div></div>
        <div class="row"><div class="col-md-6"><h4>Angolo di fase Dx:</h4></div> <div class="col-md-2"><h4  id="resistenza">{{round($data['anDx']->PA['val'],2)}}</h4></div></div>
    </div>

    <div class="col-md-4">
        <div class="row"><div class="col-md-6"><h4>Età:</h4></div> <div class="col-md-2"><h4  id="resistenza">{{$data['anSx']->eta}}</h4></div></div>
        <div class="row"><div class="col-md-6"><h4>Altezza:</h4></div> <div class="col-md-2"><h4  id="resistenza">{{$data['anSx']->Altezza}}</h4></div></div>
        <div class="row"><div class="col-md-6"><h4>Peso:</h4></div> <div class="col-md-2"><h4  id="resistenza">{{round($data['anSx']->Peso,2)}}</h4></div></div>
    </div>
</div>
<div class="row">
    <div class="col-md-12 mt-4">
        <div class="row justify-content-center">
        <div class="col-md-5"><h4>ASIMMETRIA DIREZIONALE STANDARDIZZATA:</h4></div> <div class="col-md-3"><h4  id="resistenza">{{$data['DA']}}</h4></div>
        <div class="col-md-3"><h4>@if ($data['DA']>0)
            Predominanza lato destro
            @else
            Predominanza lato sinistro

        @endif</h4></div>
    </div>
    </div>
    </div>
    </div>
</div>
    </div>
</div>
<div class="row">

    <div class="col-md-8">

<table class="table">
    <thead class="thead-light">
      <tr>
        <th scope="col">Campo</th>
        <th scope="col">Lato Sinistro</th>
        <th scope="col">Lato Destro</th>
        <th scope="col">Percentuali</th>
      </tr>
    </thead>
    <tbody>
        <tr>
            <th scope="row">PhA</th>
            <td>{{round($data['anSx']->PA['val'],2)}}</td>
            <td>{{round($data['anDx']->PA['val'],2)}}</td>
            <td></td>
          </tr>
      <tr>
        <th  scope="row">C-Dex</th>
        <td>{{round($data['anSx']->BC['val']/2,0)}}</td>
        <td>{{round($data['anDx']->BC['val']/2,0)}}</td>
        <td></td>
      </tr>
      <tr>
        <th scope="row">ECL</th>
        <td>{{round($data['anSx']->ECL['val'],0)}}</td>
        <td>{{round($data['anDx']->ECL['val'],0)}}</td>
        <td></td>
      </tr>
      <tr>
        <th scope="row">Bia Index</th>
        <td>{{round($data['anSx']->BiaIndex['val'],1)}}</td>
        <td>{{round($data['anDx']->BiaIndex['val'],1)}}</td>
        <td></td>
      </tr>
      <tr>
        <th scope="row">BCM</th>
        <td>{{round($data['anSx']->BCM['val']/2,1)}}</td>
        <td>{{round($data['anDx']->BCM['val']/2,1)}}</td>
        <td>sx: {{round(($data['anSx']->BCM['val']/2)/($data['anSx']->Peso)*100,1)}} - dx: {{round(($data['anDx']->BCM['val']/2)/($data['anDx']->Peso)*100,1)}} </td>
      </tr>
      <tr>
        <th scope="row">BCM/FFM %</th>
        <td>{{round((($data['anSx']->BCM['val']/2)/($data['anSx']->FFM['val']/2))*100,1)}}</td>
        <td>{{round((($data['anDx']->BCM['val']/2)/($data['anDx']->FFM['val']/2))*100,1)}}</td>
        <td></td>
      </tr>
      <tr>
        <th scope="row">ECM</th>
        <td>{{round($data['anSx']->ECM['val']/2,1)}}</td>
        <td>{{round($data['anDx']->ECM['val']/2,1)}}</td>
        <td>sx: {{round(($data['anSx']->ECM['val']/2)/($data['anSx']->Peso)*100,1)}} - dx: {{round(($data['anDx']->ECM['val']/2)/($data['anDx']->Peso)*100,1)}} </td>
      </tr>

      <tr>
        <th scope="row">ECM/BCM</th>
        <td>{{round($data['anSx']->ECMBCM['val'],2)}}</td>
        <td>{{round($data['anDx']->ECMBCM['val'],2)}}</td>
        <td></td>
      </tr>
      <tr>
        <th scope="row">ASMM</th>
        <td>{{round($data['anSx']->ASMM['val']/2,1)}}</td>
        <td>{{round($data['anDx']->ASMM['val']/2,1)}}</td>
        <td></td>
      </tr>
      <tr>
        <th scope="row">SMM</th>
        <td>{{round($data['anSx']->SM['val']/2,1)}}</td>
        <td>{{round($data['anDx']->SM['val']/2,1)}}</td>
         <td></td>
      </tr>
      <tr>
        <th scope="row">FFM</th>
        <td>{{round($data['anSx']->FFM['val']/2,1)}}</td>
        <td>{{round($data['anDx']->FFM['val']/2,1)}}</td>
        <td>sx: {{round(($data['anSx']->FFM['val']/2)/($data['anSx']->Peso)*100,1)}} - dx: {{round(($data['anDx']->FFM['val']/2)/($data['anDx']->Peso)*100,1)}}</td>
      </tr>
      <tr>
        <th scope="row">FM</th>
        <td>{{round($data['anSx']->FM['val']/2,1)}}</td>
        <td>{{round($data['anDx']->FM['val']/2,1)}}</td>
        <td>sx: {{round(($data['anSx']->FM['val']/2)/($data['anSx']->Peso)*100,1)}} - dx: {{round(($data['anDx']->FM['val']/2)/($data['anDx']->Peso)*100,1)}} </td>
      </tr>
      <tr>
        <th scope="row">FM/FFM</th>
        <td>{{round($data['anSx']->FMFFM['val'],2)}}</td>
        <td>{{round($data['anDx']->FMFFM['val'],2)}}</td>
        <td></td>
      </tr>

      <tr>
        <th scope="row">TBW</th>
        <td>{{round($data['anSx']->TBW['val']/2,1)}}</td>
        <td>{{round($data['anDx']->TBW['val']/2,1)}}</td>
        <td>sx: {{round((($data['anSx']->TBW['val']/2)/($data['anSx']->Peso))*100,1)}} - dx: {{round((($data['anDx']->TBW['val']/2)/($data['anDx']->Peso))*100,1)}} </td>

      </tr>
      <tr>
        <th scope="row">ECW</th>
        <td>{{round(($data['anSx']->ECW['val']/2),1)}}</td>
        <td>{{round(($data['anDx']->ECW['val']/2),1)}}</td>
        <td>sx: {{round(($data['anSx']->ECW['val']/2)/($data['anSx']->TBW['val']/2)*100,1)}} - dx: {{round(($data['anDx']->ECW['val']/2)/($data['anDx']->TBW['val']/2)*100,1)}} </td>
      </tr>
      <tr>
        <th scope="row">ICW</th>
        <td>{{round(($data['anSx']->TBW['val']/2)-(($data['anSx']->TBW['val']/2)-(0.75*$data['anSx']->BCM['val']/4)),1)}}</td>
        <td>{{round(($data['anDx']->TBW['val']/2)-(($data['anDx']->TBW['val']/2)-(0.75*$data['anDx']->BCM['val']/4)),1)}}</td>
        <td>sx: {{round($data['anSx']->ICW['val']/$data['anSx']->TBW['val']*100,1)}} - dx: {{round($data['anDx']->ICW['val']/$data['anDx']->TBW['val']*100,1)}}</td>
      </tr>
      <tr>
        <th scope="row">ECW/ICW</th>
        <td>{{round($data['anSx']->ECWICW['val'],2)}}</td>
        <td>{{round($data['anDx']->ECWICW['val'],2)}}</td>
        <td></td>
      </tr>


    </tbody>
  </table>
</div>


<div class="col-md-4">
    <div class="row">
        <div class="col-md-12">

            <div class="card">
                <div class="card-header"><h3 class="text-center">Analisi segmentale</h3> </div>
                <div class="body">

                    <ul class="list-group">
                        <li class="list-group-item list-group-item-success"><strong>SLM Gamba destra Kg :</strong><span class="ml-2">{{round($data['anDx']->SlmGamba['val'],1)}}</span></li>
                        <li class="list-group-item list-group-item-success" ><strong>SLM Gamba sinistra Kg :</strong><span class="ml-2">{{round($data['anSx']->SlmGamba['val'],1)}}</span></li>
                        <li class="list-group-item list-group-item-primary"><strong>SLM Braccio destro Kg :</strong><span class="ml-2">{{round($data['anDx']->SlmBraccio['val'],1)}}</span></li>
                        <li class="list-group-item list-group-item-primary"><strong>SLM Braccio sinistro Kg :</strong><span class="ml-2">{{round($data['anSx']->SlmBraccio['val'],1)}}</span></li>
                        <li class="list-group-item list-group-item-danger"><strong>SLM tronco Kg :</strong><span class="ml-2">{{round($data['SLMTronco'],1)}}</span></li>
                        <li class="list-group-item list-group-item-primary"><strong>SLM parte superiore Kg :</strong><span class="ml-2">{{round($data['SLMUpper'],1)}}</span></li>
                        <li class="list-group-item list-group-item-primary"><strong>SLM parte inferiore Kg :</strong><span class="ml-2">{{round($data['SLMLower'],1)}}</span></li>
                        <li class="list-group-item list-group-item-success" ><strong>SM Gamba Destra Kg :</strong><span class="ml-2">{{round($data['anDx']->SmGamba['val'],1)}}</span></li>
                        <li class="list-group-item list-group-item-success" ><strong>SM Gamba Sinistra Kg :</strong><span class="ml-2">{{round($data['anSx']->SmGamba['val'],1)}}</span></li>
                        <li class="list-group-item list-group-item-success"><strong>SM Braccio Destro Kg :</strong><span class="ml-2">{{round($data['anDx']->SmBraccio['val'],1)}}</span></li>
                        <li class="list-group-item list-group-item-success"><strong>SM Braccio Sinstro Kg :</strong><span class="ml-2">{{round($data['anSx']->SmBraccio['val'],1)}}</span></li>
                    </ul>

                </div>
            </div>
             <div class="card mSidebar" style="top: 0px;">
            <div class="card-header"><h3 class="text-center">Valutazione</h3> </div>
            <div class="body">
    <textarea class="form-control" rows="10">Il soggetto in questione ha una potenziale predominanza del lato @if ($data['DA']>0)destro @else sinistro @endif (PhA + C-Dex + BIA-Index + Xc)che può derivare da varie alterazioni tra le quali traumi, scompensi posturali, od altro. Qualora il soggetto praticasse attività fisiche varie, considerare che tale condizione di squilibrio potrebbe aumentare applicando dei carichi aggiuntivi o eseguendo degli esercizi pesanti; questo perché I carichi non sarebbero distribuiti equamente su entrambi i lati del corpo.</textarea>
            </div>
        </div>




    </div>


    </div>

</div>

</div>
@stop

@section('css')

    <link rel="stylesheet" href="/css/admin_custom.css">
    <style>
        .mSidebar {
          position: relative;
          right: 0px;
          top: 0px;
          -webkit-transition: all 500ms cubic-bezier(0.255, 1, 0.44, 1);
          /* older webkit */
          -webkit-transition: all 500ms cubic-bezier(0.255, 1.225, 0.44, 1.32);
          -moz-transition: all 500ms cubic-bezier(0.255, 1.225, 0.44, 1.32);
          -o-transition: all 500ms cubic-bezier(0.255, 1.225, 0.44, 1.32);
          transition: all 500ms cubic-bezier(0.255, 1.225, 0.44, 1.32);
          /* custom */
          -webkit-transition-timing-function: cubic-bezier(0.255, 1, 0.44, 1);
          /* older webkit */
          -webkit-transition-timing-function: cubic-bezier(0.255, 1.225, 0.44, 1.32);
          -moz-transition-timing-function: cubic-bezier(0.255, 1.225, 0.44, 1.32);
          -o-transition-timing-function: cubic-bezier(0.255, 1.225, 0.44, 1.32);
          transition-timing-function: cubic-bezier(0.255, 1.225, 0.44, 1.32);
          /* custom */
        }

            </style>

@stop




@php
  if($data['anSx']->Sesso == "M")
  {
@endphp
@section('js')

<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<script src="https://cdn.jsdelivr.net/npm/chartjs-plugin-datalabels@2.0.0/dist/chartjs-plugin-datalabels.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/chartjs-plugin-annotation/1.4.0/chartjs-plugin-annotation.js" integrity="sha512-es3XL5vwq08UWKA+Fp6tZVTcJ4Kh25GsgsCSkBbPlX6QmDn3YJX0yhUVhPYQUoPX/gUFXf7uH0YtuZHGPj4iHA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script>
    $(window).scroll(function(){
    var scrollTop = $(window).scrollTop();
    var top =scrollTop - 1200
    if(top>0  && window.innerWidth>900)
    {
        $('.mSidebar').css( "top", top );
    }else{
        $('.mSidebar').css( "top", 0 );
    }

});
    const ctx4 = document.getElementById('myChart4');
    const myChart4 = new Chart(ctx4, {
    responsive :false,
    maintainAspectRatio: false,
      type: 'line',
      data: {

          datasets: [{
            label: 'Sinistro',
            backgroundColor: "rgba(255, 99, 132, 1)",
              data: [

                     {y: "{{$data['anSx']->Reattanza}}", x: "{{$data['anSx']->BiaIndex['val']}}"},

                    ],
              backgroundColor: [
                  'rgba(255, 99, 132, 1)',
              ],
              borderColor: [
                  'rgba(255, 99, 132, 1)',
              ],
              borderWidth: 2,
              pointRadius: 4,
          },{
            label: 'Destro',
              data: [

                     {y: "{{$data['anDx']->Reattanza}}", x: "{{$data['anDx']->BiaIndex['val']}}"},

                    ],
              backgroundColor: [
                'rgba(54, 162, 235, 1)',
              ],
              borderColor: [
                'rgba(54, 162, 235, 1)',
              ],
              borderWidth: 2,
              pointRadius: 4,
          }]
      },
      options: {
        aspectRatio:1,
        plugins:{
          annotation:{
            clip:true,
            drawTime: 'afterDatasetsDraw',
            annotations:[{
          type: 'line',
          yMin: 100,
          yMax: 0,
          borderColor: 'rgb(245, 48, 37)',
          borderWidth: 1,
        },{
          type: 'line',
          xMin: 7.50,
          yMax: 42,
          borderColor: 'rgb(66,245, 61)',
          borderWidth: 1,
        },{
          type: 'line',
          xMin: 4,
          xMax: 22,
          borderColor: 'rgba(0, 0, 0,0.5)',
          borderDash: [10,8],
          borderWidth: 1,
        }



        ]

          },
        },
          scales: {
              y: { // and your y axis customization as you see fit...
                max:100,
                beginAtZero: true,
                title: {
        display: true,
        text: 'Reattanza'
      },

              ticks: {
                stepSize: 0.5
            },
                        display: true,
                        scaleLabel: {
                             display: false,
                        }
                    },
              x:{
                max:18,
                min:0,
                title: {
        display: true,
        text: 'Bia-Index'
      },
                type: 'linear', // MANDATORY TO SHOW YOUR POINTS! (THIS IS THE IMPORTANT BIT)

              ticks: {
                stepSize: 1
            },

                           display: true, // mandatory
                           scaleLabel: {
                                display: false, // mandatory
                                labelString: 'Your label' // optional
                           },

              }
          }
      }
  });



    const ctx1d = document.getElementById('myChart1_d');
    const myChart1_d = new Chart(ctx1d, {
  type: 'bar',
  data: {
    labels: [""],
    datasets: [{
      label: 'FAT',
      backgroundColor: "#F5CF35",
      datalabels: {
        color: '#000000',
        formatter: (item) => {

            return "  FAT\n "+item+" Kg";
              }
      },
      data: [{{round($data['anDx']->FM['val']/2,1)}}],
    }, {
      label: 'FFM',
      datalabels: {
        color: '#000000',
        formatter: (item) => {

            return "  FFM\n "+item+" Kg";
              }
      },
      backgroundColor: "#6BA362",
      data: [{{round($data['anDx']->FFM['val']/2,1)}}],
    }],
  },

  plugins: [ChartDataLabels],
  options: {
    legend: {
            display: false
         },
         tooltips: {
            enabled: false
         },
    responsive: true,
    maintainAspectRatio: false,
    plugins: {
        legend: {
      display: false,
    },
      title: {
        display: false,
        text: 'Chart.js Bar Chart - Stacked'
      },
    },

    scales: {
      x: {
        stacked: true,
      },
      y: {
        stacked: true,
        max:{{$data['anSx']->Peso/2}},
        ticks:{display:false},
      }
    }
  }

});

const ctx1 = document.getElementById('myChart1');
    const myChart1 = new Chart(ctx1, {
  type: 'bar',
  data: {
    labels: [""],
    datasets: [{
      label: 'FAT',
      datalabels: {
        color: '#000000',
        formatter: (item) => {

                   return "  FAT\n "+item+" Kg";
              }
      },
      backgroundColor: "#F5CF35",
      data: [{{round($data['anSx']->FM['val']/2,1)}}],
    }, {
      label: 'FFM',
      datalabels: {
        color: '#000000',
        formatter: (item) => {

                return "  FFM\n "+item+" Kg";
              }
      },
      backgroundColor: "#6BA362",
      data: [{{round($data['anSx']->FFM['val']/2,1)}}],
    }],
  },

  plugins: [ChartDataLabels],
  options: {
    responsive: true,
    maintainAspectRatio: false,
    plugins: {
        legend: {
      display: false,
    },
      title: {
        display: false,
        text: 'Chart.js Bar Chart - Stacked'
      },
    },

    scales: {
      x: {

        stacked: true,
      },
      y: {
        stacked: true,
        max:{{$data['anSx']->Peso/2}},
        ticks:{display:false},
      }
    }
  }

});

    const ctx2 = document.getElementById('myChart2');
    const myChart2 = new Chart(ctx2, {
  type: 'bar',
  data: {
    labels: [""],
    datasets: [{
      label: 'FAT',
      backgroundColor: "#F5CF35",
      datalabels: {
        color: '#000000',
        formatter: (item) => {

            return "  FAT\n "+item+" Kg";
              }
      },
      data: [{{round($data['anSx']->FM['val']/2,1)}}],
    },  {
      label: 'BCM',
      backgroundColor: "#D64D3E",
      datalabels: {
        color: '#000000',
        formatter: (item) => {

            return "  BCM\n "+item+" Kg";
              }
      },
      data: [{{round($data['anSx']->BCM['val']/2,1)}}],
    }, {
      label: 'ECM',
      datalabels: {
        color: '#000000',
        formatter: (item) => {

            return "  ECM\n "+item+" Kg";
              }
      },
      backgroundColor: "#CABD78",
      data: [{{round($data['anSx']->ECM['val']/2,1)}}],
    }],
  },

  plugins: [ChartDataLabels],
  options: {
    responsive: true,
    maintainAspectRatio: false,
    plugins: {
        legend: {
      display: false,
    },
      title: {
        display: false,
        text: 'Chart.js Bar Chart - Stacked'
      },
    },

    scales: {
      x: {
        stacked: true,
      },
      y: {
        max:{{$data['anSx']->Peso/2}},
        stacked: true,
        ticks:{display:false},

      }
    }
  }

});

const ctx2d = document.getElementById('myChart2d');
    const myChart2d = new Chart(ctx2d, {
  type: 'bar',
  data: {
    labels: [""],
    datasets: [{
      label: 'FAT',
      backgroundColor: "#F5CF35",
      datalabels: {
        color: '#000000',
        formatter: (item) => {

            return "  FAT\n "+item+" Kg";
              }
      },
      data: [{{round($data['anDx']->FM['val']/2,1)}}],
    },  {
      label: 'BCM',
      backgroundColor: "#D64D3E",
      datalabels: {
        color: '#000000',
        formatter: (item) => {

            return "  BCM\n "+item+" Kg";
              }
      },
      data: [{{round($data['anDx']->BCM['val']/2,1)}}],
    }, {
      label: 'ECM',
      backgroundColor: "#CABD78",
      datalabels: {
        color: '#000000',
        formatter: (item) => {

            return "  ECM\n "+item+" Kg";
              }
      },
      data: [{{round($data['anDx']->ECM['val']/2,1)}}],
    }],
  },
  plugins: [ChartDataLabels],

  options: {
    responsive: true,
    maintainAspectRatio: false,
    plugins: {
        legend: {
      display: false,
    },
      title: {
        display: false,
        text: 'Chart.js Bar Chart - Stacked'
      },
    },

    scales: {
      x: {
        stacked: true,
      },
      y: {
        max:{{$data['anDx']->Peso/2}},
        stacked: true,
        ticks:{display:false}

      }
    }
  }

});

const ctx3 = document.getElementById('myChart3');
    const myChart3 = new Chart(ctx3, {
  type: 'bar',
  data: {
    labels: [""],
    datasets: [{
      label: 'ICW',
      datalabels: {
        color: '#000000',
        formatter: (item) => {

            return "  ICW%\n "+item+"%";
              }
      },
      backgroundColor: "#5EF3FA",
      data: [{{round(($data['anSx']->ICW['val']/2)/($data['anSx']->TBW['val']/2)*100,1)}}],
    }, {
      label: 'ECW',
      datalabels: {
        color: '#000000',
        formatter: (item) => {

            return "  ECW%\n "+item+"%";
              }
      },
      backgroundColor: "#68B0FA",
      data: [{{round(($data['anSx']->ECW['val']/2)/($data['anSx']->TBW['val']/2)*100,1)}}],
    }],
  },

  plugins: [ChartDataLabels],
  options: {
    responsive: true,
    maintainAspectRatio: false,
    plugins: {
        legend: {
      display: false,
    },
      title: {
        display: false,
        text: 'Chart.js Bar Chart - Stacked'
      },
    },

    scales: {
      x: {

      },
      y: {
        max:100,
        ticks:{display:false}

      }
    }
  }

});


const ctx3d = document.getElementById('myChart3d');
    const myChart3d = new Chart(ctx3d, {
  type: 'bar',
  data: {
    labels: [""],
    datasets: [{
      label: 'ICW',
      datalabels: {
        color: '#000000',
        formatter: (item) => {

            return "  ICW%\n "+item+"%";
              }
      },
      backgroundColor: "#5EF3FA",
      data: [{{round(($data['anDx']->ICW['val']/2)/($data['anDx']->TBW['val']/2)*100,2)}}],
    }, {
      label: 'ECW',
      datalabels: {
        color: '#000000',
        formatter: (item) => {

            return "  ECW%\n "+item+"%";
              }
      },      backgroundColor: "#68B0FA",
      data: [{{round(($data['anDx']->ECW['val']/2)/($data['anDx']->TBW['val']/2)*100,2)}}],
    }],
  },

  plugins: [ChartDataLabels],
  options: {
    responsive: true,
    maintainAspectRatio: false,
    plugins: {
        legend: {
      display: false,
    },
      title: {
        display: false,
        text: 'Chart.js Bar Chart - Stacked'
      },
    },

    scales: {
      x: {

      },
      y: {
        max:100,
        ticks:{
            display:false
        }

      }
    }
  }

});

    const ctx = document.getElementById('myChart4');
  const myChart = new Chart(ctx, {
    responsive :false,
    maintainAspectRatio: false,
      type: 'line',
      data: {

          datasets: [{
            label: 'Xc/Rz Sinistra',
              data: [

                     {x: "{{$data['anSx']->Resistenza}}", y: "{{$data['anSx']->Reattanza}}"},

                    ],
              backgroundColor: [
                  'rgba(255, 99, 132, 1)',
                  'rgba(54, 162, 235, 0.2)',
                  'rgba(255, 206, 86, 0.2)',
                  'rgba(75, 192, 192, 0.2)',
                  'rgba(153, 102, 255, 0.2)',
                  'rgba(255, 159, 64, 0.2)'
              ],
              borderColor: [
                  'rgba(255, 99, 132, 1)',
                  'rgba(54, 162, 235, 1)',
                  'rgba(255, 206, 86, 1)',
                  'rgba(75, 192, 192, 1)',
                  'rgba(153, 102, 255, 1)',
                  'rgba(255, 159, 64, 1)'
              ],
              borderWidth: 4
          },
          {
            label: 'Xc/Rz Destra',
              data: [

                     {x: "{{$data['anDx']->Resistenza}}", y: "{{$data['anDx']->Reattanza}}"},

                    ],
              backgroundColor: [
                  'rgba(54, 162, 235, 1)',
                  'rgba(54, 162, 235, 1)',
                  'rgba(54, 162, 235, 1)',
                  'rgba(54, 162, 235, 1)',
                  'rgba(54, 162, 235, 1)'
              ],
              borderColor: [
                  'rgba(54, 162, 235, 1)',
                  'rgba(54, 162, 235, 1)',
                  'rgba(54, 162, 235, 1)',
                  'rgba(54, 162, 235, 1)',
                  'rgba(54, 162, 235, 1)'
              ],
              borderWidth: 4
          }]
      },
      options: {
        aspectRatio:1,
        plugins:{
          annotation:{
            drawTime: 'afterDatasetsDraw',
            annotations:[{
          type: 'line',
          yMin: 79,
          yMax: 32,
          borderColor: 'rgb(0, 0, 0)',
          borderWidth: 1,
        },{
          type: 'line',
          xMin: 720,
          xMax: 300,
          borderColor: 'rgb(0, 0, 0)',
          borderWidth: 1,
        },{
              type: 'ellipse',
              xMin: 230,
          xMax: 820,
          yMin: 40,
          yMax: 68,
          rotation:-66,
          backgroundColor: 'rgba(33, 99, 132, 0.15)',
              label: {
                enabled: false,
                content: 'Test label'
              }
            },{
              type: 'ellipse',
              xMin: 300,
          xMax:  750,
          yMin: 44,
          yMax: 64,
          rotation:-66,
          backgroundColor: 'rgba(22, 11, 132, 0.15)',
              label: {
                enabled: false,
                content: 'Test label'
              }
            },{
              type: 'ellipse',
              xMin: 385,
          xMax:  670,
          yMin: 48,
          yMax: 62,
          rotation:-66,
          backgroundColor: 'rgba(11, 99, 132, 0.15)',
              label: {
                enabled: false,
                content: 'Test label'
              }
            }]

          },
        },
          scales: {
              y: { // and your y axis customization as you see fit...

                beginAtZero: true,
                max: 100,
                title: {
        display: true,
        text: 'Reattanza'
      },
              min: 0,
                        display: true,
                        scaleLabel: {
                             display: false,
                        }
                    },
              x:{
                title: {
        display: true,
        text: 'Resistenza'
      },
                type: 'linear', // MANDATORY TO SHOW YOUR POINTS! (THIS IS THE IMPORTANT BIT)
                max: 1000,
              min: 0,
                           display: true, // mandatory
                           beginAtZero: true,
                           scaleLabel: {
                                display: false, // mandatory
                                labelString: 'Your label' // optional
                           },

              }
          }
      }
  });
//fine

  $("#ricarica").click(function() {
    myChart.update();

});
</script>

@stop
@php
}else{
@endphp
@section('js')
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/chartjs-plugin-annotation/1.4.0/chartjs-plugin-annotation.js" integrity="sha512-es3XL5vwq08UWKA+Fp6tZVTcJ4Kh25GsgsCSkBbPlX6QmDn3YJX0yhUVhPYQUoPX/gUFXf7uH0YtuZHGPj4iHA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://cdn.jsdelivr.net/npm/chartjs-plugin-datalabels@2.0.0/dist/chartjs-plugin-datalabels.min.js"></script>
<script>
    $(window).scroll(function(){
    var scrollTop = $(window).scrollTop();
    var top =scrollTop - 1200
    if(top>0  && window.innerWidth>900)
    {
        $('.mSidebar').css( "top", top );
    }else{
        $('.mSidebar').css( "top", 0 );
    }

});

    const ctx1 = document.getElementById('myChart1');
    const myChart1 = new Chart(ctx1, {
  type: 'bar',
  data: {
    labels: [""],
    datasets: [{
      label: 'FAT',
      datalabels: {
        color: '#000000',
        formatter: (item) => {
                return '     FAT\n '+item + ' ' + "Kg";
              }
      },
      backgroundColor: "#F5CF35",
      data: [{{round($data['anSx']->FM['val']/2,1)}}],

    }, {
      label: 'FFM',
      backgroundColor: "#D63F3E",
      datalabels: {
        color: '#000000',
        formatter: (item) => {
                return '     FFM\n '+item + ' ' + "Kg";
              }
      },
      data: [{{round($data['anSx']->FFM['val']/2,1)}}],
    }],
  },

  plugins: [ChartDataLabels],
  options: {
    responsive: true,
    maintainAspectRatio: false,

    plugins: {
        legend:{
            display:false,
        },
      title: {
        display: false,
        text: 'Chart.js Bar Chart - Stacked'
      },
    },

    scales: {
      x: {
        stacked: true,
      },
      y: {
        stacked: true,
        max:{{$data['anSx']->Peso/2}},
        ticks: {
        display: false,
      }

      }
    }
  }

});

const ctx1d = document.getElementById('myChart1_d');
    const myChart1d = new Chart(ctx1d, {
  type: 'bar',
  data: {
    labels: [""],
    datasets: [{
      label: 'FAT',
      datalabels: {
        color: '#000000',
        formatter: (item) => {
                return '     FAT\n '+item + ' ' + "Kg";
              }
      },
      backgroundColor: "#F5CF35",
      data: [{{round($data['anDx']->FM['val']/2,1)}}],

    }, {
      label: 'FFM',
      datalabels: {
        color: '#000000',
        formatter: (item) => {
                return '     FFM\n '+item + ' ' + "Kg";
              }
      },
      backgroundColor: "#D63F3E",
      data: [{{round($data['anDx']->FFM['val']/2,1)}}],
    }],
  },

  plugins: [ChartDataLabels],
  options: {
    responsive: true,
    maintainAspectRatio: false,
    plugins: {
        legend:{
            display:false
        },
      title: {
        display: false,
        text: 'Chart.js Bar Chart - Stacked'
      },
    },

    scales: {
      x: {
        stacked: true,
      },
      y: {
        stacked: true,
        max:{{$data['anDx']->Peso/2}},
        ticks: {
        display: false,
      }

      }
    }
  }

});

    const ctx2 = document.getElementById('myChart2');
    const myChart2 = new Chart(ctx2, {
  type: 'bar',
  data: {
    labels: [""],
    datasets: [{
      label: 'FAT',
      datalabels: {
        color: '#000000',
        formatter: (item) => {
                return '     FAT\n '+item + ' ' + "Kg";
              }
      },
      backgroundColor: "#F5CF35",
      data: [{{round($data['anSx']->FM['val']/2,1)}}],
    },  {
      label: 'BCM',
      datalabels: {
        color: '#000000',
        formatter: (item) => {
                return '     BCM\n '+item + ' ' + "Kg";
              }
      },
      backgroundColor: "#D64D3E",
      data: [{{round($data['anSx']->BCM['val']/2,1)}}],
    }, {
      label: 'ECM',
      datalabels: {
        color: '#000000',
        formatter: (item) => {
                return '     ECM\n '+item + ' ' + "Kg";
              }
      },
      backgroundColor: "#F5B87A",
      data: [{{round($data['anSx']->ECM['val']/2,1)}}],
    }],
  },

  plugins: [ChartDataLabels],
  options: {
    responsive: true,
    maintainAspectRatio: false,
    plugins: {
        legend:{display:false},
      title: {
        display: false,
        text: 'Chart.js Bar Chart - Stacked'
      },
    },

    scales: {
      x: {
        stacked: true,
      },
      y: {
        stacked: true,
        max:{{$data['anDx']->Peso/2}},
        ticks: {
        display: false,
      }

      }
    }
  }

});

const ctx2d = document.getElementById('myChart2d');
    const myChart2d = new Chart(ctx2d, {
  type: 'bar',
  data: {
    labels: [""],
    datasets: [{
      label: 'FAT',
      datalabels: {
        color: '#000000',
        formatter: (item) => {
                return '     FAT\n '+item + ' ' + "Kg";
              }
      },
      backgroundColor: "#F5CF35",
      data: [{{round($data['anDx']->FM['val']/2,2)}}],
    },  {
      label: 'BCM',
      datalabels: {
        color: '#000000',
        formatter: (item) => {
                return '     BCM\n '+item + ' ' + "Kg";
              }
      },
      backgroundColor: "#D64D3E",
      data: [{{round($data['anDx']->BCM['val']/2,1)}}],
    }, {
      label: 'ECM',
      datalabels: {
        color: '#000000',
        formatter: (item) => {
                return '     ECM\n '+item + ' ' + "Kg";
              }
      },
      backgroundColor: "#F5B87A",
      data: [{{round($data['anDx']->ECM['val']/2,1)}}],
    }],
  },

  plugins: [ChartDataLabels],
  options: {
    responsive: true,
    maintainAspectRatio: false,
    plugins: {
        legend:{
            display:false
        },
      title: {
        display: false,
        text: 'Chart.js Bar Chart - Stacked'
      },
    },

    scales: {
      x: {
        stacked: true,
      },
      y: {
        stacked: true,
        max:{{$data['anDx']->Peso/2}},
        ticks:{
            display:false,
        }

      }
    }
  }

});
const ctx3 = document.getElementById('myChart3');
    const myChart3 = new Chart(ctx3, {
  type: 'bar',
  data: {
    labels: [""],
    datasets: [{
      label: 'ICW',
      datalabels: {
        color: '#000000',
        formatter: (item) => {
                return 'ICW%\n'+item;
              }
      },
      backgroundColor: "#5EF3FA",
      data: [{{round($data['anSx']->ICW['val']/$data['anSx']->TBW['val']*100,1)}}],
    }, {
      label: 'ECW',
      datalabels: {
        color: '#000000',
        formatter: (item) => {
                return 'ECW%\n'+item;
              }
      },
      backgroundColor: "#68B0FA",
      data: [{{round($data['anSx']->ECW['val']/$data['anSx']->TBW['val']*100,1)}}],
    }],
  },

  plugins: [ChartDataLabels],
  options: {
    responsive: true,
    maintainAspectRatio: false,
    plugins: {
   legend:{display:false},
      title: {
        display: false,
        text: 'Chart.js Bar Chart - Stacked'
      },
    },

    scales: {
      x: {

      },
      y: {

        max:100,
        ticks:{
            display:false
        }
      }
    }
  }

});

const ctx3d = document.getElementById('myChart3d');
    const myChart3d = new Chart(ctx3d, {
  type: 'bar',
  data: {
    labels: [""],
    datasets: [{
      label: 'ICW',
      datalabels: {
        color: '#000000',
        formatter: (item) => {
                return 'ICW%\n'+item;
              }
      },
      backgroundColor: "#5EF3FA",
      data: [{{round($data['anDx']->ICW['val']/$data['anDx']->TBW['val']*100,1)}}],
    }, {
      label: 'ECW',
      datalabels: {
        color: '#000000',
        formatter: (item) => {
                return 'ECW%\n'+item;
              }
      },
      backgroundColor: "#68B0FA",
      data: [{{round($data['anDx']->ECW['val']/$data['anDx']->TBW['val']*100,1)}}],
    }],
  },

  plugins: [ChartDataLabels],
  options: {
    responsive: true,
    maintainAspectRatio: false,
    plugins: {
        legend:{display:false},
      title: {
        display: false,
        text: 'Chart.js Bar Chart - Stacked'
      },
    },

    scales: {
      x: {

      },
      y: {
        max:100,
        ticks:{
            display:false
        }

      }
    }
  }

});


const ctx4 = document.getElementById('myChart4');
    const myChart4 = new Chart(ctx4, {
    responsive :false,
    maintainAspectRatio: false,
      type: 'line',
      data: {

          datasets: [{
            label: 'Sinistro',
            backgroundColor: "rgba(255, 99, 132, 1)",
              data: [

                     {y: "{{$data['anSx']->Reattanza}}", x: "{{$data['anSx']->BiaIndex['val']}}"},

                    ],
              backgroundColor: [
                  'rgba(255, 99, 132, 1)',
              ],
              borderColor: [
                  'rgba(255, 99, 132, 1)',
              ],
              borderWidth: 2,
              pointRadius: 4,
          },{
            label: 'Destro',
              data: [

                     {y: "{{$data['anDx']->Reattanza}}", x: "{{$data['anDx']->BiaIndex['val']}}"},

                    ],
              backgroundColor: [
                'rgba(54, 162, 235, 1)',
              ],
              borderColor: [
                'rgba(54, 162, 235, 1)',
              ],
              borderWidth: 2,
              pointRadius: 4,
          }]
      },
      options: {
        aspectRatio:1,
        plugins:{
          annotation:{
            clip:true,
            drawTime: 'afterDatasetsDraw',
            annotations:[{
          type: 'line',
          yMin: 100,
          yMax: 0,
          borderColor: 'rgb(245, 48, 37)',
          borderWidth: 1,
        },{
          type: 'line',
          xMin: 7.50,
          yMax: 42,
          borderColor: 'rgb(66,245, 61)',
          borderWidth: 1,
        },{
          type: 'line',
          xMin: 4,
          xMax: 22,
          borderColor: 'rgba(0, 0, 0,0.5)',
          borderDash: [10,8],
          borderWidth: 1,
        }



        ]

          },
        },
          scales: {
              y: { // and your y axis customization as you see fit...
                max:100,
                beginAtZero: true,
                title: {
        display: true,
        text: 'Reattanza'
      },

              ticks: {
                stepSize: 0.5
            },
                        display: true,
                        scaleLabel: {
                             display: false,
                        }
                    },
              x:{
                max:18,
                min:0,
                title: {
        display: true,
        text: 'Bia-Index'
      },
                type: 'linear', // MANDATORY TO SHOW YOUR POINTS! (THIS IS THE IMPORTANT BIT)

              ticks: {
                stepSize: 1
            },

                           display: true, // mandatory
                           scaleLabel: {
                                display: false, // mandatory
                                labelString: 'Your label' // optional
                           },

              }
          }
      }
  });
//fine

  $("#ricarica").click(function() {
    myChart.update();

});
</script>

@stop

@php
}
@endphp