@using System
@using System.Globalization

@model Tuple<List<Station>, List<DateTime>, List<string>, int, List<Measurement>, List<Measurement>, List<Measurement>> ;

@{
    ViewData["Title"] = "Historie";
}

<div class="row row-cols-1 py-2">
    <div class="col-10 text-left">
        <h2>Historie měření</h2>
    </div>

    <div class="col-2 text-right">
    </div>
</div>

<div class="row row-cols-1 py-2">
        <div class="col-lg-12">
            <div class="card h-100 overflow-hidden text-black rounded-5 shadow-lg bg-light bg-opacity-10">
                <div class="d-flex flex-column h-100 text-shadow-1">
                    <form method="post" > 
                        <div class="row">    
			                <div class="col-12 text-center">      
                                <h4>Výběr dat pro zobrazení</h4>
                            </div>
  			            </div>

                        <div class="row row-col-2 ">    
			                
                            <div class="col-4 text-right">

                            <div class="row row-col-2 ">                    
                                <div class="col-5 text-right">      
                                    Stanice:        
                                </div>

                                <div class="col-7 text-left"> 
	                                <select name="stationId">
                                        @foreach(var station in Model.Item1)
                                        {
                                            <option value="@station.StationId">@station.Name</option>
                                        }
                                    </select>
                                </div>
  			                </div>


			                <div class="row row-col-2 ">
                                <div class="col-5 text-right">      
                                    Období:      
                                </div>
                            <div class="col-7 text-left">     
                                <div class="form-check">
                                  <input class="form-check-input" type="radio" name="reportType" id="daily" value="1" @{if(Model.Item4 == 1){<text>checked</text>}}>
                                  <label class="form-check-label" for="daily">
                                  Den
                                  </label>
                                </div>
                                <div class="form-check">
                                  <input class="form-check-input" type="radio" name="reportType" id="weekly" value="2" @{if(Model.Item4 == 2){<text>checked</text>}}>
                                  <label class="form-check-label" for="weekly">
                                    Týden
                                  </label>
                                </div>
                                <div class="form-check">
                                  <input class="form-check-input" type="radio" name="reportType" id="monthly" value="3" @{if(Model.Item4 == 3){<text>checked</text>}}>
                                  <label class="form-check-label" for="monthly">
                                    Měsíc
                                  </label>
                                </div>
                                <div class="form-check">
                                  <input class="form-check-input" type="radio" name="reportType" id="annual" value="4" @{if(Model.Item4 == 4){<text>checked</text>}}>
                                  <label class="form-check-label" for="annual">
                                    Rok
                                  </label>
                                </div>
                            </div>
                            </div>

                            <div class="row row-col-2 ">
                            <div class="col-5 text-right">      
                                Od data:        
                            </div>
                            <div class="col-7 text-left"> 
                                <input name="firstDate" type="date" value="@Model.Item2.ElementAt(1).ToString("yyyy'-'MM'-'dd")" min="@Model.Item2.ElementAt(0).ToString("yyyy'-'MM'-'dd")" max="@Model.Item2.ElementAt(2).ToString("yyyy'-'MM'-'dd")" />

  			                </div>
  			                </div>
                              
                          </div>
                          <div class="col-8 text-left"> 
                                <h5>Grafy pro zobrazení</h5>


                                <div class="row row-col-3 ">
                                    <div class="col-4 text-left">
                                <div class="form-check">
                                  <input class="form-check-input" type="checkbox" name="graphs[]" value="Temperature" id="graphs" @{if(Model.Item3.Count == 0||Model.Item3.Contains("Temperature")){<text>checked</text>}}>
                                  <label class="form-check-label" for="flexCheckDefault">
                                    <a class="text-dark" href="#Temperature">Teplota</a>
                                  </label>
                                </div>
                                <div class="form-check">
                                  <input class="form-check-input" type="checkbox" name="graphs[]" value="TemperatureFeelsLike" id="graphs" @{if(Model.Item3.Count == 0||Model.Item3.Contains("TemperatureFeelsLike")){<text>checked</text>}}>
                                  <label class="form-check-label" for="flexCheckChecked">
                                      <a class="text-dark" href="#TemperatureFeelsLike">Pocitová teplota</a>
                                  </label>
                                </div>
                                <div class="form-check">
                                  <input class="form-check-input" type="checkbox" name="graphs[]" value="DewPoint" id="graphs" @{if(Model.Item3.Count == 0||Model.Item3.Contains("DewPoint")){<text>checked</text>}}>
                                  <label class="form-check-label" for="flexCheckChecked">
                                      <a class="text-dark" href="#DewPoint">Rosný bod</a>
                                  </label>
                                </div>
                                <div class="form-check">
                                  <input class="form-check-input" type="checkbox" name="graphs[]" value="Humidity" id="graphs" @{if(Model.Item3.Count == 0||Model.Item3.Contains("Humidity")){<text>checked</text>}}>
                                  <label class="form-check-label" for="flexCheckChecked">
                                      <a class="text-dark" href="#Humidity">Vzdušná vlhkost</a>
                                  </label>
                                </div>
                                <div class="form-check">
                                  <input class="form-check-input" type="checkbox" name="graphs[]" value="Pressure" id="graphs" @{if(Model.Item3.Count == 0||Model.Item3.Contains("Pressure")){<text>checked</text>}}>
                                  <label class="form-check-label" for="flexCheckChecked">
                                      <a class="text-dark" href="#Pressure">Tlak vzduchu</a>
                                  </label>
                                </div>
                                <div class="form-check">
                                  <input class="form-check-input" type="checkbox" name="graphs[]" value="SeaLevelPressure" id="graphs" @{if(Model.Item3.Count == 0||Model.Item3.Contains("SeaLevelPressure")){<text>checked</text>}}>
                                  <label class="form-check-label" for="flexCheckChecked">
                                      <a class="text-dark" href="#SeaLevelPressure">Tlak vzduchu přepočtený na hladinu moře</a>
                                  </label>
                                </div>
                                </div>


                                 <div class="col-4 text-left"> 
                                     <div class="form-check">
                                  <input class="form-check-input" type="checkbox" name="graphs[]" value="WindSpeed" id="graphs" @{if(Model.Item3.Count == 0||Model.Item3.Contains("WindSpeed")){<text>checked</text>}}>
                                  <label class="form-check-label" for="flexCheckChecked">
                                      <a class="text-dark" href="#WindSpeed">Rychlost a směr větru</a>
                                  </label>
                                </div>
                                <div class="form-check">
                                  <input class="form-check-input" type="checkbox" name="graphs[]" value="RainAmount" id="graphs" @{if(Model.Item3.Count == 0||Model.Item3.Contains("RainAmount")){<text>checked</text>}}>
                                  <label class="form-check-label" for="flexCheckChecked">
                                      <a class="text-dark" href="#RainAmount">Srážky</a>
                                  </label>
                                </div>
                                <div class="form-check">
                                  <input class="form-check-input" type="checkbox" name="graphs[]" value="UvIndex" id="graphs" @{if(Model.Item3.Count == 0||Model.Item3.Contains("UvIndex")){<text>checked</text>}}>
                                  <label class="form-check-label" for="flexCheckChecked">
                                      <a class="text-dark" href="#UvIndex">UV index</a>
                                  </label>
                                </div>
                                <div class="form-check">
                                  <input class="form-check-input" type="checkbox" name="graphs[]" value="SoilTemp" id="graphs" @{if(Model.Item3.Count == 0||Model.Item3.Contains("SoilTemp")){<text>checked</text>}}>
                                  <label class="form-check-label" for="flexCheckChecked">
                                      <a class="text-dark" href="#SoilTemp">Teplota půdy</a>
                                  </label>
                                </div>
                                <div class="form-check">
                                  <input class="form-check-input" type="checkbox" name="graphs[]" value="SoilMoisture" id="graphs" @{if(Model.Item3.Count == 0||Model.Item3.Contains("SoilMoisture")){<text>checked</text>}}>
                                  <label class="form-check-label" for="flexCheckChecked">
                                      <a class="text-dark" href="#SoilMoisture">Vlhkost půdy</a>
                                  </label>
                                </div>

                                     
  			                </div>
                            <div class="col-4 text-left"> 
                                
                                <div class="form-check">
                                  <input class="form-check-input" type="checkbox" name="graphs[]" value="BatteryVoltage" id="graphs" @{if(Model.Item3.Count == 0||Model.Item3.Contains("BatteryVoltage")){<text>checked</text>}}>
                                  <label class="form-check-label" for="flexCheckChecked">
                                      <a class="text-dark" href="#BatteryVoltage">Napětí baterie</a>
                                  </label>
                                </div>

                                <div class="form-check">
                                  <input class="form-check-input" type="checkbox" name="graphs[]" value="TemperatureAndTemperstureFeelsLike" id="graphs" @{if(Model.Item3.Count == 0||Model.Item3.Contains("TemperatureAndTemperstureFeelsLike")){<text>checked</text>}}>
                                  <label class="form-check-label" for="flexCheckChecked">
                                      <a class="text-dark" href="#TemperatureAndTemperstureFeelsLike">Teplota + Pocitová teplota</a>
                                  </label>
                                </div>

                                <div class="form-check">
                                  <input class="form-check-input" type="checkbox" name="graphs[]" value="SoilTempAndTemperature" id="graphs" @{if(Model.Item3.Count == 0||Model.Item3.Contains("SoilTempAndTemperature")){<text>checked</text>}}>
                                  <label class="form-check-label" for="flexCheckChecked">
                                      <a class="text-dark" href="#SoilTempAndTemperature">Teplota + Teplota půdy</a>
                                  </label>
                                </div>

                                <div class="form-check">
                                  <input class="form-check-input" type="checkbox" name="graphs[]" value="SoilMoistureAndHumidity" id="graphs" @{if(Model.Item3.Count == 0||Model.Item3.Contains("SoilMoistureAndHumidity")){<text>checked</text>}}>
                                  <label class="form-check-label" for="flexCheckChecked">
                                      <a class="text-dark" href="#SoilMoistureAndHumidity">Vlhkost + Vlhkost půdy</a>
                                  </label>
                                </div>
                                
                                <div class="form-check">
                                  <input class="form-check-input" type="checkbox" name="graphs[]" value="TemperatureAndHumidity" id="graphs" @{if(Model.Item3.Count == 0||Model.Item3.Contains("TemperatureAndHumidity")){<text>checked</text>}}>
                                  <label class="form-check-label" for="flexCheckChecked">
                                      <a class="text-dark" href="#TemperatureAndHumidity">Teplota + Vlhkost</a>
                                  </label>
                                </div>
  			                </div>

  			                </div>

  			                </div>

			                <div class="col-6 pt-2 pb-2 text-center">      
    
                            </div>
   				            <div class="col-6 pt-2 pb-2 text-center">     
                                <input type="submit" value="Zobrazit" formaction="History">
                            </div>
  			            </div>
                    </form>
                </div>
  	        </div>
        </div>
    </div>
<!-- End of data selection -->


<div class="text-center">
    <div class="pt-5">
        @{
        switch (Model.Item4) 
            {
                // Daily
                case 1:
                    {
                        <h2>Historie za den @Model.Item2.ElementAt(1).ToString("dd'.'MM'.'yyyy")</h2>
                        <p>V grafech jsou zobrazeny hodnoty naměřené stanicí za 1 den</p>
                        break;
                    }
                // Weekly
                case 2:
                    {
                        <h2>Historie za týden od @Model.Item2.ElementAt(1).ToString("dd'.'MM'.'yyyy")</h2>
                        <p>V grafech jsou zobrazeny průměrné, maximální a minimální hodnoty naměřené stanicí za 1 týden, průměrování po 1 hodině</p>
                        break;
                    }
                // Monthly
                case 3:
                    {
                        <h2>Historie za měsíc od @Model.Item2.ElementAt(1).ToString("dd'.'MM'.'yyyy")</h2>
                        <p>V grafech jsou zobrazeny průměrné, maximální a minimální hodnoty naměřené stanicí za 1 měsíc, průměrování po 1 dni</p>
                        break;
                    }
                // Annual
                case 4:
                    {
                        <h2>Historie za rok od @Model.Item2.ElementAt(1).ToString("dd'.'MM'.'yyyy")</h2>
                        <p>V grafech jsou zobrazeny průměrné, maximální a minimální hodnoty naměřené stanicí za 1 rok, průměrování po 1 týdnu</p>
                        break;
                    }
                default:
                    {
                        <h2>Historie za den @Model.Item2.ElementAt(1).ToString("dd'.'MM'.'yyyy")</h2>
                        <p>V grafech jsou zobrazeny hodnoty naměřené stanicí</p>
                        break;

                    }
        }
        }
    
</div>

    <div class="row row-cols-1 justify-content-center">
        <div class="col-lg-10">
            <!-- Common variables for graphs -->
            <script>
                var xLabelsLong = [
                            @{
                                switch(Model.Item4)
                                {
                                    // Week
                                    case 2:
                                    {
                                        @foreach (var item in Model.Item5)
                                        {
                                            string dateString = item.Timestamp.ToString("dd.MM.yyyy HH:00-");
                                            dateString += item.Timestamp.AddHours(1).ToString("HH:00");
                                            <text>"</text>@dateString<text>",</text>
                                        }
                                        break;
                                    }
                                    // Month
                                    case 3:
                                    {
                                        @foreach (var item in Model.Item5)
                                        {
                                            <text>"</text>@item.Timestamp.ToString("dd.MM.yyyy")<text>",</text>
                                        }
                                        break;
                                    }
                                    // Year
                                    case 4:
                                    {
                                        @foreach (var item in Model.Item5)
                                        {
                                            string dateString = item.Timestamp.ToString("dd.MM.yyyy-");
                                            dateString += item.Timestamp.AddDays(7).ToString("dd.MM.yyyy");
                                            <text>"</text>@dateString<text>",</text>
                                        }
                                        break;
                                    }
                                    // Day
                                    default:
                                    {
                                        @foreach (var item in Model.Item5)
                                        {
                                            <text>"</text>@item.Timestamp.ToString("dd.MM.yyyy HH:mm")<text>",</text>
                                        }
                                        break;
                                    }
                                }
                            }];
                var xLabelsShort = [
                            @{
                                switch(Model.Item4)
                                {
                                    // Week
                                    case 2:
                                    {
                                        @foreach (var item in Model.Item5)
                                        {
                                            <text>"</text>@item.Timestamp.ToString("dd.MM.yyyy HH:00")<text>",</text>
                                        }
                                        break;
                                    }
                                    // Month
                                    case 3:
                                    {
                                        @foreach (var item in Model.Item5)
                                        {
                                            <text>"</text>@item.Timestamp.ToString("dd.MM.yyyy")<text>",</text>
                                        }
                                        break;
                                    }
                                    // Year
                                    case 4:
                                    {
                                        @foreach (var item in Model.Item5)
                                        {
                                            <text>"</text>@item.Timestamp.ToString("MM. yyyy");<text>",</text>
                                        }
                                        break;
                                    }
                                    // Day
                                    default:
                                    {
                                        @foreach (var item in Model.Item5)
                                        {
                                            <text>"</text>@item.Timestamp.ToString("HH:00")<text>",</text>
                                        }
                                        break;
                                    }
                                }
                            }];
                var xMaxTicks = 
                            @{
                                switch(Model.Item4)
                                {
                                    // Week
                                    case 2:
                                    {
                                        <text>7</text>
                                        break;
                                    }
                                    // Month
                                    case 3:
                                    {
                                        <text>15</text>
                                        break;
                                    }
                                    // Year
                                    case 4:
                                    {
                                        <text>12</text>
                                        break;
                                    }
                                    // Day
                                    default:
                                    {
                                        <text>12</text>
                                        break;
                                    }
                                }
                            };
                var xValues = [
                                @{
                                    if (Model.Item4 == 1)
                                    {
                                        @foreach (var item in Model.Item5)
                                        {
                                            @item.MeasurementId.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>
                                        }
                                    }
                                    else 
                                    {
                                        int id = 0;
                                        @foreach (var item in Model.Item5)
                                        {
                                            id++;
                                            @id
                                        }
                                    }
                                }
                            ];
            </script>

@{if(Model.Item3.Count == 0||Model.Item3.Contains("Temperature"))
{
    <text>
<!-- Temperature -->
            <div id="Temperature" class="card h-10 overflow-hidden text-black rounded-5 shadow-lg bg-light bg-opacity-50">
                <div class="d-flex flex-column h-100 text-shadow-1">
                    <div class="row">    
			            <div class="col-12 text-center">      

                        <canvas id="temperature" style="width:100%"></canvas>
                       
                        <script>
                            var yValues = [
                                @{
                                    @foreach (var item in Model.Item5)
                                    {
                                        @item.Temperature.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>
                                    }
                                }
                            ];
                            var yValues2 = [
                            @{
                                if (Model.Item4 != 1)
                                {
                                    int index = 0;
                                    @foreach (var item in Model.Item5)
                                    {
                                        <text>[</text>@Model.Item6.ElementAt(index).Temperature.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>@Model.Item7.ElementAt(index).Temperature.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>],</text>
                                        index++;
                                    }
                                }
                            }
                            ];
                                new Chart("temperature", 
                                {
                                data: {
                                datasets: [
                                {
                                type: "line",
                                fill: false,
                                pointStyle: 'crossRot',
                                borderWidth: 1,
                                lineTension: 0,
                                radius: 5,
                                backgroundColor: "rgba(0,0,255,1.0)",
                                borderColor: "rgba(0,0,255,1.0)",
                                @{
                                    if (Model.Item4 != 1)
                                    {
                                        <text>label: 'Průměrná teplota', </text>
                                                
                                    } 
                                    else 
                                    {
                                        <text>label: 'Teplota', </text>
                                    }
                                }
                                  data: yValues,
                                  labels: xLabelsLong
                                },
                                @{
                                    if(Model.Item4 != 1)
                                    {   
                                        <text>{
                                          type: "bar",
                                          fill: false,
                                          lineTension: 0,
                                          backgroundColor: "rgba(0,0,255,0.4)",
                                          borderColor: "rgba(0,0,255,0.4)",
                                          label: 'Teplota min/max',
                                          data: yValues2,
                                          labels: xLabelsLong
                                        }</text>
                                    }    
                                }
                                ],
                                labels: xLabelsShort,
                              },
                              options: 
                              {
                              legend: 
                              {
                                  display: true,
                              },
                              tooltips: 
                                {
                                    callbacks: 
                                    {
                                        title:function(tooltipItems, context){
                                            // date at tooltip
                                            return context.datasets[tooltipItems[0].datasetIndex].labels[tooltipItems[0].index]
                                        },
                                        label: function(tooltipItems, data) 
                                        {
                                            @{
                                                if(Model.Item4 != 1)
                                                { 
                                                    <text>
                                                        var text = tooltipItems.datasetIndex === 0 ? 'Průměrná teplota: ' : 'Teplota min/max: '
                                                        return text + tooltipItems.yLabel.toString()+" °C";
                                                    </text>
                                                }
                                                else
                                                {
                                                    <text>return "Teplota: " + tooltipItems.yLabel.toString()+" °C";</text>
                                                }
                                        }
                                        }
                                    }
                                },
                              title: 
                              {
                                display: true,
                                text: "Teplota",
                                fontSize: 16
                              },
                              scales: 
                              {
                                  xAxes: 
                                  [{
                                      ticks: 
                                      {
                                          autoSkip:true,
                                          maxTicksLimit: xMaxTicks,
                                          min: Math.min.apply(this, xValues) - 2,
                                          max: Math.max.apply(this, xValues) + 2
                                      }
                                  }],
                                  yAxes: [{
                                      ticks: 
                                      {
                                          precision: 0,
                                          callback: function(value, index, values) 
                                            {
                                                return  value + " °C";
                                            },
                                      }
                                  }],
                                }
                              }
                            });
                            </script>
                        </div><!--end of column -->
  			        </div><!--end of row -->
                </div>
  	        </div><!--end of graph format -->
    </text>
}}

@{if(Model.Item3.Count == 0||Model.Item3.Contains("TemperatureFeelsLike"))
{
    <text>
<!-- TemperatureFeelsLike -->
            <div id="TemperatureFeelsLike" class="card h-10 overflow-hidden text-black rounded-5 shadow-lg bg-light bg-opacity-50">
                <div class="d-flex flex-column h-100 text-shadow-1">
 
                    <div class="row">    
			            <div class="col-12 text-center">      
                        <canvas id="temperature_feels_like" style="width:100%"></canvas>
                        <script>
                            var yValues = [
                             @foreach (var item in Model.Item5)
                            {
                                @item.TemperatureFeelsLike.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>
                            }
                            ];
                            var yValues2 = [
                            @{
                                if (Model.Item4 != 1)
                                {
                                    int index = 0;
                                    @foreach (var item in Model.Item5)
                                    {
                                        <text>[</text>@Model.Item6.ElementAt(index).TemperatureFeelsLike.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>@Model.Item7.ElementAt(index).TemperatureFeelsLike.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>],</text>
                                        index++;
                                    }
                                }
                            }
                            ];
                            new Chart("temperature_feels_like", 
                            {
                                data: {
                                labels:  xLabelsShort,
                                datasets: [{
                                  type: "line",
                                  fill: false,
                                  pointStyle: 'crossRot',
                                  borderWidth: 1,
                                  lineTension: 0,
                                  backgroundColor: "rgba(0,0,255,1.0)",
                                  borderColor: "rgba(0,0,255,1.0)",
                                  @{
                                        if (Model.Item4 != 1)
                                        {
                                            <text>label: 'Průměrná pocitová teplota', </text>
                                                
                                        } 
                                        else 
                                        {
                                            <text>label: 'Pocitová teplota', </text>
                                        }
                                    }
                                  data: yValues,
                                  labels: xLabelsLong
                                },
                                @{
                                    if(Model.Item4 != 1)
                                    {   
                                <text>{
                                  type: "bar",
                                  fill: false,
                                  lineTension: 0,
                                  backgroundColor: "rgba(0,0,255,0.4)",
                                  borderColor: "rgba(0,0,255,0.4)",
                                  label: 'Pocitová teplota min/max',
                                  data: yValues2,
                                  labels: xLabelsLong
                                }</text>
                                
                            }    
                            }]
                              },
                              options: 
                              {
                              legend: 
                              {
                                  display: true,
                              },
                              tooltips: 
                                {
                                    callbacks: 
                                    {
                                        title:function(tooltipItems, context){
                                            // date at tooltip
                                            return context.datasets[tooltipItems[0].datasetIndex].labels[tooltipItems[0].index]
                                        },
                                        label: function(tooltipItems, data) 
                                        {
                                            return "Pocitová teplota: " + tooltipItems.yLabel.toString()+" °C";
                                            @{
                                                if(Model.Item4 != 1)
                                                { 
                                                    <text>
                                                        var text = tooltipItems.datasetIndex === 0 ? 'Průměrná pocitová teplota: ' : 'Pocitová teplota min/max: '
                                                        return text + tooltipItems.yLabel.toString()+" °C";
                                                    </text>
                                                }
                                                else
                                                {
                                                    <text>return "Pocitová teplota: " + tooltipItems.yLabel.toString()+" °C";</text>
                                                }
                                        }
                                        }
                                    }
                                },
                              title: 
                              {
                                display: true,
                                text: "Pocitová teplota",
                                fontSize: 16
                              },
                              scales: 
                              {
                                  xAxes: 
                                  [{
                                      ticks: 
                                      {
                                          autoSkip:true,
                                          maxTicksLimit: xMaxTicks,
                                          min: Math.min.apply(this, xValues) - 2,
                                          max: Math.max.apply(this, xValues) + 2
                                      }
                                  }],
                                  yAxes: [{
                                      ticks: 
                                      {
                                          precision: 0,
                                          callback: function(value, index, values) 
                                            {
                                                return  value + " °C";
                                            },
                                      }
                                  }],
                                }
                              }
                            });
                            </script>
                        </div><!--end of column -->
  			        </div><!--end of row -->
                </div>
  	        </div><!--end of graph format -->
    </text>
}}

@{if(Model.Item3.Count == 0||Model.Item3.Contains("DewPoint"))
{
    <text>
<!-- DewPoint -->
            <div id="DewPoint" class="card h-10 overflow-hidden text-black rounded-5 shadow-lg bg-light bg-opacity-50">
                <div class="d-flex flex-column h-100 text-shadow-1">
 
                    <div class="row">    
			            <div class="col-12 text-center">      
                        <canvas id="dew_point" style="width:100%"></canvas>
                        <script>
                            var yValues = [
                             @foreach (var item in Model.Item5)
                            {
                                @item.DewPoint.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>
                            }
                            ];
                            var yValues2 = [
                            @{
                                if (Model.Item4 != 1)
                                {
                                    int index = 0;
                                    @foreach (var item in Model.Item5)
                                    {
                                        <text>[</text>@Model.Item6.ElementAt(index).DewPoint.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>@Model.Item7.ElementAt(index).DewPoint.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>],</text>
                                        index++;
                                    }
                                }
                            }
                            ];
                            new Chart("dew_point", 
                            {
                                
                                data: {
                                labels:  xLabelsShort,
                                datasets: [{
                                  type: "line",
                                  fill: false,
                                  pointStyle: 'crossRot',
                                  borderWidth: 1,
                                  lineTension: 0,
                                  backgroundColor: "rgba(0,0,255,1.0)",
                                  borderColor: "rgba(0,0,255,1.0)",
                                  @{
                                        if (Model.Item4 != 1)
                                        {
                                            <text>label: 'Průměrná teplota Rosného bodu', </text>
                                                
                                        } 
                                        else 
                                        {
                                            <text>label: 'Rosný bod', </text>
                                        }
                                    }
                                  data: yValues,
                                  labels: xLabelsLong
                                },
                                @{
                                    if(Model.Item4 != 1)
                                    {   
                                <text>{
                                  type: "bar",
                                  fill: false,
                                  lineTension: 0,
                                  backgroundColor: "rgba(0,0,255,0.4)",
                                  borderColor: "rgba(0,0,255,0.4)",
                                  label: 'Rosný bod min/max',
                                  data: yValues2,
                                  labels: xLabelsLong
                                }</text>
                                
                            }    
                            }]
                              },
                              options: 
                              {
                              legend: 
                              {
                                  display: true,
                              },
                              tooltips: 
                                {
                                    callbacks: 
                                    {
                                        title:function(tooltipItems, context){
                                            // date at tooltip
                                            return context.datasets[tooltipItems[0].datasetIndex].labels[tooltipItems[0].index]
                                        },
                                        label: function(tooltipItems, data) 
                                        {
                                            @{
                                                if(Model.Item4 != 1)
                                                { 
                                                    <text>
                                                        var text = tooltipItems.datasetIndex === 0 ? 'Průměrná rosného bodu: ' : 'Rosný bod min/max: '
                                                        return text + tooltipItems.yLabel.toString()+" °C";
                                                    </text>
                                                }
                                                else
                                                {
                                                    <text>return "Rosný bod: " + tooltipItems.yLabel.toString()+" °C";</text>
                                                }
                                        }

                                        }
                                    }
                                },
                              title: 
                              {
                                display: true,
                                text: "Rosný bod",
                                fontSize: 16
                              },
                              scales: 
                              {
                                  xAxes: 
                                  [{
                                      ticks: 
                                      {
                                          autoSkip:true,
                                          maxTicksLimit: xMaxTicks,
                                          min: Math.min.apply(this, xValues) - 2,
                                          max: Math.max.apply(this, xValues) + 2
                                      }
                                  }],
                                  yAxes: [{
                                      ticks: 
                                      {
                                          precision: 0,
                                          callback: function(value, index, values) 
                                            {
                                                return  value + " °C";
                                            },
                                      }
                                  }],
                                }
                              }
                            });
                            </script>
                        </div><!--end of column -->
  			        </div><!--end of row -->
                </div>
  	        </div><!--end of graph format -->
    </text>
}}

@{if(Model.Item3.Count == 0||Model.Item3.Contains("TemperatureAndTemperstureFeelsLike"))
{
    <text>
<!-- TemperatureAndTemperstureFeelsLike -->
            <div id="TemperatureAndTemperstureFeelsLike" class="card h-10 overflow-hidden text-black rounded-5 shadow-lg bg-light bg-opacity-50">
                <div class="d-flex flex-column h-100 text-shadow-1">
                    <div class="row">    
			            <div class="col-12 text-center">      

                        <canvas id="temperatureAndTemperstureFeelsLike" style="width:100%"></canvas>
                       
                        <script>
                            var yValues = [
                             @foreach (var item in Model.Item5)
                            {
                                @item.Temperature.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>
                            }
                            ];
                            var yValues2 = [
                             @foreach (var item in Model.Item5)
                            {
                                @item.TemperatureFeelsLike.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>
                            }
                            ];
                            
                            new Chart("temperatureAndTemperstureFeelsLike", 
                            { 
                                data: {
                                datasets: [
                                    {
                                  type: "line",
                                  fill: false,
                                  pointStyle: 'crossRot',
                                  borderWidth: 1,
                                  lineTension: 0,
                                  radius: 5,
                                  backgroundColor: "rgba(255,0,0,1.0)",
                                  borderColor: "rgba(255,0,0,1.0)",
                                  label: 'Teplota',
                                  data: yValues,
                                  labels: xLabelsLong
                                },{
                                  type: "line",
                                  fill: false,
                                  pointStyle: 'crossRot',
                                  borderWidth: 1,
                                  lineTension: 0,
                                  radius: 5,
                                  backgroundColor: "rgba(0,0,255,1.0)",
                                  borderColor: "rgba(0,0,255,1.0)",
                                  label: 'Pocitová teplota',
                                  data: yValues2,
                                  labels: xLabelsLong
                                }
                                ],
                                labels:  xLabelsShort,
                              },
                              options: 
                              {
                              legend: 
                              {
                                  display: true,
                              },
                              tooltips: 
                                {
                                    callbacks: 
                                    {
                                        title:function(tooltipItems, context){
                                            // date at tooltip
                                            return context.datasets[tooltipItems[0].datasetIndex].labels[tooltipItems[0].index]
                                        },
                                        label: function(tooltipItems, data) 
                                        {
                                            var text = tooltipItems.datasetIndex === 0 ? 'Teplota: ' : 'Pocitová teplota: '
                                            return text + tooltipItems.yLabel.toString()+" °C";
                                        }
                                    }
                                },
                              title: 
                              {
                                display: true,
                                text: "Teplota a pocitová teplota",
                                fontSize: 16
                              },
                              scales: 
                              {
                                  xAxes: 
                                  [{
                                      ticks: 
                                      {
                                          autoSkip:true,
                                          maxTicksLimit: xMaxTicks,
                                          min: Math.min.apply(this, xValues) - 2,
                                          max: Math.max.apply(this, xValues) + 2
                                      }
                                  }],
                                  yAxes: [{
                                      ticks: 
                                      {
                                          precision:0,
                                          callback: function(value, index, values) 
                                            {
                                                return  value + " °C";
                                            },
                                      }
                                  }],
                                }
                              }
                            });
                            </script>
                        </div><!--end of column -->
  			        </div><!--end of row -->
                </div>
  	        </div><!--end of graph format -->
    </text>
}}

@{if(Model.Item3.Count == 0||Model.Item3.Contains("Humidity"))
{
    <text>
<!-- Humidity -->
            <div id="Humidity" class="card h-10 overflow-hidden text-black rounded-5 shadow-lg bg-light bg-opacity-50">
                <div class="d-flex flex-column h-100 text-shadow-1">
 
                    <div class="row">    
			            <div class="col-12 text-center">      
                        <canvas id="humidity" style="width:100%"></canvas>
                        <script>
                            var yValues = [
                             @foreach (var item in Model.Item5)
                            {
                                @item.Humidity.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>
                            }
                            ];
                            var yValues2 = [
                            @{
                                if (Model.Item4 != 1)
                                {
                                    int index = 0;
                                    @foreach (var item in Model.Item5)
                                    {
                                        <text>[</text>@Model.Item6.ElementAt(index).Humidity.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>@Model.Item7.ElementAt(index).Humidity.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>],</text>
                                        index++;
                                    }
                                }
                            }
                            ];
                            new Chart("humidity", 
                            {
                                
                                data: {
                                labels:  xLabelsShort,
                                datasets: [{
                                  type: "line",
                                  fill: false,
                                  pointStyle: 'crossRot',
                                  borderWidth: 1,
                                  lineTension: 0,
                                  backgroundColor: "rgba(0,0,255,1.0)",
                                  borderColor: "rgba(0,0,255,1.0)",
                                  @{
                                    if (Model.Item4 != 1)
                                    {
                                        <text>label: 'Průměrná vlhkost', </text>
                                                
                                    } 
                                    else 
                                    {
                                        <text>label: 'Vlhkost', </text>
                                    }
                                }
                                  data: yValues,
                                  labels: xLabelsLong
                                },
                                @{
                                    if(Model.Item4 != 1)
                                    {   
                                <text>{
                                  type: "bar",
                                  fill: false,
                                  lineTension: 0,
                                  backgroundColor: "rgba(0,0,255,0.4)",
                                  borderColor: "rgba(0,0,255,0.4)",
                                  label: 'Vlhkost min/max',
                                  data: yValues2,
                                  labels: xLabelsLong
                                }</text>
                                
                            }    
                            }]
                              },
                              options: 
                              {
                              legend: 
                              {
                                  display: true,
                              },
                              tooltips: 
                                {
                                    callbacks: 
                                    {
                                        title:function(tooltipItems, context){
                                            // date at tooltip
                                            return context.datasets[tooltipItems[0].datasetIndex].labels[tooltipItems[0].index]
                                        },
                                        label: function(tooltipItems, data) 
                                        {
                                            @{
                                                if(Model.Item4 != 1)
                                                { 
                                                    <text>
                                                        var text = tooltipItems.datasetIndex === 0 ? 'Průměrná vlhkost: ' : 'Vlhkost min/max: '
                                                        return text + tooltipItems.yLabel.toString()+" %";
                                                    </text>
                                                }
                                                else
                                                {
                                                    <text>return "Vlhkost: " + tooltipItems.yLabel.toString()+" %";</text>
                                                }
                                        }
                                        }
                                    }
                                },
                              title: 
                              {
                                display: true,
                                text: "Vzdušná vlhkost",
                                fontSize: 16
                              },
                              scales: 
                              {
                                  xAxes: 
                                  [{
                                      ticks: 
                                      {
                                          autoSkip:true,
                                          maxTicksLimit: xMaxTicks,
                                          min: Math.min.apply(this, xValues) - 2,
                                          max: Math.max.apply(this, xValues) + 2
                                      }
                                  }],
                                  yAxes: [{
                                      ticks: 
                                      {
                                          min: 0,
                                          max: 100,
                                          precision:0,
                                          callback: function(value, index, values) 
                                            {
                                                return  value + " %";
                                            },
                                      }
                                  }],
                                }
                              }
                            });
                            </script>
                        </div><!--end of column -->
  			        </div><!--end of row -->
                </div>
  	        </div><!--end of graph format -->
    </text>
}}

@{if(Model.Item3.Count == 0||Model.Item3.Contains("TemperatureAndHumidity"))
{
    <text>
<!-- TemperatureAndHumidity -->
            <div id="TemperatureAndHumidity" class="card h-10 overflow-hidden text-black rounded-5 shadow-lg bg-light bg-opacity-50">
                <div class="d-flex flex-column h-100 text-shadow-1">
 
                    <div class="row">    
			            <div class="col-12 text-center">      
                        <canvas id="temperatureAndHumidity" style="width:100%"></canvas>
                        <script>
                            var yValues = [
                             @foreach (var item in Model.Item5)
                            {
                                @item.Temperature.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>
                            }
                            ];
                            var yValues2 = [
                             @foreach (var item in Model.Item5)
                            {
                                @item.Humidity.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>
                            }
                            ];
                            new Chart("temperatureAndHumidity", 
                            {
                                data: {
                                labels:  xLabelsShort,
                                datasets: [{
                                  type: "line",
                                  fill: false,
                                  yAxisID: 'A',
                                  pointStyle: 'crossRot',
                                  borderWidth: 1,
                                  lineTension: 0,
                                  backgroundColor: "rgba(0,0,255,1.0)",
                                  borderColor: "rgba(0,0,255,1.0)",
                                  @{
                                    if (Model.Item4 != 1)
                                    {
                                        <text>label: 'Průměrná teplota', </text>
                                                
                                    } 
                                    else 
                                    {
                                        <text>label: 'Teplota', </text>
                                    }
                                }
                                  data: yValues,
                                  labels: xLabelsLong
                                },{
                                  type: "line",
                                  fill: false,
                                  yAxisID: 'B',
                                  pointStyle: 'crossRot',
                                  borderWidth: 1,
                                  lineTension: 0,
                                  backgroundColor: "rgba(0,255,255,1.0)",
                                  borderColor: "rgba(0,255,255,1.0)",
                                  @{
                                    if (Model.Item4 != 1)
                                    {
                                        <text>label: 'Průměrná vlhkost', </text>
                                                
                                    } 
                                    else 
                                    {
                                        <text>label: 'Vlhkost', </text>
                                    }
                                }
                                  data: yValues2,
                                  labels: xLabelsLong
                                }]
                              },
                              options: 
                              {
                              legend: 
                              {
                                  display: true,
                              },
                              tooltips: 
                                {
                                    callbacks: 
                                    {
                                        title:function(tooltipItems, context){
                                            // date at tooltip
                                            return context.datasets[tooltipItems[0].datasetIndex].labels[tooltipItems[0].index]
                                        },
                                        label: function(tooltipItems, data) 
                                        {
                                            if(tooltipItems.datasetIndex === 0)
                                            {
                                                var text = data.datasets[tooltipItems.datasetIndex].label + ": "
                                            return text + tooltipItems.yLabel.toString()+" °C";
                                            }
                                            else
                                            {
                                                var text = data.datasets[tooltipItems.datasetIndex].label + ": "
                                            return text + tooltipItems.yLabel.toString()+" %";
                                            }
                                        }
                                    }
                                },
                              title: 
                              {
                                display: true,
                                text: "Teplota a vzdušná vlhkost",
                                fontSize: 16
                              },
                              scales: 
                              {
                                  xAxes: 
                                  [{
                                      ticks: 
                                      {
                                          autoSkip:true,
                                          maxTicksLimit: xMaxTicks,
                                          min: Math.min.apply(this, xValues) - 2,
                                          max: Math.max.apply(this, xValues) + 2
                                      }
                                  }],
                                  yAxes: [
                                      {
                                        id: 'A',
                                        type: 'linear',
                                        position: 'left',
                                      ticks: 
                                      {
                                          precision:0,
                                          callback: function(value, index, values) 
                                            {
                                                return  value + " °C";
                                            }
                                      }
                                      },
                                      {
                                        id: 'B',
                                        type: 'linear',
                                        position: 'right',
                                      ticks: 
                                      {
                                          min: 0,
                                          max: 100,
                                          precision:0,
                                          callback: function(value, index, values) 
                                            {
                                                return  value + " %";
                                            }
                                      }
                                  }],
                                }
                              }
                            });
                            </script>
                        </div><!--end of column -->
  			        </div><!--end of row -->
                </div>
  	        </div><!--end of graph format -->
    </text>
}}

@{if(Model.Item3.Count == 0||Model.Item3.Contains("Pressure"))
{
    <text>
<!-- Pressure -->
            <div id="Pressure" class="card h-10 overflow-hidden text-black rounded-5 shadow-lg bg-light bg-opacity-50">
                <div class="d-flex flex-column h-100 text-shadow-1">
 
                    <div class="row">    
			            <div class="col-12 text-center">      
                        <canvas id="pressure" style="width:100%"></canvas>
                        <script>
                            var yValues = [
                             @foreach (var item in Model.Item5)
                            {
                                @item.Pressure.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>
                            }
                            ];
                            var yValues2 = [
                            @{
                                if (Model.Item4 != 1)
                                {
                                    int index = 0;
                                    @foreach (var item in Model.Item5)
                                    {
                                        <text>[</text>@Model.Item6.ElementAt(index).Pressure.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>@Model.Item7.ElementAt(index).Pressure.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>],</text>
                                        index++;
                                    }
                                }
                            }
                            ];
                            new Chart("pressure", 
                            {
                                
                                data: {
                                labels:  xLabelsShort,
                                datasets: [{
                                  type: "line",
                                  fill: false,
                                  pointStyle: 'crossRot',
                                  borderWidth: 1,
                                  lineTension: 0,
                                  backgroundColor: "rgba(0,0,255,1.0)",
                                  borderColor: "rgba(0,0,255,1.0)",
                                  @{
                                        if (Model.Item4 != 1)
                                        {
                                            <text>label: 'Průměrný absolutní tlak', </text>
                                                
                                        } 
                                        else 
                                        {
                                            <text>label: 'Absolutní tlak', </text>
                                        }
                                    }
                                  data: yValues,
                                  labels: xLabelsLong
                                },
                                @{
                                    if(Model.Item4 != 1)
                                    {   
                                        <text>{
                                          type: "bar",
                                          fill: false,
                                          lineTension: 0,
                                          backgroundColor: "rgba(0,0,255,0.4)",
                                          borderColor: "rgba(0,0,255,0.4)",
                                          label: 'Absolutní tlak min/max',
                                          data: yValues2,
                                          labels: xLabelsLong
                                        }</text>
                                
                                    }    
                                }]
                              },
                              options: 
                              {
                              legend: 
                              {
                                  display: true,
                              },
                              tooltips: 
                                {
                                    callbacks: 
                                    {
                                        title:function(tooltipItems, context){
                                            // date at tooltip
                                            return context.datasets[tooltipItems[0].datasetIndex].labels[tooltipItems[0].index]
                                        },
                                        label: function(tooltipItems, data) 
                                        {
                                            @{
                                                if(Model.Item4 != 1)
                                                { 
                                                    <text>
                                                        var text = tooltipItems.datasetIndex === 0 ? 'Průměrný absolutní tlak: ' : 'Absolutní tlak min/max: '
                                                        return text + tooltipItems.yLabel.toString()+" hPa";
                                                    </text>
                                                }
                                                else
                                                {
                                                    <text>return "Absolutní tlak: " + tooltipItems.yLabel.toString()+" hPa";</text>
                                                }
                                        }
                                        }
                                    }
                                },
                              title: 
                              {
                                display: true,
                                text: "Absolutní tlak",
                                fontSize: 16
                              },
                              scales: 
                              {
                                  xAxes: 
                                  [{
                                      ticks: 
                                      {
                                          autoSkip:true,
                                          maxTicksLimit: xMaxTicks,
                                          min: Math.min.apply(this, xValues) - 2,
                                          max: Math.max.apply(this, xValues) + 2
                                      }
                                  }],
                                  yAxes: [{
                                      ticks: 
                                      {
                                          precision: 0,
                                          callback: function(value, index, values) 
                                            {
                                                return  value + " hPa";
                                            },
                                      }
                                  }],
                                }
                              }
                            });
                            </script>
                        </div><!--end of column -->
  			        </div><!--end of row -->
                </div>
  	        </div><!--end of graph format -->
    </text>
}}

@{if(Model.Item3.Count == 0||Model.Item3.Contains("SeaLevelPressure"))
{
    <text>
<!-- SeaLevelPressure -->
            <div id="SeaLevelPressure" class="card h-10 overflow-hidden text-black rounded-5 shadow-lg bg-light bg-opacity-50">
                <div class="d-flex flex-column h-100 text-shadow-1">
                    <div class="row">    
			            <div class="col-12 text-center">      
                        <canvas id="pressure_at_sea_level" style="width:100%"></canvas>
                        <script>
                            var yValues = [
                             @foreach (var item in Model.Item5)
                            {
                                @item.SeaLevelPressure.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>
                            }
                            ];
                            var yValues2 = [
                            @{
                                if (Model.Item4 != 1)
                                {
                                    int index = 0;
                                    @foreach (var item in Model.Item5)
                                    {
                                        <text>[</text>@Model.Item6.ElementAt(index).SeaLevelPressure.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>@Model.Item7.ElementAt(index).SeaLevelPressure.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>],</text>
                                        index++;
                                    }
                                }
                            }
                            ];
                            new Chart("pressure_at_sea_level", 
                            {
                                
                                data: {
                                labels:  xLabelsShort,
                                datasets: [{
                                  type: "line",
                                  fill: false,
                                  pointStyle: 'crossRot',
                                  borderWidth: 1,
                                  lineTension: 0,
                                  backgroundColor: "rgba(0,0,255,1.0)",
                                  borderColor: "rgba(0,0,255,1.0)",
                                  label: 'Tlak přepočtený na hladinu moře',
                                  @{
                                        if (Model.Item4 != 1)
                                        {
                                            <text>label: 'Průměrný tlak přepočtený na hladinu moře', </text>
                                                
                                        } 
                                        else 
                                        {
                                            <text>label: 'Tlak přepočtený na hladinu moře', </text>
                                        }
                                    }
                                  data: yValues,
                                  labels: xLabelsLong
                                },
                                @{
                                    if(Model.Item4 != 1)
                                    {   
                                <text>{
                                  type: "bar",
                                  fill: false,
                                  lineTension: 0,
                                  backgroundColor: "rgba(0,0,255,0.4)",
                                  borderColor: "rgba(0,0,255,0.4)",
                                  label: 'Tlak přepočtený na hladinu moře min/max',
                                  data: yValues2,
                                  labels: xLabelsLong
                                }</text>
                                
                            }    
                            }]
                              },
                              options: 
                              {
                              legend: 
                              {
                                  display: true,
                              },
                              tooltips: 
                                {
                                    callbacks: 
                                    {
                                        title:function(tooltipItems, context){
                                            // date at tooltip
                                            return context.datasets[tooltipItems[0].datasetIndex].labels[tooltipItems[0].index]
                                        },
                                        label: function(tooltipItems, data) 
                                        {

                                            @{
                                                if(Model.Item4 != 1)
                                                { 
                                                    <text>
                                                        var text = tooltipItems.datasetIndex === 0 ? 'Průměrný tlak přepočtený na hladinu moře: ' : 'Tlak přepočtený na hladinu moře min/max: '
                                                        return text + tooltipItems.yLabel.toString()+" hPa";
                                                    </text>
                                                }
                                                else
                                                {
                                                    <text>return "Tlak přepočtený na hladinu moře: " + tooltipItems.yLabel.toString()+" hPa";</text>
                                                }
                                        }
                                        }
                                    }
                                },
                              title: 
                              {
                                display: true,
                                text: "Tlak přepočtený na hladinu moře",
                                fontSize: 16
                              },
                              scales: 
                              {
                                  xAxes: 
                                  [{
                                      ticks: 
                                      {
                                          autoSkip:true,
                                          maxTicksLimit: xMaxTicks,
                                          min: Math.min.apply(this, xValues) - 2,
                                          max: Math.max.apply(this, xValues) + 2
                                      }
                                  }],
                                  yAxes: [{
                                      ticks: 
                                      {
                                          precision: 0,
                                          callback: function(value, index, values) 
                                            {
                                                return  value + " hPa";
                                            },
                                      }
                                  }],
                                }
                              }
                            });
                            </script>
                        </div><!--end of column -->
  			        </div><!--end of row -->
                </div>
  	        </div><!--end of graph format -->
    </text>
}}

@{if(Model.Item3.Count == 0||Model.Item3.Contains("WindSpeed"))
{
    <text>
<!-- WindSpeed -->
            <div id="WindSpeed" class="card h-10 overflow-hidden text-black rounded-5 shadow-lg bg-light bg-opacity-50">
                <div class="d-flex flex-column h-100 text-shadow-1">
 
                    <div class="row">    
			            <div class="col-12 text-center">      
                        <canvas id="wind" style="width:100%"></canvas>
                        <script>
                            var yValues = [
                             @foreach (var item in Model.Item5)
                            {
                                @item.WindSpeed.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>
                            }
                            ];
                            var yValues2 = [
                            @{
                                if (Model.Item4 != 1)
                                {
                                    int index = 0;
                                    @foreach (var item in Model.Item5)
                                    {
                                        <text>[</text>@Model.Item6.ElementAt(index).WindSpeed.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>@Model.Item7.ElementAt(index).WindSpeed.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>],</text>
                                        index++;
                                    }
                                }
                            }
                            ];
                            var angle = [
                             @foreach (var item in Model.Item5)
                            {
                                @item.WindAngle.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>
                            }
                            ];
                            const arrow = new Image();
                            arrow.src = "@Url.Action("", "", null, "http")img/arrow.png";                          
                            new Chart("wind", 
                           {
                                type: "line",
                                data: {
                                labels:  xLabelsShort,
                                datasets: [{
                                  fill: false,
                                  pointStyle:arrow,
                                  borderWidth: 1,
                                  lineTension: 0,
                                  rotation:angle,
                                  backgroundColor: "rgba(0,0,255,1.0)",
                                  borderColor: "rgba(0,0,255,1.0)",
                                  @{
                                        if (Model.Item4 != 1)
                                        {
                                            <text>label: 'Průměrná rychlost větru', </text>
                                                
                                        } 
                                        else 
                                        {
                                            <text>label: 'Rychlost větru', </text>
                                        }
                                    }
                                  data: yValues,
                                  labels: xLabelsLong
                                },
                                @{
                                    if(Model.Item4 != 1)
                                    {   
                                <text>{
                                  type: "bar",
                                  fill: false,
                                  lineTension: 0,
                                  backgroundColor: "rgba(0,0,255,0.4)",
                                  borderColor: "rgba(0,0,255,0.4)",
                                  label: 'Rychlost větru min/max',
                                  data: yValues2,
                                  labels: xLabelsLong
                                }</text>
                            }    
                            }]
                              },
                              options: 
                              {
                              legend: 
                              {
                                  display: true,
                              },
                              tooltips: 
                                {
                                    callbacks: 
                                    {
                                        title:function(tooltipItems, context){
                                            // date at tooltip
                                            return context.datasets[tooltipItems[0].datasetIndex].labels[tooltipItems[0].index]
                                        },
                                        label: function(tooltipItems, data) 
                                        {
                                            
                                            @{
                                                if(Model.Item4 != 1)
                                                { 
                                                    <text>
                                                        if(tooltipItems.datasetIndex === 0)
                                                        {var text = "Průměrná rychlost větru: " + tooltipItems.yLabel.toString() + " km/h Směr:" + data.datasets[tooltipItems.datasetIndex].rotation[tooltipItems.index] + "°"}
                                                        else
                                                        {var text = "Rychlost větru min/max: " + tooltipItems.yLabel.toString()+" km/h"}

                                                        return text;
                                                    </text>
                                                }
                                                else
                                                {
                                                    <text>return "Rychlost: větru" + tooltipItems.yLabel.toString()+" km/h Směr:" + data.datasets[tooltipItems.datasetIndex].rotation[tooltipItems.index] + "°";</text>
                                                }
                                        }
                                        }
                                    }
                                },
                              title: 
                              {
                                display: true,
                                text: "Rychlost a směr větru (0° = Sever, 90° = Východ,  180° = Jih, 270° = Západ)",
                                fontSize: 16
                              },
                              scales: 
                              {
                                  xAxes: 
                                  [{
                                      ticks: 
                                      {
                                          autoSkip:true,
                                          maxTicksLimit: xMaxTicks,
                                          min: Math.min.apply(this, xValues) - 2,
                                          max: Math.max.apply(this, xValues) + 2
                                      }
                                  }],
                                  yAxes: [{
                                      ticks: 
                                      {
                                          precision:2,
                                          callback: function(value, index, values) 
                                            {
                                                return  value + " km/h";
                                            },
                                      }
                                  }],
                                }
                              }
                            });
                            </script>
                        </div><!--end of column -->
  			        </div><!--end of row -->
                </div>
  	        </div><!--end of graph format -->
    </text>
}}

@{if(Model.Item3.Count == 0||Model.Item3.Contains("RainAmount"))
{
    <text>
<!-- RainAmount -->
            <div id="RainAmount" class="card h-10 overflow-hidden text-black rounded-5 shadow-lg bg-light bg-opacity-50">
                <div class="d-flex flex-column h-100 text-shadow-1">
 
                    <div class="row">    
			            <div class="col-12 text-center">      
                        <canvas id="rain_amount" style="width:100%"></canvas>
                        <script>
                            var yValues = [
                             @foreach (var item in Model.Item5)
                            {
                                @item.RainAmount.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>
                            }];
                            var yValues2 = [
                                @{
                                    float rainSum = 0;

                                    foreach (var item in Model.Item5)
                                    {
                                        rainSum += item.RainAmount;
                                        @rainSum.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>
                                    }
                                }
                            ];
                            new Chart("rain_amount", 
                            {
                                data: {
                                labels: xLabelsShort,
                                datasets: [{
                                  type: "bar",
                                  fill: false,
                                  lineTension: 0,
                                  backgroundColor: "rgba(0,0,255,1.0",
                                  borderColor: "rgba(0,0,255,1.0",
                                  label: 'Srážky',
                                  data: yValues,
                                  labels: xLabelsLong
                                },{
                                  type: "line",
                                  fill: true,
                                  pointStyle: 'crossRot',
                                  borderWidth: 1,
                                  lineTension: 0,
                                  backgroundColor: "rgba(0,0,255,0.2)",
                                  borderColor: "rgba(0,0,255,1.0)",
                                  label: 'Úhrn srážek',
                                  data: yValues2,
                                  labels: xLabelsLong
                                }
                                ]
                              },
                              options: 
                              {
                              legend: 
                              {
                                  display: true,
                              },
                              tooltips: 
                                {
                                    callbacks: 
                                    {
                                        title:function(tooltipItems, context){
                                            // date at tooltip
                                            return context.datasets[tooltipItems[0].datasetIndex].labels[tooltipItems[0].index]
                                        },
                                        label: function(tooltipItems, data) 
                                        {
                                            var text = tooltipItems.datasetIndex === 0 ? 'Srážky: ' : 'Úhrn srážek: '
                                            return text + tooltipItems.yLabel.toString()+" mm";
                                        }
                                    }
                                },
                              title: 
                              {
                                display: true,
                                text: "Srážky",
                                fontSize: 16
                              },
                              scales: 
                              {
                                  xAxes: 
                                  [{
                                      ticks: 
                                      {
                                          autoSkip:true,
                                          maxTicksLimit: xMaxTicks,
                                          min: Math.min.apply(this, xValues) - 2,
                                          max: Math.max.apply(this, xValues) + 2
                                      }
                                  }],
                                  yAxes: [{
                                      ticks: 
                                      {
                                          min: 0,
                                          precision:0,
                                          callback: function(value, index, values) 
                                            {
                                                return  value + " mm";
                                            }
                                      },
                                  }],
                                }
                              }
                            });
                            </script>
                        </div><!--end of column -->
  			        </div><!--end of row -->
                </div>
  	        </div><!--end of graph format -->
    </text>
}}

@{if(Model.Item3.Count == 0||Model.Item3.Contains("UvIndex"))
{
    <text>
<!-- UvIndex -->
            <div id="UvIndex" class="card h-10 overflow-hidden text-black rounded-5 shadow-lg bg-light bg-opacity-50">
                <div class="d-flex flex-column h-100 text-shadow-1">
                    <div class="row">    
			            <div class="col-12 text-center">      
                        <canvas id="uv_index" style="width:100%"></canvas>
                        <script>
                            var yValues = [
                             @foreach (var item in Model.Item5)
                            {
                                @item.UvIndex.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>
                            }
                            ];
                            var yValues2 = [
                            @{
                                if (Model.Item4 != 1)
                                {
                                    int index = 0;
                                    @foreach (var item in Model.Item5)
                                    {
                                        <text>[</text>@Model.Item6.ElementAt(index).UvIndex.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>@Model.Item7.ElementAt(index).UvIndex.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>],</text>
                                        index++;
                                    }
                                }
                            }
                            ];
                            new Chart("uv_index", 
                            {
                               
                                data: {
                                labels: xLabelsShort,
                                datasets: [{ 
                                  type: "line",
                                  fill: false,
                                  pointStyle:'crossRot',
                                  borderWidth: 1,
                                  lineTension: 0,
                                  backgroundColor: "rgba(0,0,255,1.0)",
                                  borderColor: "rgba(0,0,255,1.0)",
                                  label: 'UV index',
                                  @{
                                        if (Model.Item4 != 1)
                                        {
                                            <text>label: 'Průměrný UV index', </text>
                                                
                                        } 
                                        else 
                                        {
                                            <text>label: 'UV index', </text>
                                        }
                                    }
                                  data: yValues,
                                  labels: xLabelsLong
                                },
                                @{
                                    if(Model.Item4 != 1)
                                    {   
                                <text>{
                                  type: "bar",
                                  fill: false,
                                  lineTension: 0,
                                  backgroundColor: "rgba(0,0,255,0.4)",
                                  borderColor: "rgba(0,0,255,0.4)",
                                  label: 'UV index min/max',
                                  data: yValues2,
                                  labels: xLabelsLong
                                }</text>
                                
                            }    
                            }]
                              },
                              options: 
                              {
                              legend: 
                              {
                                  display: true,
                              },
                              tooltips: 
                                {
                                    callbacks: 
                                    {
                                        title:function(tooltipItems, context){
                                            // date at tooltip
                                            return context.datasets[tooltipItems[0].datasetIndex].labels[tooltipItems[0].index]
                                        },
                                        label: function(tooltipItems, data) 
                                        {
                                            @{
                                                if(Model.Item4 != 1)
                                                { 
                                                    <text>
                                                        var text = tooltipItems.datasetIndex === 0 ? 'Průměrný UV index: ' : 'UV index min/max: '
                                                        return text + tooltipItems.yLabel.toString();
                                                    </text>
                                                }
                                                else
                                                {
                                                    <text>return "UV index: " + tooltipItems.yLabel.toString();</text>
                                                }
                                            }
                                        }
                                    }
                                },
                              title: 
                              {
                                display: true,
                                text: "UV index",
                                fontSize: 16
                              },
                              scales: 
                              {
                                  xAxes: 
                                  [{
                                      ticks: 
                                      {
                                          autoSkip:true,
                                          maxTicksLimit: xMaxTicks,
                                          min: Math.min.apply(this, xValues) - 2,
                                          max: Math.max.apply(this, xValues) + 2
                                      }
                                  }],
                                  yAxes: [{
                                      ticks: 
                                      {
                                          min: 0,
                                          max: 12,
                                          maxTicksLimit: 15,
                                          callback: function(value, index, values) 
                                            {
                                                return value;
                                            },
                                      }
                                  }],
                                }
                              }
                            });
                            </script>
                        </div><!--end of column -->
  			        </div><!--end of row -->
                </div>
  	        </div><!--end of graph format -->
    </text>
}}

@{if(Model.Item3.Count == 0||Model.Item3.Contains("SoilTemp"))
{
    <text>
<!-- SoilTemp -->
            <div id="SoilTemp" class="card h-10 overflow-hidden text-black rounded-5 shadow-lg bg-light bg-opacity-50">
                <div class="d-flex flex-column h-100 text-shadow-1">
                    <div class="row">    
			            <div class="col-12 text-center">      
                        <canvas id="soil_temp" style="width:100%"></canvas>
                        <script>
                            var yValues1 = [
                             @foreach (var item in Model.Item5)
                            {
                                @item.SoilTemp1.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>
                            }
                            ];
                            var yValues2 = [
                             @foreach (var item in Model.Item5)
                            {
                                @item.SoilTemp2.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>
                            }
                            ];
                            var yValues3 = [
                             @foreach (var item in Model.Item5)
                            {
                                @item.SoilTemp3.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>
                            }
                            ];
                            var yValues4 = [
                            @{
                                if (Model.Item4 != 1)
                                {
                                    int index = 0;
                                    @foreach (var item in Model.Item5)
                                    {
                                        <text>[</text>@Model.Item6.ElementAt(index).SoilTemp1.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>@Model.Item7.ElementAt(index).SoilTemp1.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>],</text>
                                        index++;
                                    }
                                }
                            }
                            ];
                            var yValues5 = [
                            @{
                                if (Model.Item4 != 1)
                                {
                                    int index = 0;
                                    @foreach (var item in Model.Item5)
                                    {
                                        <text>[</text>@Model.Item6.ElementAt(index).SoilTemp2.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>@Model.Item7.ElementAt(index).SoilTemp2.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>],</text>
                                        index++;
                                    }
                                }
                            }
                            ];
                            var yValues6 = [
                            @{
                                if (Model.Item4 != 1)
                                {
                                    int index = 0;
                                    @foreach (var item in Model.Item5)
                                    {
                                        <text>[</text>@Model.Item6.ElementAt(index).SoilTemp3.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>@Model.Item7.ElementAt(index).SoilTemp3.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>],</text>
                                        index++;
                                    }
                                }
                            }
                            ];
                            
                            @{
                                Measurement itema = new Measurement();
                                foreach (var item in Model.Item5)
                                {
                                    itema = item;
                                }
                                <text>var ylabel1= '</text>@itema.SoilTempDepth1<text>';</text>

                                <text>var ylabel2= '</text>@itema.SoilTempDepth2<text>';</text>

                                <text>var ylabel3= '</text>@itema.SoilTempDepth3<text>';</text>
                            }

                            new Chart("soil_temp", 
                            {
                                
                                data: {
                                labels: xLabelsShort,
                                datasets: [{
                                    type: "line",
                                  fill: false,
                                  pointStyle:'crossRot',
                                  borderWidth: 1,
                                  lineTension: 0,
                                  backgroundColor: "rgba(255,0,0,1.0)",
                                  borderColor: "rgba(255,0,0,1.0)",
                                  data: yValues1,
                                  label:
                                  @{
                                    if(Model.Item4 != 1)
                                    {
                                        <text>'Průměrná teplota půdy v '+ ylabel1,</text>
                                    }
                                    else
                                    {
                                        <text>'Teplota půdy v '+ ylabel1,</text>
                                    }
                                  }
                                  labels: xLabelsLong
                                },
                                {
                                    type: "line",
                                  fill: false,
                                  pointStyle:'crossRot',
                                  borderWidth: 1,
                                  lineTension: 0,
                                  backgroundColor: "rgba(0,255,0,1.0)",
                                  borderColor: "rgba(0,255,0,1.0)",
                                  data: yValues2,
                                  label:
                                  @{
                                    if(Model.Item4 != 1)
                                    {
                                        <text>'Průměrná teplota půdy v '+ ylabel2,</text>
                                    }
                                    else
                                    {
                                        <text>'Teplota půdy v '+ ylabel2,</text>
                                    }
                                  }
                                  labels: xLabelsLong
                                },
                                {
                                    type: "line",
                                  fill: false,
                                  pointStyle:'crossRot',
                                  borderWidth: 1,
                                  lineTension: 0,
                                  backgroundColor: "rgba(0,0,255,1.0)",
                                  borderColor: "rgba(0,0,255,1.0)",
                                  data: yValues3,
                                  label:
                                  @{
                                    if(Model.Item4 != 1)
                                    {
                                        <text>'Průměrná teplota půdy v '+ ylabel3,</text>
                                    }
                                    else
                                    {
                                        <text>'Teplota půdy v '+ ylabel3,</text>
                                    }
                                  }
                                  labels: xLabelsLong
                                },
                                @{
                                    if(Model.Item4 != 1)
                                    {   
                                <text>{
                                  type: "bar",
                                  fill: false,
                                  lineTension: 0,
                                  backgroundColor: "rgba(255,0,0,0.4)",
                                  borderColor: "rgba(255,0,0,0.4)",
                                  label: 'Teplota půdy min/max ' + ylabel1,
                                  data: yValues4,
                                  labels: xLabelsLong
                                },
                                {
                                  type: "bar",
                                  fill: false,
                                  lineTension: 0,
                                  backgroundColor: "rgba(0,255,0,0.4)",
                                  borderColor: "rgba(0,255,0,0.4)",
                                  label: 'Teplota půdy min/max ' + ylabel2,
                                  data: yValues5,
                                  labels: xLabelsLong
                                },{
                                  type: "bar",
                                  fill: false,
                                  lineTension: 0,
                                  backgroundColor: "rgba(0,0,255,0.4)",
                                  borderColor: "rgba(0,0,255,0.4)",
                                  label: 'Teplota půdy min/max ' + ylabel3,
                                  data: yValues6,
                                  labels: xLabelsLong
                                },</text>
                                
                            }   
                            }]
                              },
                              options: {
                                legend: {display: true,
                                },
                                tooltips: 
                                {
                                    callbacks: 
                                    {
                                        title:function(tooltipItems, context){
                                            // date at tooltip
                                            return context.datasets[tooltipItems[0].datasetIndex].labels[tooltipItems[0].index]
                                        },
                                        label: function(tooltipItems, data) 
                                        {
                                            var text = data.datasets[tooltipItems.datasetIndex].label + ": "
                                            return text + tooltipItems.yLabel.toString()+" °C";
                                        }
                                    }
                                },
                                title: {
                                  display: true,
                                  text: "Teplota půdy",
                                  fontSize: 16
                                },
                                scales: {
                                  xAxes: 
                                  [{
                                      ticks: {
                                            autoSkip:true,
                                            maxTicksLimit: xMaxTicks,
                                            min: Math.min.apply(this, xValues) - 2,
                                            max: Math.max.apply(this, xValues) + 2}}],
                                  yAxes: 
                                  [{
                                      ticks: {
                                      precision: 0,
                                      callback: function(value, index, values) 
                                        {
                                            return  value + " °C";
                                        }
                                        }}],
                                }
                              }
                            });
                            </script>
                        </div><!--end of column -->
  			        </div><!--end of row -->
                </div>
  	        </div><!--end of graph format -->
    </text>
}}
@{if(Model.Item3.Count == 0||Model.Item3.Contains("SoilTempAndTemperature"))
{
    <text>
<!-- SoilTempAndTemperature -->
            <div id="SoilTempAndTemperature" class="card h-10 overflow-hidden text-black rounded-5 shadow-lg bg-light bg-opacity-50">
                <div class="d-flex flex-column h-100 text-shadow-1">
                    <div class="row">    
			            <div class="col-12 text-center">      
                        <canvas id="soil_temp_and_temperature" style="width:100%"></canvas>
                        <script>
                            var yValues1 = [
                             @foreach (var item in Model.Item5)
                            {
                                @item.SoilTemp1.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>
                            }
                            ];
                            var yValues2 = [
                             @foreach (var item in Model.Item5)
                            {
                                @item.SoilTemp2.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>
                            }
                            ];
                            var yValues3 = [
                             @foreach (var item in Model.Item5)
                            {
                                @item.SoilTemp3.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>
                            }
                            ];
                            var yValues4 = [
                             @foreach (var item in Model.Item5)
                            {
                                @item.Temperature.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>
                            }
                            ];
                            
                            @{
                                Measurement itema = new Measurement();
                                foreach (var item in Model.Item5)
                                {
                                    itema = item;
                                }
                                <text>var ylabel1= '</text>@itema.SoilTempDepth1<text>';</text>

                                <text>var ylabel2= '</text>@itema.SoilTempDepth2<text>';</text>

                                <text>var ylabel3= '</text>@itema.SoilTempDepth3<text>';</text>
                            }

                            new Chart("soil_temp_and_temperature", 
                            {
                                
                                data: {
                                labels: xLabelsShort,
                                datasets: [{
                                  type: "line",
                                  fill: false,
                                  pointStyle:'crossRot',
                                  borderWidth: 1,
                                  lineTension: 0,
                                  backgroundColor: "rgba(255,0,0,1.0)",
                                  borderColor: "rgba(255,0,0,1.0)",
                                  data: yValues1,
                                  label:
                                  @{
                                    if(Model.Item4 != 1)
                                    {
                                        <text>'Průměrná teplota půdy v '+ ylabel1,</text>
                                    }
                                    else
                                    {
                                        <text>'Teplota půdy v '+ ylabel1,</text>
                                    }
                                  }
                                  labels: xLabelsLong
                                },
                                {
                                  type: "line",
                                  fill: false,
                                  pointStyle:'crossRot',
                                  borderWidth: 1,
                                  lineTension: 0,
                                  backgroundColor: "rgba(0,255,0,1.0)",
                                  borderColor: "rgba(0,255,0,1.0)",
                                  data: yValues2,
                                  label:
                                  @{
                                    if(Model.Item4 != 1)
                                    {
                                        <text>'Průměrná teplota půdy v '+ ylabel2,</text>
                                    }
                                    else
                                    {
                                        <text>'Teplota půdy v '+ ylabel2,</text>
                                    }
                                  }
                                  labels: xLabelsLong
                                },
                                {
                                  type: "line",
                                  fill: false,
                                  pointStyle:'crossRot',
                                  borderWidth: 1,
                                  lineTension: 0,
                                  backgroundColor: "rgba(0,0,255,1.0)",
                                  borderColor: "rgba(0,0,255,1.0)",
                                  data: yValues3,
                                  label:
                                  @{
                                    if(Model.Item4 != 1)
                                    {
                                        <text>'Průměrná teplota půdy v '+ ylabel3,</text>
                                    }
                                    else
                                    {
                                        <text>'Teplota půdy v '+ ylabel3,</text>
                                    }
                                  }
                                  labels: xLabelsLong
                                },
                                {
                                  type: "line",
                                  fill: false,
                                  pointStyle:'crossRot',
                                  borderWidth: 1,
                                  lineTension: 0,
                                  backgroundColor: "rgba(0,255,255,1.0)",
                                  borderColor: "rgba(0,255,255,1.0)",
                                  data: yValues4,
                                  label:
                                  @{
                                    if(Model.Item4 != 1)
                                    {
                                        <text>'Průměrná teplota vzduchu',</text>
                                    }
                                    else
                                    {
                                        <text>'Teplota vzduchu',</text>
                                    }
                                  }
                                  labels: xLabelsLong
                                },
                                ]
                              },
                              options: {
                                legend: {display: true,
                                },
                                tooltips: 
                                {
                                    callbacks: 
                                    {
                                        title:function(tooltipItems, context){
                                            // date at tooltip
                                            return context.datasets[tooltipItems[0].datasetIndex].labels[tooltipItems[0].index]
                                        },
                                        label: function(tooltipItems, data) 
                                        {
                                            var text = data.datasets[tooltipItems.datasetIndex].label + ": " 
                                            return text + tooltipItems.yLabel.toString()+" °C";
                                        }
                                    }
                                },
                                title: {
                                  display: true,
                                  text: "Teplota půdy a vzduchu",
                                  fontSize: 16
                                },
                                scales: {
                                  xAxes: 
                                  [{
                                      ticks: {
                                            autoSkip:true,
                                            maxTicksLimit: xMaxTicks,
                                            min: Math.min.apply(this, xValues) - 2,
                                                   max: Math.max.apply(this, xValues) + 2}}],
                                  yAxes: [{ticks: {
                                      precision: 0,
                                      callback: function(value, index, values) 
                                                    {
                                                        return  value + " °C";
                                                    }
                                                    }}],
                                }
                              }
                            });
                            </script>
                        </div><!--end of column -->
  			        </div><!--end of row -->
                </div>
  	        </div><!--end of graph format -->
    </text>
}}

@{if(Model.Item3.Count == 0||Model.Item3.Contains("SoilMoisture"))
{
    <text>
<!-- SoilMoisture -->
            <div id="SoilMoisture" class="card h-10 overflow-hidden text-black rounded-5 shadow-lg bg-light bg-opacity-50">
                <div class="d-flex flex-column h-100 text-shadow-1">
                    <div class="row">    
			            <div class="col-12 text-center">      
                        <canvas id="soil_moisture" style="width:100%"></canvas>
                        <script>
                            var yValues1 = [
                             @foreach (var item in Model.Item5)
                            {
                                @item.SoilMoisture1.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>
                            }
                            ];
                            var yValues2 = [
                             @foreach (var item in Model.Item5)
                            {
                                @item.SoilMoisture2.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>
                            }
                            ];
                            var yValues3 = [
                             @foreach (var item in Model.Item5)
                            {
                                @item.SoilMoisture3.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>
                            }
                            ];
                            var yValues4 = [
                            @{
                                if (Model.Item4 != 1)
                                {
                                    int index = 0;
                                    @foreach (var item in Model.Item5)
                                    {
                                        <text>[</text>@Model.Item6.ElementAt(index).SoilMoisture1.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>@Model.Item7.ElementAt(index).SoilMoisture1.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>],</text>
                                        index++;
                                    }
                                }
                            }
                            ];
                            var yValues5 = [
                            @{
                                if (Model.Item4 != 1)
                                {
                                    int index = 0;
                                    @foreach (var item in Model.Item5)
                                    {
                                        <text>[</text>@Model.Item6.ElementAt(index).SoilMoisture2.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>@Model.Item7.ElementAt(index).SoilMoisture2.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>],</text>
                                        index++;
                                    }
                                }
                            }
                            ];
                            var yValues6 = [
                            @{
                                if (Model.Item4 != 1)
                                {
                                    int index = 0;
                                    @foreach (var item in Model.Item5)
                                    {
                                        <text>[</text>@Model.Item6.ElementAt(index).SoilMoisture3.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>@Model.Item7.ElementAt(index).SoilMoisture3.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>],</text>
                                        index++;
                                    }
                                }
                            }
                            ];
                            @{
                                Measurement itema = new Measurement();
                                foreach (var item in Model.Item5)
                                {
                                    itema = item;
                                }
                                <text>var ylabel1= '</text>@itema.SoilMoistureDepth1<text>';</text>

                                <text>var ylabel2= '</text>@itema.SoilMoistureDepth2<text>';</text>

                                <text>var ylabel3= '</text>@itema.SoilMoistureDepth3<text>';</text>
                            }
                            
                            new Chart("soil_moisture", 
                            {
                                
                                data: {
                                labels: xLabelsShort,
                                datasets: [{
                                  type: "line",
                                  fill: false,
                                  pointStyle:'crossRot',
                                  borderWidth: 1,
                                  lineTension: 0,
                                  backgroundColor: "rgba(255,0,0,1.0)",
                                  borderColor: "rgba(255,0,0,1.0)",
                                  data: yValues1,
                                  label:
                                  @{
                                    if(Model.Item4 != 1)
                                    {
                                        <text>'Průměrná vlhkost půdy v '+ ylabel1,</text>
                                    }
                                    else
                                    {
                                        <text>'Vlhkost půdy v '+ ylabel1,</text>
                                    }
                                  }
                                  labels: xLabelsLong
                                },
                                {
                                  type: "line",
                                  fill: false,
                                  pointStyle:'crossRot',
                                  borderWidth: 1,
                                  lineTension: 0,
                                  backgroundColor: "rgba(0,255,0,1.0)",
                                  borderColor: "rgba(0,255,0,1.0)",
                                  data: yValues2,
                                  label:
                                  @{
                                    if(Model.Item4 != 1)
                                    {
                                        <text>'Průměrná vlhkost půdy v '+ ylabel2,</text>
                                    }
                                    else
                                    {
                                        <text>'Vlhkost půdy v '+ ylabel2,</text>
                                    }
                                  }
                                  labels: xLabelsLong
                                },
                                {
                                  type: "line",
                                  fill: false,
                                  pointStyle:'crossRot',
                                  borderWidth: 1,
                                  lineTension: 0,
                                  backgroundColor: "rgba(0,0,255,1.0)",
                                  borderColor: "rgba(0,0,255,1.0)",
                                  data: yValues3,
                                  label: 
                                  @{
                                    if(Model.Item4 != 1)
                                    {
                                        <text>'Průměrná vlhkost půdy v '+ ylabel3,</text>
                                    }
                                    else
                                    {
                                        <text>'Vlhkost půdy v '+ ylabel3,</text>
                                    }
                                  }
                                  labels: xLabelsLong
                                },
                                @{
                                    if(Model.Item4 != 1)
                                    {   
                                <text>{
                                  type: "bar",
                                  fill: false,
                                  lineTension: 0,
                                  backgroundColor: "rgba(255,0,0,0.4)",
                                  borderColor: "rgba(255,0,0,0.4)",
                                  label: 'Vlhkost půdy min/max v '+ ylabel1,
                                  data: yValues4,
                                  labels: xLabelsLong
                                },
                                {
                                  type: "bar",
                                  fill: false,
                                  lineTension: 0,
                                  backgroundColor: "rgba(0,255,0,0.4)",
                                  borderColor: "rgba(0,255,0,0.4)",
                                  label: 'Vlhkost půdy  min/max v '+ ylabel2,
                                  data: yValues5,
                                  labels: xLabelsLong
                                },{
                                  type: "bar",
                                  fill: false,
                                  lineTension: 0,
                                  backgroundColor: "rgba(0,0,255,0.4)",
                                  borderColor: "rgba(0,0,255,0.4)",
                                  label: 'Vlhkost půdy  min/max v '+ ylabel3,
                                  data: yValues6,
                                  labels: xLabelsLong
                                },</text>
                                
                            }   
                            }]
                              },
                              options: {
                                legend: {display: true,
                                },
                                tooltips: 
                                {
                                    callbacks: 
                                    {
                                        title:function(tooltipItems, context){
                                            // date at tooltip
                                            return context.datasets[tooltipItems[0].datasetIndex].labels[tooltipItems[0].index]
                                        },
                                        label: function(tooltipItems, data) 
                                        {
                                            var text = data.datasets[tooltipItems.datasetIndex].label + ": "
                                            return text + tooltipItems.yLabel.toString()+" %";
                                        }

                                    }
                                },
                                title: {
                                  display: true,
                                  text: "Vlhkost půdy",
                                  fontSize: 16
                                },
                                scales: {
                                  xAxes: [{ticks: {
                                      autoSkip:true,
                                          maxTicksLimit: xMaxTicks,
                                      min: Math.min.apply(this, xValues) - 2,
                                                   max: Math.max.apply(this, xValues) + 2}}],
                                  yAxes: 
                                  [{
                                      ticks: 
                                      { 
                                          min: 0,
                                          max: 100,
                                          stepSize: 10,
                                          precision: 0,
                                          callback: function(value, index, values) 
                                        {
                                            return  value.toFixed(yValues) + "%";
                                        },
                                        }
                                    }],
                                }
                              }
                            });
                            </script>
                        </div><!--end of column -->
  			        </div><!--end of row -->
                </div>
  	        </div><!--end of graph format -->
    </text>
}}

@{if(Model.Item3.Count == 0||Model.Item3.Contains("SoilMoistureAndHumidity"))
{
    <text>
<!-- SoilMoistureAndHumidity -->
            <div id="SoilMoistureAndHumidity" class="card h-10 overflow-hidden text-black rounded-5 shadow-lg bg-light bg-opacity-50">
                <div class="d-flex flex-column h-100 text-shadow-1">
                    <div class="row">    
			            <div class="col-12 text-center">      
                        <canvas id="soil_moisture_and_humidity" style="width:100%"></canvas>
                        <script>
                            var yValues1 = [
                             @foreach (var item in Model.Item5)
                            {
                                @item.SoilMoisture1.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>
                            }
                            ];
                            var yValues2 = [
                             @foreach (var item in Model.Item5)
                            {
                                @item.SoilMoisture2.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>
                            }
                            ];
                            var yValues3 = [
                             @foreach (var item in Model.Item5)
                            {
                                @item.SoilMoisture3.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>
                            }
                            ];
                            var yValues4 = [
                             @foreach (var item in Model.Item5)
                            {
                                @item.Humidity.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>
                            }
                            ];
                            @{
                                Measurement itema = new Measurement();
                                foreach (var item in Model.Item5)
                                {
                                    itema = item;
                                }
                                <text>var ylabel1= '</text>@itema.SoilMoistureDepth1<text>';</text>

                                <text>var ylabel2= '</text>@itema.SoilMoistureDepth2<text>';</text>

                                <text>var ylabel3= '</text>@itema.SoilMoistureDepth3<text>';</text>
                            }
                            
                            new Chart("soil_moisture_and_humidity", 
                            {
                                data: {
                                labels: xLabelsShort,
                                datasets: [{
                                    type: "line",
                                  fill: false,
                                  pointStyle:'crossRot',
                                  borderWidth: 1,
                                  lineTension: 0,
                                  backgroundColor: "rgba(255,0,0,1.0)",
                                  borderColor: "rgba(255,0,0,1.0)",
                                  data: yValues1,
                                  label:
                                  @{
                                    if(Model.Item4 != 1)
                                    {
                                        <text>'Průměrná vlhkost půdy v '+ ylabel1,</text>
                                    }
                                    else
                                    {
                                        <text>'Vlhkost půdy v '+ ylabel1,</text>
                                    }
                                  }
                                  labels: xLabelsLong
                                },
                                {
                                  type: "line",
                                  fill: false,
                                  pointStyle:'crossRot',
                                  borderWidth: 1,
                                  lineTension: 0,
                                  backgroundColor: "rgba(0,255,0,1.0)",
                                  borderColor: "rgba(0,255,0,1.0)",
                                  data: yValues2,
                                  label:
                                  @{
                                    if(Model.Item4 != 1)
                                    {
                                        <text>'Průměrná vlhkost půdy v '+ ylabel2,</text>
                                    }
                                    else
                                    {
                                        <text>'Vlhkost půdy v '+ ylabel2,</text>
                                    }
                                  }
                                  labels: xLabelsLong
                                },
                                {
                                  type: "line",
                                  fill: false,
                                  pointStyle:'crossRot',
                                  borderWidth: 1,
                                  lineTension: 0,
                                  backgroundColor: "rgba(0,0,255,1.0)",
                                  borderColor: "rgba(0,0,255,1.0)",
                                  data: yValues3,
                                  label: 
                                  @{
                                    if(Model.Item4 != 1)
                                    {
                                        <text>'Průměrná vlhkost půdy v '+ ylabel3,</text>
                                    }
                                    else
                                    {
                                        <text>'Vlhkost půdy v '+ ylabel3,</text>
                                    }
                                  }
                                  labels: xLabelsLong
                                },
                                {
                                  type: "line",
                                  fill: false,
                                  pointStyle:'crossRot',
                                  borderWidth: 1,
                                  lineTension: 0,
                                  backgroundColor: "rgba(0,255,255,1.0)",
                                  borderColor: "rgba(0,255,255,1.0)",
                                  data: yValues4,
                                  label: 
                                  @{
                                    if(Model.Item4 != 1)
                                    {
                                        <text>'Průměrná vlhkost vzduchu',</text>
                                    }
                                    else
                                    {
                                        <text>'Vlhkost vzduchu',</text>
                                    }
                                  }
                                  labels: xLabelsLong
                                }]
                              },
                              options: {
                                legend: {display: true,
                                },
                                tooltips: 
                                {
                                    callbacks: 
                                    {
                                        title:function(tooltipItems, context){
                                            // date at tooltip
                                            return context.datasets[tooltipItems[0].datasetIndex].labels[tooltipItems[0].index]
                                        },
                                        label: function(tooltipItems, data) 
                                        {
                                            var text = data.datasets[tooltipItems.datasetIndex].label + ": " 
                                            return text + tooltipItems.yLabel.toString()+" %";
                                        }
                                    }
                                },
                                title: {
                                  display: true,
                                  text: "Vlhkost půdy a vzduchu",
                                  fontSize: 16
                                },
                                scales: {
                                  xAxes: 
                                  [{
                                      ticks: 
                                      {
                                          autoSkip:true,
                                          maxTicksLimit: xMaxTicks,
                                          min: Math.min.apply(this, xValues) - 2,
                                          max: Math.max.apply(this, xValues) + 2
                                      }}],
                                  yAxes: 
                                  [{
                                      ticks: 
                                      { 
                                          min: 0,
                                          max: 100,
                                          stepSize: 10,
                                          precision: 0,
                                          callback: function(value, index, values) 
                                        {
                                            return  value + " %";
                                        },
                                        }
                                    }],
                                }
                              }
                            });
                            </script>
                        </div><!--end of column -->
  			        </div><!--end of row -->
                </div>
  	        </div><!--end of graph format -->
    </text>
}}

@{if(Model.Item3.Count == 0||Model.Item3.Contains("BatteryVoltage"))
{
    <text>
<!-- BatteryVoltage -->
            <div id="BatteryVoltage" class="card h-10 overflow-hidden text-black rounded-5 shadow-lg bg-light bg-opacity-50">
                <div class="d-flex flex-column h-100 text-shadow-1">
 
                    <div class="row">    
			            <div class="col-12 text-center">      
                        <canvas id="battery_voltage" style="width:100%"></canvas>
                        <script>
                            var yValues = [
                             @foreach (var item in Model.Item5)
                            {
                                @item.BatteryVoltage.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>
                            }
                            ];
                            var yValues2 = [
                            @{
                                if (Model.Item4 != 1)
                                {
                                    int index = 0;
                                    @foreach (var item in Model.Item5)
                                    {
                                        <text>[</text>@Model.Item6.ElementAt(index).BatteryVoltage.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>,</text>@Model.Item7.ElementAt(index).BatteryVoltage.ToString(System.Globalization.CultureInfo.InvariantCulture)<text>],</text>
                                        index++;
                                                    }
                                                }
                                            }
                                            ];
                            new Chart("battery_voltage", 
                            {
                                type: "line",
                                data: {
                                labels: xLabelsShort,
                                datasets: [{
                                  fill: false,
                                  pointStyle:'crossRot',
                                  borderWidth: 1,
                                  lineTension: 0,
                                  backgroundColor: "rgba(0,0,255,1.0)",
                                  borderColor: "rgba(0,0,255,1.0)",
                                  label: 'Napětí baterie',
                                  @{
                                                if (Model.Item4 != 1)
                                                {
                                                    <text>label: 'Průměrné napětí baterie', </text>
                                                
                                                } 
                                                else 
                                                {
                                                    <text>label: 'Napětí baterie', </text>
                                                }
                                            }
                                  data: yValues,
                                  labels: xLabelsLong
                                },
                                @{
                                    if(Model.Item4 != 1)
                                    {   
                                <text>{
                                  type: "bar",
                                  fill: false,
                                  lineTension: 0,
                                  backgroundColor: "rgba(0,0,255,0.4)",
                                  borderColor: "rgba(0,0,255,0.4)",
                                  label: 'Napětí baterie min/max',
                                  data: yValues2,
                                  labels: xLabelsLong
                                }</text>
                                
                            }    
                            }]
                              },
                              options: 
                              {
                              legend: 
                              {
                                  display: true,
                              },
                              tooltips: 
                                {
                                    callbacks: 
                                    {
                                        title:function(tooltipItems, context){
                                            // date at tooltip
                                            return context.datasets[tooltipItems[0].datasetIndex].labels[tooltipItems[0].index]
                                        },
                                        label: function(tooltipItems, data) 
                                        {
                                            @{
                                                if(Model.Item4 != 1)
                                                { 
                                                    <text>
                                                        var text = tooltipItems.datasetIndex === 0 ? 'Průměrné napětí baterie: ' : 'Napětí baterie min/max: '
                                                        return text + tooltipItems.yLabel.toString()+" V";
                                                    </text>
                                                }
                                                else
                                                {
                                                    <text>return "Napětí baterie: " + tooltipItems.yLabel.toString()+" V";</text>
                                                }
                                        }
                                        }
                                    }
                                },
                              title: 
                              {
                                display: true,
                                text: "Napětí baterie",
                                fontSize: 16
                              },
                              scales: 
                              {
                                  xAxes: 
                                  [{
                                      ticks: 
                                      {
                                          autoSkip:true,
                                          maxTicksLimit: xMaxTicks,
                                          min: Math.min.apply(this, xValues) - 2,
                                          max: Math.max.apply(this, xValues) + 2
                                      }
                                  }],
                                  yAxes: 
                                  [{
                                      ticks: 
                                      {
                                          min: 3.0,
                                          max: 4.5,
                                          stepSize: 0.5,
                                          precision: 1,
                                         
                                          callback: function(value, index, values) 
                                          {
                                                return  value + " V";
                                          },
                                      }
                                  }],
                                }
                              }
                            });
                            </script>
                        </div><!--end of column -->
  			        </div><!--end of row -->
                </div>
  	        </div><!--end of graph format -->
    </text>
}}

        </div>
    </div>
</div>
