﻿{"id":10797,"date":"2024-10-24T10:07:23","date_gmt":"2024-10-24T08:07:23","guid":{"rendered":"https:\/\/elji.se\/?page_id=10797"},"modified":"2024-10-24T11:42:43","modified_gmt":"2024-10-24T09:42:43","slug":"7-dygnsprognos-for-tjorn","status":"publish","type":"page","link":"https:\/\/elji.se\/index.php\/7-dygnsprognos-for-tjorn\/","title":{"rendered":"7 dygnsprognos f\u00f6r Tj\u00f6rn"},"content":{"rendered":"<p>[et_pb_section fb_built=&#8221;1&#8243; _builder_version=&#8221;4.27.2&#8243; _module_preset=&#8221;default&#8221; width_tablet=&#8221;&#8221; width_phone=&#8221;100%&#8221; width_last_edited=&#8221;on|phone&#8221; max_width_tablet=&#8221;&#8221; max_width_phone=&#8221;100%&#8221; max_width_last_edited=&#8221;on|phone&#8221; global_colors_info=&#8221;{}&#8221;][et_pb_row _builder_version=&#8221;4.27.2&#8243; _module_preset=&#8221;default&#8221; width_tablet=&#8221;&#8221; width_phone=&#8221;100%&#8221; width_last_edited=&#8221;on|phone&#8221; max_width_tablet=&#8221;&#8221; max_width_phone=&#8221;100%&#8221; max_width_last_edited=&#8221;on|phone&#8221; global_colors_info=&#8221;{}&#8221;][et_pb_column type=&#8221;4_4&#8243; _builder_version=&#8221;4.27.2&#8243; _module_preset=&#8221;default&#8221; global_colors_info=&#8221;{}&#8221;][et_pb_code admin_label=&#8221;7 dygnsprognos&#8221; _builder_version=&#8221;4.27.2&#8243; _module_preset=&#8221;default&#8221; width_tablet=&#8221;&#8221; width_phone=&#8221;100%&#8221; width_last_edited=&#8221;on|phone&#8221; max_width=&#8221;100%&#8221; max_width_tablet=&#8221;100%&#8221; max_width_phone=&#8221;100%&#8221; max_width_last_edited=&#8221;on|phone&#8221; global_colors_info=&#8221;{}&#8221;]<!-- V\u00e4derprognos f\u00f6r Tj\u00f6rn (7 dagar) --><!-- [et_pb_line_break_holder] --><\/p>\n<div id=\"weather-container\"><!-- [et_pb_line_break_holder] -->    <\/p>\n<h1>7 dygnsprognos f\u00f6r Tj\u00f6rn<\/h1>\n<p><!-- [et_pb_line_break_holder] -->    <\/p>\n<table id=\"weather-table\"><!-- [et_pb_line_break_holder] -->        <\/p>\n<thead><!-- [et_pb_line_break_holder] -->            <\/p>\n<tr><!-- [et_pb_line_break_holder] -->                <\/p>\n<th>Datum<\/th>\n<p><!-- [et_pb_line_break_holder] -->                <\/p>\n<th>Temperatur (\u00b0C)<\/th>\n<p><!-- [et_pb_line_break_holder] -->                <\/p>\n<th>Vind (m\/s)<\/th>\n<p><!-- [et_pb_line_break_holder] -->                <\/p>\n<th>Nederb\u00f6rd (mm)<\/th>\n<p><!-- [et_pb_line_break_holder] -->                <\/p>\n<th>V\u00e4der<\/th>\n<p><!-- [et_pb_line_break_holder] -->            <\/tr>\n<p><!-- [et_pb_line_break_holder] -->        <\/thead>\n<p><!-- [et_pb_line_break_holder] -->        <\/p>\n<tbody id=\"weather-body\"><!-- [et_pb_line_break_holder] -->            <!-- Rader med v\u00e4derdata kommer att l\u00e4ggas till h\u00e4r --><!-- [et_pb_line_break_holder] -->        <\/tbody>\n<p><!-- [et_pb_line_break_holder] -->    <\/table>\n<p><!-- [et_pb_line_break_holder] -->    <\/p>\n<div class=\"footer-text\">V\u00e4deruppgifter fr\u00e5n yr.no<\/div>\n<p><!-- [et_pb_line_break_holder] --><\/div>\n<p><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><\/p>\n<style><!-- [et_pb_line_break_holder] -->    #weather-container {<!-- [et_pb_line_break_holder] -->        font-family: Arial, sans-serif;<!-- [et_pb_line_break_holder] -->        text-align: center;<!-- [et_pb_line_break_holder] -->        margin: 0 auto;<!-- [et_pb_line_break_holder] -->        width: 100%;<!-- [et_pb_line_break_holder] -->        display: flex;<!-- [et_pb_line_break_holder] -->        flex-direction: column;<!-- [et_pb_line_break_holder] -->        align-items: center;<!-- [et_pb_line_break_holder] -->        overflow-x: auto;<!-- [et_pb_line_break_holder] -->    }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    h1 {<!-- [et_pb_line_break_holder] -->        font-size: 24px;<!-- [et_pb_line_break_holder] -->        margin-bottom: 20px;<!-- [et_pb_line_break_holder] -->    }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    table {<!-- [et_pb_line_break_holder] -->        width: 100%;<!-- [et_pb_line_break_holder] -->        max-width: 100%;<!-- [et_pb_line_break_holder] -->        margin: 0;<!-- [et_pb_line_break_holder] -->        border-collapse: collapse;<!-- [et_pb_line_break_holder] -->        border: 1px solid #ddd;<!-- [et_pb_line_break_holder] -->        table-layout: fixed;<!-- [et_pb_line_break_holder] -->    }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    th, td {<!-- [et_pb_line_break_holder] -->        padding: 4px;<!-- [et_pb_line_break_holder] -->        text-align: center;<!-- [et_pb_line_break_holder] -->        border-bottom: 1px solid #ddd;<!-- [et_pb_line_break_holder] -->        font-size: 12px;<!-- [et_pb_line_break_holder] -->        white-space: nowrap;<!-- [et_pb_line_break_holder] -->        line-height: 1.2;<!-- [et_pb_line_break_holder] -->    }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    th {<!-- [et_pb_line_break_holder] -->        background-color: #4CAF50;<!-- [et_pb_line_break_holder] -->        color: white;<!-- [et_pb_line_break_holder] -->    }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    tr:nth-child(even) {<!-- [et_pb_line_break_holder] -->        background-color: #f2f2f2;<!-- [et_pb_line_break_holder] -->    }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    img {<!-- [et_pb_line_break_holder] -->        width: 25px;<!-- [et_pb_line_break_holder] -->        height: 25px;<!-- [et_pb_line_break_holder] -->        display: block;<!-- [et_pb_line_break_holder] -->        margin: 0 auto;<!-- [et_pb_line_break_holder] -->    }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    .footer-text {<!-- [et_pb_line_break_holder] -->        font-size: 10px;<!-- [et_pb_line_break_holder] -->        color: #777;<!-- [et_pb_line_break_holder] -->        margin-top: 5px;  \/* Minskar avst\u00e5ndet mellan tabellen och texten *\/<!-- [et_pb_line_break_holder] -->    }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->    \/* Mobilanpassad vy f\u00f6r mindre sk\u00e4rmar *\/<!-- [et_pb_line_break_holder] -->    @media (max-width: 600px) {<!-- [et_pb_line_break_holder] -->        #weather-container {<!-- [et_pb_line_break_holder] -->            width: 100%;<!-- [et_pb_line_break_holder] -->            margin: 0;<!-- [et_pb_line_break_holder] -->            padding: 0;<!-- [et_pb_line_break_holder] -->            overflow-x: auto;<!-- [et_pb_line_break_holder] -->        }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        h1 {<!-- [et_pb_line_break_holder] -->            font-size: 18px;<!-- [et_pb_line_break_holder] -->        }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        table {<!-- [et_pb_line_break_holder] -->            width: 100%;<!-- [et_pb_line_break_holder] -->            max-width: 100%;<!-- [et_pb_line_break_holder] -->            table-layout: fixed;<!-- [et_pb_line_break_holder] -->        }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        th, td {<!-- [et_pb_line_break_holder] -->            font-size: 10px;<!-- [et_pb_line_break_holder] -->            padding: 2px;<!-- [et_pb_line_break_holder] -->            line-height: 1.2;<!-- [et_pb_line_break_holder] -->        }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        \/* S\u00e4tt specifik bredd f\u00f6r kolumnerna *\/<!-- [et_pb_line_break_holder] -->        th:nth-child(1), td:nth-child(1) {  \/* Datum *\/<!-- [et_pb_line_break_holder] -->            width: 60px;<!-- [et_pb_line_break_holder] -->        }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        th:nth-child(2), td:nth-child(2) {  \/* Temperatur *\/<!-- [et_pb_line_break_holder] -->            width: 50px;<!-- [et_pb_line_break_holder] -->        }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        th:nth-child(3), td:nth-child(3) {  \/* Vind *\/<!-- [et_pb_line_break_holder] -->            width: 40px;<!-- [et_pb_line_break_holder] -->        }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        th:nth-child(4), td:nth-child(4) {  \/* Nederb\u00f6rd *\/<!-- [et_pb_line_break_holder] -->            width: 50px;<!-- [et_pb_line_break_holder] -->        }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        th:nth-child(5), td:nth-child(5) {  \/* V\u00e4der *\/<!-- [et_pb_line_break_holder] -->            display: none;  \/* D\u00f6ljer kolumnen p\u00e5 mobilen *\/<!-- [et_pb_line_break_holder] -->        }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        img {<!-- [et_pb_line_break_holder] -->            width: 20px;<!-- [et_pb_line_break_holder] -->            height: 20px;<!-- [et_pb_line_break_holder] -->            display: block;<!-- [et_pb_line_break_holder] -->            margin: 0 auto;<!-- [et_pb_line_break_holder] -->        }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        \/* F\u00f6rkorta rubriker endast f\u00f6r mobiler *\/<!-- [et_pb_line_break_holder] -->        th:nth-child(1)::before {<!-- [et_pb_line_break_holder] -->            content: \"Datum\";<!-- [et_pb_line_break_holder] -->        }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        th:nth-child(2)::before {<!-- [et_pb_line_break_holder] -->            content: \"Temp\";<!-- [et_pb_line_break_holder] -->        }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        th:nth-child(3)::before {<!-- [et_pb_line_break_holder] -->            content: \"Vind\";<!-- [et_pb_line_break_holder] -->        }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        th:nth-child(4)::before {<!-- [et_pb_line_break_holder] -->            content: \"Ned\";<!-- [et_pb_line_break_holder] -->        }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        \/* D\u00f6lj den ursprungliga texten i rubriker p\u00e5 mobiler *\/<!-- [et_pb_line_break_holder] -->        th {<!-- [et_pb_line_break_holder] -->            font-size: 0;<!-- [et_pb_line_break_holder] -->        }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        \/* Visa korrekt f\u00f6rkortad rubrik med ::before *\/<!-- [et_pb_line_break_holder] -->        th::before {<!-- [et_pb_line_break_holder] -->            font-size: 12px;<!-- [et_pb_line_break_holder] -->            color: white;<!-- [et_pb_line_break_holder] -->        }<!-- [et_pb_line_break_holder] -->    }<!-- [et_pb_line_break_holder] --><\/style>\n<p><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] --><script><!-- [et_pb_line_break_holder] -->    document.addEventListener('DOMContentLoaded', function () {<!-- [et_pb_line_break_holder] -->        const weatherTableBody = document.getElementById('weather-body');<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        \/\/ Funktion f\u00f6r att h\u00e4mta v\u00e4derprognos fr\u00e5n yr.no API<!-- [et_pb_line_break_holder] -->        async function getWeatherForecast() {<!-- [et_pb_line_break_holder] -->            try {<!-- [et_pb_line_break_holder] -->                const response = await fetch('https:\/\/api.met.no\/weatherapi\/locationforecast\/2.0\/compact?lat=58.014&lon=11.645');<!-- [et_pb_line_break_holder] -->                const data = await response.json();<!-- [et_pb_line_break_holder] -->                const timeseries = data.properties.timeseries;<!-- [et_pb_line_break_holder] -->                const forecastDays = {};<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->                const shortWeekdays = {<!-- [et_pb_line_break_holder] -->                    \"m\u00e5n\": \"M\u00e5\",<!-- [et_pb_line_break_holder] -->                    \"tis\": \"Ti\",<!-- [et_pb_line_break_holder] -->                    \"ons\": \"On\",<!-- [et_pb_line_break_holder] -->                    \"tors\": \"To\",<!-- [et_pb_line_break_holder] -->                    \"fre\": \"Fr\",<!-- [et_pb_line_break_holder] -->                    \"l\u00f6r\": \"L\u00f6\",<!-- [et_pb_line_break_holder] -->                    \"s\u00f6n\": \"S\u00f6\"<!-- [et_pb_line_break_holder] -->                };<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->                \/\/ Hantera data f\u00f6r 7 dagar<!-- [et_pb_line_break_holder] -->                timeseries.forEach(item => {<!-- [et_pb_line_break_holder] -->                    const dateTime = new Date(item.time);<!-- [et_pb_line_break_holder] -->                    const localDateTime = new Date(dateTime.getTime() + dateTime.getTimezoneOffset() * 60000);<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->                    const weekday = localDateTime.toLocaleDateString('sv-SE', { weekday: 'short' });<!-- [et_pb_line_break_holder] -->                    const twoLetterWeekday = shortWeekdays[weekday.toLowerCase()];<!-- [et_pb_line_break_holder] -->                    const date = localDateTime.toLocaleDateString('sv-SE', { day: '2-digit', month: '2-digit' });<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->                    const forecastDate = `${twoLetterWeekday} ${date}`;<!-- [et_pb_line_break_holder] -->                    if (!forecastDays[forecastDate]) {<!-- [et_pb_line_break_holder] -->                        forecastDays[forecastDate] = {<!-- [et_pb_line_break_holder] -->                            temperatures: [],<!-- [et_pb_line_break_holder] -->                            windSpeeds: [],<!-- [et_pb_line_break_holder] -->                            precipitations: [],<!-- [et_pb_line_break_holder] -->                            symbolCode: ''<!-- [et_pb_line_break_holder] -->                        };<!-- [et_pb_line_break_holder] -->                    }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->                    const temp = item.data.instant.details.air_temperature;<!-- [et_pb_line_break_holder] -->                    const windSpeed = item.data.instant.details.wind_speed;<!-- [et_pb_line_break_holder] -->                    const precipitation = item.data.next_6_hours ? item.data.next_6_hours.details.precipitation_amount : 0;<!-- [et_pb_line_break_holder] -->                    const symbolCode = item.data.next_6_hours ? item.data.next_6_hours.summary.symbol_code : 'clearsky_day';<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->                    forecastDays[forecastDate].temperatures.push(temp);<!-- [et_pb_line_break_holder] -->                    forecastDays[forecastDate].windSpeeds.push(windSpeed);<!-- [et_pb_line_break_holder] -->                    forecastDays[forecastDate].precipitations.push(precipitation);<!-- [et_pb_line_break_holder] -->                    if (!forecastDays[forecastDate].symbolCode) {<!-- [et_pb_line_break_holder] -->                        forecastDays[forecastDate].symbolCode = symbolCode;<!-- [et_pb_line_break_holder] -->                    }<!-- [et_pb_line_break_holder] -->                });<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->                Object.keys(forecastDays).slice(0, 7).forEach(date => {<!-- [et_pb_line_break_holder] -->                    const forecast = forecastDays[date];<!-- [et_pb_line_break_holder] -->                    const maxTemp = Math.round(Math.max(...forecast.temperatures));<!-- [et_pb_line_break_holder] -->                    const minTemp = Math.round(Math.min(...forecast.temperatures));<!-- [et_pb_line_break_holder] -->                    const totalPrecipitation = forecast.precipitations.reduce((sum, val) => sum + val, 0).toFixed(1);<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->                    const row = document.createElement('tr');<!-- [et_pb_line_break_holder] -->                    row.innerHTML = `<!-- [et_pb_line_break_holder] -->                        <\/p>\n<td>${date}<\/td>\n<p><!-- [et_pb_line_break_holder] -->                        <\/p>\n<td>${maxTemp} \/ ${minTemp}\u00b0C<\/td>\n<p><!-- [et_pb_line_break_holder] -->                        <\/p>\n<td>${Math.round(Math.max(...forecast.windSpeeds))} m\/s<\/td>\n<p><!-- [et_pb_line_break_holder] -->                        <\/p>\n<td>${totalPrecipitation} mm<\/td>\n<p><!-- [et_pb_line_break_holder] -->                        <\/p>\n<td><img decoding=\"async\" src=\"https:\/\/api.met.no\/images\/weathericons\/svg\/${forecast.symbolCode}.svg\" alt=\"Weather icon\"><\/td>\n<p><!-- [et_pb_line_break_holder] -->                    `;<!-- [et_pb_line_break_holder] -->                    weatherTableBody.appendChild(row);<!-- [et_pb_line_break_holder] -->                });<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->            } catch (error) {<!-- [et_pb_line_break_holder] -->                console.error('Fel vid h\u00e4mtning av v\u00e4derdata:', error);<!-- [et_pb_line_break_holder] -->            }<!-- [et_pb_line_break_holder] -->        }<!-- [et_pb_line_break_holder] --><!-- [et_pb_line_break_holder] -->        getWeatherForecast();<!-- [et_pb_line_break_holder] -->    });<!-- [et_pb_line_break_holder] --><\/script><!-- [et_pb_line_break_holder] -->[\/et_pb_code][\/et_pb_column][\/et_pb_row][\/et_pb_section]<\/p>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_et_pb_use_builder":"on","_et_pb_old_content":"","_et_gb_content_width":"","footnotes":""},"class_list":["post-10797","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/elji.se\/index.php\/wp-json\/wp\/v2\/pages\/10797","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/elji.se\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/elji.se\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/elji.se\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/elji.se\/index.php\/wp-json\/wp\/v2\/comments?post=10797"}],"version-history":[{"count":32,"href":"https:\/\/elji.se\/index.php\/wp-json\/wp\/v2\/pages\/10797\/revisions"}],"predecessor-version":[{"id":10848,"href":"https:\/\/elji.se\/index.php\/wp-json\/wp\/v2\/pages\/10797\/revisions\/10848"}],"wp:attachment":[{"href":"https:\/\/elji.se\/index.php\/wp-json\/wp\/v2\/media?parent=10797"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}