{"id":30800,"date":"2024-07-02T20:35:45","date_gmt":"2024-07-02T14:35:45","guid":{"rendered":"https:\/\/centralasiaclimateportal.org\/?page_id=30800"},"modified":"2026-01-07T17:50:32","modified_gmt":"2026-01-07T11:50:32","slug":"%d0%b8%d1%81%d1%82%d0%be%d1%80%d0%b8%d1%87%d0%b5%d1%81%d0%ba%d0%b8%d0%b5-%d0%b4%d0%b0%d0%bd%d0%bd%d1%8b%d0%b5-%d0%be-%d0%bf%d0%be%d0%b3%d0%be%d0%b4%d0%b5-%d0%b4%d0%bb%d1%8f-%d0%b3%d0%be%d1%80%d0%be","status":"publish","type":"page","link":"https:\/\/centralasiaclimateportal.org\/ru\/%d0%b8%d1%81%d1%82%d0%be%d1%80%d0%b8%d1%87%d0%b5%d1%81%d0%ba%d0%b8%d0%b5-%d0%b4%d0%b0%d0%bd%d0%bd%d1%8b%d0%b5-%d0%be-%d0%bf%d0%be%d0%b3%d0%be%d0%b4%d0%b5-%d0%b4%d0%bb%d1%8f-%d0%b3%d0%be%d1%80%d0%be\/","title":{"rendered":"\u041a\u043b\u0438\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0434\u0430\u043d\u043d\u044b\u0435 \u0434\u043b\u044f \u0433\u043e\u0440\u043e\u0434\u043e\u0432 \u0426\u0435\u043d\u0442\u0440\u0430\u043b\u044c\u043d\u043e\u0439 \u0410\u0437\u0438\u0438"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"30800\" class=\"elementor elementor-30800 elementor-30536\" data-elementor-post-type=\"page\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-e75c0e3 elementor-section-full_width elementor-section-height-default elementor-section-height-default\" data-id=\"e75c0e3\" data-element_type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-c367cca\" data-id=\"c367cca\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-fbf61cf elementor-widget elementor-widget-text-editor\" data-id=\"fbf61cf\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<h3 style=\"text-align: center;\"><strong>\u041d\u0430\u0432\u0435\u0434\u0438\u0442\u0435 \u0443\u043a\u0430\u0437\u0430\u0442\u0435\u043b\u044c \u043c\u044b\u0448\u0438 \u043d\u0430 \u0433\u0440\u0430\u0444\u0438\u043a, \u0447\u0442\u043e\u0431\u044b \u043f\u0440\u043e\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c \u043f\u043e\u0434\u0440\u043e\u0431\u043d\u044b\u0435 \u0435\u0436\u0435\u0434\u043d\u0435\u0432\u043d\u044b\u0435 \u0434\u0430\u043d\u043d\u044b\u0435 \u043e \u043f\u043e\u0433\u043e\u0434\u0435, \u0438 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u0438\u0442\u0435 \u0432\u043f\u0440\u0430\u0432\u043e, \u0447\u0442\u043e\u0431\u044b \u0443\u0432\u0438\u0434\u0435\u0442\u044c \u0431\u043e\u043b\u044c\u0448\u0435 \u0434\u043d\u0435\u0439.<\/strong><\/h3>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-35c0fd3 elementor-widget elementor-widget-html\" data-id=\"35c0fd3\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<script src=\"https:\/\/code.highcharts.com\/highcharts.js\"><\/script>\r\n<script src=\"https:\/\/code.highcharts.com\/modules\/datagrouping.js\"><\/script>\r\n<script src=\"https:\/\/code.highcharts.com\/modules\/windbarb.js\"><\/script>\r\n<script src=\"https:\/\/code.highcharts.com\/modules\/pattern-fill.js\"><\/script>\r\n<script src=\"https:\/\/code.highcharts.com\/modules\/data.js\"><\/script>\r\n<script src=\"https:\/\/code.highcharts.com\/modules\/exporting.js\"><\/script>\r\n<script src=\"https:\/\/code.highcharts.com\/modules\/accessibility.js\"><\/script>\r\n\r\n<link href=\"https:\/\/netdna.bootstrapcdn.com\/font-awesome\/4.0.3\/css\/font-awesome.css\" rel=\"stylesheet\">\r\n\r\n\r\n<style>\r\n#loader {\r\n    width: 48px;\r\n    height: 48px;\r\n    border: 5px solid #35b9dc;\r\n    border-bottom-color: transparent;\r\n    border-radius: 50%;\r\n    box-sizing: border-box;\r\n    animation: rotation 1s linear infinite;\r\n    display: flex;\r\n    justify-self: center;\r\n    }\r\n\r\n    @keyframes rotation {\r\n        0% {\r\n            transform: rotate(0deg);\r\n        }\r\n        100% {\r\n            transform: rotate(360deg);\r\n        }\r\n    } \r\n<\/style>\r\n<div style=\"display: flex; flex-direction: row; justify-content: center; gap: 40px; margin-bottom: 20px;\">\r\n    \r\n    <div style=\"display: flex; flex-direction: column; gap: 10px\">\r\n         <label>\u0412\u044b\u0431\u0435\u0440\u0438\u0442\u0435 \u0433\u043e\u0434<\/label>\r\n         <select id=\"yearSelect\">\r\n            <option value=\"2024\">2024<\/option>\r\n            <option value=\"2025\" selected>2025<\/option>\r\n        <\/select>\r\n    <\/div>\r\n    \r\n    <div style=\"display: flex; flex-direction: column; gap: 10px\">\r\n         <label>\u0412\u044b\u0431\u0435\u0440\u0438\u0442\u0435 \u043c\u0435\u0441\u044f\u0446<\/label>\r\n         <select id=\"monthSelect\">\r\n         <option value=\"1\">\u042f\u043d\u0432\u0430\u0440\u044c<\/option>\r\n        <option value=\"2\">\u0424\u0435\u0432\u0440\u0430\u043b\u044c<\/option>\r\n        <option value=\"3\">\u041c\u0430\u0440\u0442<\/option>\r\n        <option value=\"4\" >\u0410\u043f\u0440\u0435\u043b\u044c<\/option>\r\n        <option value=\"5\" >\u041c\u0430\u0439<\/option>\r\n        <option value=\"6\" >\u0418\u044e\u043d\u044c<\/option>\r\n        <option value=\"7\">\u0418\u044e\u043b\u044c<\/option>\r\n        <option value=\"8\" >\u0410\u0432\u0433\u0443\u0441\u0442<\/option>\r\n        <option value=\"9\" selected>\u0421\u0435\u043d\u0442\u044f\u0431\u0440\u044c<\/option>\r\n        <option value=\"10\">\u041e\u043a\u0442\u044f\u0431\u0440\u044c<\/option>\r\n        <option value=\"11\">\u041d\u043e\u044f\u0431\u0440\u044c<\/option>\r\n        <option value=\"12\">\u0414\u0435\u043a\u0430\u0431\u0440\u044c<\/option>\r\n    <\/select>\r\n    <\/div>\r\n   \r\n    <div style=\"display: flex; flex-direction: column; gap: 10px\">\r\n         <label >\u0412\u044b\u0431\u0435\u0440\u0438\u0442\u0435 \u0433\u043e\u0440\u043e\u0434<\/label>\r\n        <select id=\"countrySelect\">\r\n        <option value=\"Almaty\">\u0410\u043b\u043c\u0430\u0442\u044b<\/option>\r\n        <option value=\"Ashgabat\">\u0410\u0448\u0445\u0430\u0431\u0430\u0434<\/option>\r\n        <option value=\"Astana\">\u0410\u0441\u0442\u0430\u043d\u0430<\/option>\r\n        <option value=\"Bishkek\">\u0411\u0438\u0448\u043a\u0435\u043a<\/option>\r\n        <option value=\"Dushanbe\">\u0414\u0443\u0448\u0430\u043d\u0431\u0435<\/option>\r\n        <option value=\"Tashkent\">\u0422\u0430\u0448\u043a\u0435\u043d\u0442<\/option>\r\n        <\/select>\r\n    <\/div>\r\n<\/div>\r\n\r\n<h3 style=\" font-weight: 500; font-size: 22px; margin: 10px 0;\" id=\"countryTitle\"><\/h3>\r\n\r\n<figure class=\"highcharts-figure\">\r\n   <div id=\"loader\" style=\"display: flex; text-align: center; padding: 20px;\">\r\n    <\/div>\r\n    <div id=\"meteogram\" style=\"height: 410px\">\r\n       \r\n    <\/div>\r\n  \r\n<\/figure>\r\n\r\n\r\n<script>\r\n\r\n\r\n    function showLoader() {\r\n    document.getElementById('loader').style.display = 'block';\r\n    }\r\n    \r\n    function hideLoader() {\r\n    document.getElementById('loader').style.display = 'none';\r\n    }\r\n\r\n     const cityTitles = {\r\n        'Almaty': '\u0410\u043b\u043c\u0430\u0442\u044b, \u041a\u0430\u0437\u0430\u0445\u0441\u0442\u0430\u043d',\r\n        'Ashgabat': '\u0410\u0448\u0445\u0430\u0431\u0430\u0434, \u0422\u0443\u0440\u043a\u043c\u0435\u043d\u0438\u0441\u0442\u0430\u043d',\r\n        'Astana': '\u0410\u0441\u0442\u0430\u043d\u0430, \u041a\u0430\u0437\u0430\u0445\u0441\u0442\u0430\u043d',\r\n        'Bishkek': '\u0411\u0438\u0448\u043a\u0435\u043a, \u041a\u044b\u0440\u0433\u044b\u0437\u0441\u0442\u0430\u043d',\r\n        'Dushanbe': '\u0414\u0443\u0448\u0430\u043d\u0431\u0435, \u0422\u0430\u0434\u0436\u0438\u043a\u0438\u0441\u0442\u0430\u043d',\r\n        'Tashkent': '\u0422\u0430\u0448\u043a\u0435\u043d\u0442, \u0423\u0437\u0431\u0435\u043a\u0438\u0441\u0442\u0430\u043d'\r\n    };\r\n\r\n    const updateCityTitle = (city) => {\r\n       document.getElementById('countryTitle').innerText = cityTitles[city] || '';\r\n    };\r\n    \r\n        \r\n\/\/   const getWeatherIcon = (weatherString) => {\r\n\/\/     console.log(\"Weather String:\", weatherString); \/\/ Log each condition string to verify it's correct\r\n\/\/     if (!weatherString) return ''; \/\/ Return empty string if no valid condition string\r\n\r\n\/\/     const icon = (function () {\r\n\/\/         switch (weatherString) {\r\n\/\/             case 'Cloudy':\r\n\/\/                 return '04';\r\n\/\/             case 'Overcast':\r\n\/\/                 return '04';\r\n\/\/             case 'Cloudy snow':\r\n\/\/                 return '49';\r\n\/\/             case 'Overcast snow':\r\n\/\/                 return '49';\r\n\/\/             case 'Overcast snow continuous':\r\n\/\/                 return '49';\r\n\/\/             case 'Scattered clouds':\r\n\/\/                 return '03d';\r\n\/\/             case 'Broken clouds':\r\n\/\/                 return '03d';\r\n\/\/             case 'Overcast rain':\r\n\/\/                 return '09';\r\n\/\/             case 'Overcast clouds':\r\n\/\/                 return '04';\r\n\/\/             case 'Overcast mist':\r\n\/\/                 return '15';\r\n\/\/             case 'Light shower rain':\r\n\/\/                 return '40d';\r\n\/\/             case 'Moderate rain':\r\n\/\/                 return '09';\r\n\/\/             case 'Heavy rain':\r\n\/\/                 return '10';\r\n\/\/             case 'fog':\r\n\/\/                 return '15';\r\n\/\/             case 'Few clouds mist':\r\n\/\/                 return '15';\r\n\/\/             case 'Clear mist':\r\n\/\/                 return '15';\r\n\/\/             case 'Cloudy mist':\r\n\/\/                 return '15';\r\n\/\/             case 'Scattered clouds mist':\r\n\/\/                 return '15';\r\n\/\/             case 'Few clouds':\r\n\/\/                 return '02d';\r\n\/\/             case 'Cloudy fog':\r\n\/\/                 return '15';  \r\n\/\/             case 'Cloudy, haze':\r\n\/\/                 return '03d';  \r\n\/\/             case 'Overcast, ice pellets':\r\n\/\/                 return '12'; \r\n\/\/             default:\r\n\/\/                 return ''; \/\/ Return empty string if no matching condition\r\n\/\/         }\r\n\/\/     })();\r\n\r\n\/\/     console.log(\"Weather Icon for condition\", weatherString, \"is\", icon); \/\/ Log icon result for each condition\r\n\/\/     return icon;\r\n\/\/ };\r\n\r\n     function getWeatherIcon(weatherString) {\r\n    const icons = {\r\n        'Clear sky': '2600',\r\n        'Cloudy': '2601', \/\/ \u2601\ufe0f\r\n        'Cloudy snow': '1F328', \/\/ \ud83c\udf28\ufe0f\r\n        'Overcast': '2601', \/\/ \u2601\ufe0f\r\n        'Overcast snow': '1F328', \/\/ \ud83c\udf28\ufe0f\r\n        'Scattered clouds': '26C5', \/\/ \u26c5\r\n        'Broken clouds': '26C5', \/\/ \u26c5\r\n        'Clear mist': '1F32B', \/\/ \ud83c\udf2b\ufe0f\r\n        'Few clouds': '1F324', \/\/ \ud83c\udf24\ufe0f\r\n        'Cloudy haze': '1F32B', \/\/ \ud83c\udf2b\ufe0f\r\n        'Cloudy fog': '1F32B', \/\/ \ud83c\udf2b\ufe0f\r\n        'Overcast ice pellets': '2744', \/\/ \u2744\ufe0f\r\n        'Heavy rain': '1F327' \/\/ \ud83c\udf27\ufe0f\r\n    };\r\n    return icons[weatherString] || ''; \/\/ Return empty string if no match\r\n}\r\n \r\n\r\n     \/\/ Fetch and parse the new data format\r\n  async function fetchMeteogramData(year, month, city) {\r\n    showLoader();  \r\n    const apiUrl = `https:\/\/api.weather.centralasiaclimateportal.org\/weatherapi\/get?country=${city}&year=${year}&month=${month}`;\r\n    \r\n    function safeParseFloat(value) {\r\n        return (value !== null && value !== undefined && !isNaN(parseFloat(value))) ? parseFloat(value) : null;\r\n    }\r\n\r\n    try {\r\n        const response = await fetch(apiUrl, {\r\n            cache: 'no-store',\r\n            credentials: 'include', \r\n        });\r\n\r\n        if (!response.ok) throw new Error('Network response was not ok');\r\n\r\n        const rawData = await response.json();\r\n        console.log('Raw Data:', rawData);\r\n        \/\/ Parse the data into Highcharts format\r\n        const temperatureData = [];\r\n        const precipitationData = [];\r\n        const pressureData = [];\r\n        const windData = [];        \r\n        const lowestTempData = [];  \r\n        const weatherSymbols = [];   \r\n        \r\n        const conditionsData = [];\r\n\r\n        rawData.forEach(entry => {\r\n            const [day, monthStr, yearStr] = entry.Date.split(\"-\");\r\n            const utcTime = entry.UTC_time || 0;\r\n            const dateObj = new Date(Date.UTC(+yearStr, +monthStr - 1, +day, utcTime));\r\n\r\n            temperatureData.push([dateObj.getTime(), entry.Temp !== null ? parseFloat(entry.Temp) : null]);\r\n            precipitationData.push([dateObj.getTime(), entry.Prec !== null ? parseFloat(entry.Prec) : null]);\r\n            pressureData.push([dateObj.getTime(), entry.Pressure !== null ? parseFloat(entry.Pressure) : null]);\r\n\r\n            \/\/ Wind data (speed and direction)\r\n            windData.push([dateObj.getTime(), entry.Wins_speed || 0, entry.Wind_dir || 0]);  \/\/ Wind speed + wind direction\r\n\r\n            \/\/ Minimum temperature\r\n            lowestTempData.push([dateObj.getTime(), entry.Min_temp !== null ? parseFloat(entry.Min_temp) : null]);\r\n\r\n            \/\/ Convert cloud data (Clouds) to a numerical value (e.g., fractional coverage 0-8)\r\n            const cloudCoverage = parseFloat(entry.Clouds.split(\"\/\")[0]) || 0; \r\n            weatherSymbols.push(cloudCoverage);\r\n            \r\n            \/\/  console.log('Conditions:', entry.Conditions);\r\n\r\n            \/\/ Push the 'Conditions' data to conditionsData\r\n              conditionsData.push(entry.Conditions); \r\n            \/\/ console.log(\"Conditions Data:\", conditionsData);\r\n        });\r\n\r\n        \/\/ Now pass all the required data to the render function, including conditionsData\r\n        renderMeteogram(temperatureData, precipitationData, pressureData, windData, lowestTempData, weatherSymbols, conditionsData);\r\n\r\n    } catch (error) {\r\n        hideLoader(); \r\n\r\n        const errorElement = document.getElementById(\"meteogram\");\r\n        if (errorElement) {\r\n            errorElement.innerHTML = `<p style=\"color: black; font-weight: bold; text-align: center; font-size: 20px\">N\/A<\/p>`;\r\n        }\r\n    } finally {\r\n        hideLoader(); \r\n    }\r\n}\r\n\r\n   \r\n    function renderMeteogram(temperatureData, precipitationData, pressureData, windData, lowestTempData, weatherSymbols, conditionsData) {\r\n        \r\n        \r\n      const minTemp = Math.min(...temperatureData.map(t => t[1] ?? Infinity));\r\n    const offsetY = Math.max(minTemp - 2, -10); \/\/ never push too far down   \r\n    console.log(\"Conditions Data before rendering:\", conditionsData); \r\n        \r\n    Highcharts.chart('meteogram', {\r\n        chart: { zoomType: 'x' },\r\n        title: { text: '' },\r\n        xAxis: {\r\n            type: 'datetime',\r\n            tickInterval: 36e5 * 24, \/\/ One day interval\r\n            labels: { format: '{value:%e %b}' }\r\n        },\r\n          yAxis: [{\r\n    title: { text: 'Temperature (\u00b0C)' },\r\n    opposite: false, \/\/ Left axis for temperature\r\n    min: Math.min(...temperatureData.map(item => item[1])) - 5, \r\n    max: Math.max(...temperatureData.map(item => item[1])) + 5, \r\n    labels: {\r\n        formatter: function() {\r\n            return this.value.toFixed(2);\r\n        }\r\n    }\r\n    }, {\r\n        title: { text: 'Precipitation (mm)' },\r\n        opposite: true, \/\/ Right axis for precipitation\r\n        min: Math.min(...precipitationData.map(item => item[1])) - 5, \r\n        max: Math.max(...precipitationData.map(item => item[1])) + 5, \r\n        labels: {\r\n            formatter: function() {\r\n                return this.value.toFixed(2);\r\n            }\r\n        }\r\n    }, {\r\n        title: { text: 'Pressure (hPa)' },\r\n        opposite: true, \/\/ Right axis for pressure\r\n        min: Math.min(...pressureData.map(item => item[1])) - 5, \r\n        max: Math.max(...pressureData.map(item => item[1])) + 5, \r\n        labels: {\r\n            formatter: function() {\r\n                return this.value.toFixed(2);\r\n            }\r\n        }\r\n    }, {\r\n        title: { text: 'Wind Direction (\u00b0)' },\r\n        opposite: false, \/\/ Left axis for wind direction\r\n        min: 0, \/\/ Min value for wind direction\r\n        max: 360, \/\/ Max value for wind direction\r\n        tickInterval: 45, \r\n        labels: {\r\n            formatter: function() {\r\n                return this.value + '\u00b0'; \/\/ Format as degrees\r\n            }\r\n        }\r\n    },\r\n      { \r\n        title: { text: 'Cloud Coverage (oktas)' },\r\n        min: 0,\r\n        max: 8,\r\n        opposite: true,\r\n        labels: { format: '{value}' }\r\n      }\r\n    \r\n    ],\r\n        tooltip: {\r\n            style: {\r\n            zIndex: 1000 \/\/ Ensure tooltip appears above icons\r\n             },\r\n            shared: true,\r\n             formatter: function () {\r\n        \/\/ Format the tooltip title\r\n        var tooltipTitle = this.points[0].key;  \/\/ Using the X value (date) for the tooltip title\r\n        var tooltipContent = `<strong>${Highcharts.dateFormat('%e %b %Y', tooltipTitle)}<\/strong><br\/>`; \/\/ Format the date as desired\r\n        \r\n        \/\/ Loop through each series in the tooltip to get the data\r\n        this.points.forEach(function (point) {\r\n            var seriesName = point.series.name;\r\n            var yValue = Highcharts.numberFormat(point.y, 2);  \/\/ Round the value to 2 decimals\r\n            tooltipContent += `${seriesName}: ${yValue} \u00b0C<br\/>`;  \/\/ Add each series' value\r\n        });\r\n\r\n        return tooltipContent;  \/\/ Return the custom tooltip content\r\n        }\r\n            \r\n        },\r\n        series: [{\r\n            name: 'Temperature',\r\n            type: 'spline',\r\n            data: temperatureData,\r\n            yAxis: 0,\r\n            color: '#FF3333',\r\n            tooltip: { valueSuffix: ' \u00b0C' },\r\n            connectNulls: true \r\n        }, {\r\n            name: 'Precipitation',\r\n            type: 'column',\r\n            data: precipitationData,\r\n            yAxis: 1,\r\n            color: '#68CFE8',\r\n            tooltip: { valueSuffix: ' mm' },\r\n            connectNulls: true \r\n        }, {\r\n            name: 'Pressure',\r\n            type: 'spline',\r\n            data: pressureData,\r\n            yAxis: 2,\r\n            dashStyle: 'ShortDot',\r\n            color: '#333',\r\n            tooltip: { valueSuffix: ' hPa' },\r\n            connectNulls: true \r\n        }, {\r\n            name: 'Wind Direction',\r\n            type: 'line',\r\n            data: windData.map((entry, i) => {\r\n                const direction = entry[2]; \r\n                return [entry[0], direction];\r\n            }), \r\n            yAxis: 3,\r\n            color: '#3e8c2a', \r\n              tooltip: { valueSuffix: ' \u00b0' },\r\n            \/\/ tooltip: {\r\n            \/\/     pointFormat: 'Wind Direction: {point.y}\u00b0',\r\n            \/\/ },\r\n            \/\/ marker: {\r\n            \/\/     symbol: 'triangle', marker\r\n            \/\/     radius: 5,\r\n            \/\/     fillColor: '#ff6600' \r\n            \/\/ },\r\n            connectNulls: true \r\n        }, {\r\n            name: 'Cloud Coverage',\r\n            type: 'scatter',\r\n            data: weatherSymbols.map((coverage, i) => [temperatureData[i][0], coverage]),  \r\n            marker: {\r\n                symbol: 'circle',\r\n                radius: 6,\r\n                fillColor: '#6fa3ff'  \r\n            },\r\n            tooltip: { \r\n                pointFormat: 'Cloud Coverage: {point.y} oktas'\r\n            },\r\n            yAxis: 4 \r\n        },{\r\n            name: 'Weather Conditions',\r\n            type: 'scatter',\r\n            data: conditionsData.map((condition, i) => ({\r\n                x: temperatureData[i][0], \r\n                y: minTemp - 1, \/\/ Keep at 0 for alignment\r\n                condition: condition\r\n            })),\r\n            marker: {\r\n                enabled: false \/\/ Hide default dots\r\n            },\r\n            tooltip: {\r\n                pointFormat: 'Condition: {point.condition}' \/\/ Show text description\r\n            },\r\n            dataLabels: {\r\n                enabled: true,\r\n                useHTML: true, \/\/ Allow HTML rendering for icons\r\n                y: minTemp - 1,\r\n                formatter: function () {\r\n                    \/\/ const iconCode = getWeatherIcon(this.point.condition); \/\/ Fetch correct icon code\r\n                    \/\/ if (iconCode) {\r\n                    \/\/     return `<span style=\"font-size: 20px;\">&#x${iconCode};<\/span>`; \/\/ Use Unicode icons\r\n                    \/\/ }\r\n                    \/\/ return ''; \/\/ Hide if no icon found\r\n                     console.log(\"Rendering label for condition:\", this.point.condition);\r\n                      const iconCode = getWeatherIcon(this.point.condition);\r\n                      console.log(\"\u2192 got iconCode:\", iconCode);\r\n                      if (!iconCode) return '';\r\n                      const emoji = String.fromCodePoint(parseInt(iconCode, 16)) + '\\uFE0F';\r\n                      return `<span style=\"font-size: 20px;\">${emoji}<\/span>`;\r\n                }\r\n            }\r\n        }\r\n                \r\n        ]\r\n    });\r\n}\r\n\r\n    function onSelectionChange() {\r\n    const year = document.getElementById('yearSelect').value;\r\n    const month = document.getElementById('monthSelect').value;\r\n    const city = document.getElementById('countrySelect').value; \r\n\r\n    \/\/ Update the title properly\r\n    document.getElementById('countryTitle').innerText = cityTitles[city] || '';\r\n    \r\n    \/\/ Fetch data for the selected city, month, year\r\n    fetchMeteogramData(year, month, city);\r\n    }\r\n\r\n    document.getElementById('yearSelect').addEventListener('change', onSelectionChange);\r\n    document.getElementById('monthSelect').addEventListener('change', onSelectionChange);\r\n    document.getElementById('countrySelect').addEventListener('change', onSelectionChange);\r\n\r\n    \/\/ Initial Load\r\n       document.addEventListener('DOMContentLoaded', () => {\r\n        document.getElementById('yearSelect').value = '2025';\r\n        document.getElementById('monthSelect').value = '12';\r\n        document.getElementById('countrySelect').value = 'Almaty'; \r\n        onSelectionChange();\r\n    });\r\n    \r\n    console.log(`Fetching data for ${city}, ${month} ${year}`);\r\n   \r\n   \r\n    \r\n\r\n\tfunction Meteogram(json, container) {\r\n\t\r\n\t\tthis.symbols = [];\r\n\t\tthis.precipitations = [];\r\n\t\tthis.precipitationsError = []; \/\/ Only for some data sets\r\n\t\tthis.winds = [];\r\n\t\tthis.temperatures = [];\r\n\t\tthis.pressures = [];\r\n\t\tthis.lowestTemp = [];\r\n\r\n\t\t\r\n\t\tthis.json = json;\r\n\t\tthis.container = container;\r\n\r\n\t\tthis.parseYrData();\r\n\t}\r\n\r\n\t\/**\r\n\t * Mapping of the symbol code in yr.no's API to the icons in their public\r\n\t * GitHub repo, as well as the text used in the tooltip.\r\n\t *\r\n\t * https:\/\/api.met.no\/weatherapi\/weathericon\/2.0\/documentation\r\n\t *\/\r\n\t\/\/ Meteogram.dictionary = newDictionary;\r\n\r\n\t\/**\r\n\t * Draw the weather symbols on top of the temperature series. The symbols are\r\n\t * fetched from yr.no's MIT licensed weather symbol collection.\r\n\t * https:\/\/github.com\/YR\/weather-symbols\r\n\t *\/\r\n    Meteogram.prototype.drawWeatherSymbols = function (chart) {\r\n        const symbols = this.symbols;\r\n        const xAxis = chart.xAxis[0];\r\n    \r\n        this.temperatures.forEach((point, i) => {\r\n            const x = xAxis.toPixels(point.x);\r\n            const y = chart.plotTop + chart.plotHeight + 40; \/\/ Position below plot\r\n    \r\n            chart.renderer.text(symbols[i], x - 15, y)  \/\/ Adjust x shift for centering\r\n                .attr({\r\n                    zIndex: 5,\r\n                    fill: '#333',\r\n                    'font-size': '10px'\r\n                })\r\n                .add();\r\n        });\r\n    };\r\n\r\n\t\/**\r\n\t * Draw blocks around wind arrows, below the plot area\r\n\t *\/\r\n\t\/\/ eslint-disable-next-line func-names\r\n\tMeteogram.prototype.drawBlocksForWindArrows = function (chart) {\r\n\t\tconst xAxis = chart.xAxis[0];\r\n\t\tconst interval = 24 * 3600 * 1000;\r\n\t\tfor (\r\n\t\t\tlet pos = xAxis.min, { max } = xAxis, i = 0;\r\n\t\t\tpos <= max + interval; pos += interval,\r\n\t\t\ti += 1\r\n\t\t) {\r\n\t\t\t\/\/ Get the X position\r\n\t\t\tconst isLast = pos === max + interval;\r\n\t\t\tconst x = Math.round(xAxis.toPixels(pos)) + (isLast ? 0.5 : -0.5);\r\n\r\n\t\t\t\/\/ Draw the vertical dividers and ticks\r\n\t\t\tconst isLong = true;\r\n\t\t\tchart.renderer\r\n\t\t\t\t.path([\r\n\t\t\t\t\t'M', x, chart.plotTop + chart.plotHeight + (isLong ? 0 : 28),\r\n\t\t\t\t\t'L', x, chart.plotTop + chart.plotHeight + 32,\r\n\t\t\t\t\t'Z',\r\n\t\t\t\t])\r\n\t\t\t\t.attr({\r\n\t\t\t\t\tstroke: chart.options.chart.plotBorderColor,\r\n\t\t\t\t\t'stroke-width': 1,\r\n\t\t\t\t})\r\n\t\t\t\t.add();\r\n\t\t}\r\n\r\n\t\t\/\/ Center items in block\r\n\t\t\/\/ chart.get('windbarbs').markerGroup.attr({\r\n\t\t\/\/ \ttranslateX: chart.get('windbarbs').markerGroup.translateX + 8,\r\n\t\t\/\/ });\r\n\t};\r\n\r\n\t\/**\r\n\t * Build and return the Highcharts options structure\r\n\t *\/\r\n\tMeteogram.prototype.getChartOptions = function () {\r\n\t\treturn {\r\n\t\t\tchart: {\r\n\t\t\t\trenderTo: this.container,\r\n\t\t\t\tmarginBottom: 70,\r\n\t\t\t\tmarginRight: 40,\r\n\t\t\t\tmarginTop: 50,\r\n\t\t\t\tplotBorderWidth: 1,\r\n\t\t\t\theight: 410,\r\n\t\t\t\talignTicks: false,\r\n\t\t\t\tscrollablePlotArea: {\r\n\t\t\t\t\tminWidth: 720,\r\n\t\t\t\t},\r\n\t\t\t\tzooming: {\r\n\t\t\t\t\ttype: \"x\",\r\n\t\t\t\t\tmouseWheel: {\r\n\t\t\t\t\t\tenabled: true,\r\n\t\t\t\t\t\ttype: \"x\",\r\n\t\t\t\t\t}\r\n\t\t\t\t}\r\n\r\n\t\t\t},\r\n\t\t\tdefs: {\r\n\t\t\t\tpatterns: [{\r\n\t\t\t\t\tid: 'precipitation-error',\r\n\t\t\t\t\tpath: {\r\n\t\t\t\t\t\td: [\r\n\t\t\t\t\t\t\t'M', 3.3, 0, 'L', -6.7, 10,\r\n\t\t\t\t\t\t\t'M', 6.7, 0, 'L', -3.3, 10,\r\n\t\t\t\t\t\t\t'M', 10, 0, 'L', 0, 10,\r\n\t\t\t\t\t\t\t'M', 13.3, 0, 'L', 3.3, 10,\r\n\t\t\t\t\t\t\t'M', 16.7, 0, 'L', 6.7, 10,\r\n\t\t\t\t\t\t].join(' '),\r\n\t\t\t\t\t\tstroke: '#68CFE8',\r\n\t\t\t\t\t\tstrokeWidth: 1,\r\n\t\t\t\t\t},\r\n\t\t\t\t}],\r\n\t\t\t},\r\n\t\t\ttitle: {\r\n\t\t\t\ttext: '',\r\n\t\t\t\talign: 'left',\r\n\t\t\t\tstyle: {\r\n\t\t\t\t\twhiteSpace: 'nowrap',\r\n\t\t\t\t\ttextOverflow: 'ellipsis',\r\n\t\t\t\t},\r\n\t\t\t},\r\n\t\t\t\/\/ credits: {\r\n\t\t\t\/\/ \ttext: 'Forecast from <a href=\"https:\/\/yr.no\">yr.no<\/a>',\r\n\t\t\t\/\/ \thref: 'https:\/\/yr.no',\r\n\t\t\t\/\/ \tposition: {\r\n\t\t\t\/\/ \t\tx: -40,\r\n\t\t\t\/\/ \t},\r\n\t\t\t\/\/ },\r\n\t\t\ttooltip: {\r\n\t\t\t\tshared: true,\r\n\t\t\t\tuseHTML: true,\r\n\t\t\t\theaderFormat:\r\n\t\t\t\t\t'<small>{point.x:%A, %b %e, %H:%M}<\/small><br>' +\r\n\t\t\t\t\t'<b>{point.point.symbolName}<\/b><br>',\r\n\r\n\t\t\t},\r\n\t\t\txAxis: [{ \/\/ Bottom X axis\r\n\t\t\t\ttype: 'datetime',\r\n\t\t\t\ttickInterval: 36e5, \/\/ two hours\r\n\t\t\t\tminorTickInterval: 18e5, \/\/ one hour\r\n\t\t\t\ttickLength: 0,\r\n\t\t\t\tgridLineWidth: 1,\r\n\t\t\t\tgridLineColor: 'rgba(128, 128, 128, 0.1)',\r\n\t\t\t\tstartOnTick: false,\r\n\t\t\t\tendOnTick: false,\r\n\t\t\t\tminPadding: 0,\r\n\t\t\t\tmaxPadding: 0,\r\n\t\t\t\toffset: 30,\r\n\t\t\t\tshowLastLabel: true,\r\n\t\t\t\tlabels: {\r\n\t\t\t\t\tformat: '{ }',\r\n\t\t\t\t},\r\n\t\t\t\tcrosshair: true,\r\n\t\t\t}, { \/\/ Top X axis\r\n\t\t\t\tlinkedTo: 0,\r\n\t\t\t\ttype: 'datetime',\r\n\t\t\t\ttickInterval: 24 * 3600 * 1000,\r\n\t\t\t\tlabels: {\r\n\t\t\t\t\tformat: '{value:<span style=\"font-size: 12px; font-weight: bold\">%a<\/span> %b %e}',\r\n\t\t\t\t\talign: 'left',\r\n\t\t\t\t\tx: 3,\r\n\t\t\t\t\ty: 8,\r\n\t\t\t\t},\r\n\t\t\t\topposite: true,\r\n\t\t\t\ttickLength: 20,\r\n\t\t\t\tgridLineWidth: 1,\r\n\t\t\t}],\r\n\t\t\tyAxis: [{ \/\/ temperature axis\r\n\t\t\t\ttitle: {\r\n\t\t\t\t\ttext: null,\r\n\t\t\t\t},\r\n\t\t\t\tlabels: {\r\n\t\t\t\t\tformat: '{value}\u00b0',\r\n\t\t\t\t\tstyle: {\r\n\t\t\t\t\t\tfontSize: '10px',\r\n\t\t\t\t\t},\r\n\t\t\t\t\tx: -3,\r\n\t\t\t\t},\r\n\t\t\t\tplotLines: [{ \/\/ zero plane\r\n\t\t\t\t\tvalue: 0,\r\n\t\t\t\t\tcolor: '#BBBBBB',\r\n\t\t\t\t\twidth: 1,\r\n\t\t\t\t\tzIndex: 2,\r\n\t\t\t\t}],\r\n\t\t\t\tmaxPadding: 0.3,\r\n\t\t\t\tminRange: 8,\r\n\t\t\t\ttickInterval: 1,\r\n\t\t\t\tgridLineColor: 'rgba(128, 128, 128, 0.1)',\r\n\r\n\t\t\t}, { \/\/ precipitation axis\r\n\t\t\t\ttitle: {\r\n\t\t\t\t\ttext: null,\r\n\t\t\t\t},\r\n\t\t\t\tlabels: {\r\n\t\t\t\t\tenabled: false,\r\n\t\t\t\t},\r\n\t\t\t\tgridLineWidth: 0,\r\n\t\t\t\ttickLength: 0,\r\n\t\t\t\tminRange: 10,\r\n\t\t\t\tmin: 0,\r\n\r\n\t\t\t}, { \/\/ Air pressure\r\n\t\t\t\tallowDecimals: false,\r\n\t\t\t\ttitle: { \/\/ Title on top of axis\r\n\t\t\t\t\ttext: 'hPa',\r\n\t\t\t\t\toffset: 0,\r\n\t\t\t\t\talign: 'high',\r\n\t\t\t\t\trotation: 0,\r\n\t\t\t\t\tstyle: {\r\n\t\t\t\t\t\tfontSize: '10px',\r\n\t\t\t\t\t\tcolor: Highcharts.getOptions().colors[2],\r\n\t\t\t\t\t},\r\n\t\t\t\t\ttextAlign: 'left',\r\n\t\t\t\t\tx: 3,\r\n\t\t\t\t},\r\n\t\t\t\tlabels: {\r\n\t\t\t\t\tstyle: {\r\n\t\t\t\t\t\tfontSize: '8px',\r\n\t\t\t\t\t\tcolor: Highcharts.getOptions().colors[2],\r\n\t\t\t\t\t},\r\n\t\t\t\t\ty: 2,\r\n\t\t\t\t\tx: 3,\r\n\t\t\t\t},\r\n\t\t\t\tgridLineWidth: 0,\r\n\t\t\t\topposite: true,\r\n\t\t\t\tshowLastLabel: false,\r\n\t\t\t}],\r\n\r\n\t\t\tlegend: {\r\n\t\t\t\tenabled: true,\r\n\t\t\t\tlayout: 'horizontal',\r\n\t\t\t\talign: 'left',\r\n\t\t\t\tverticalAlign: 'bottom',\r\n\t\t\t},\r\n\r\n\t\t\tplotOptions: {\r\n\t\t\t\tseries: {\r\n\t\t\t\t\tpointPlacement: 'between',\r\n\t\t\t\t},\r\n\t\t\t},\r\n\r\n\t\t\tseries: [{\r\n\t\t\t\tname: 'Temperature',\r\n\t\t\t\tdata: this.temperatures,\r\n\t\t\t\ttype: 'spline',\r\n\t\t\t\tmarker: {\r\n\t\t\t\t\tenabled: false,\r\n\t\t\t\t\tstates: {\r\n\t\t\t\t\t\thover: {\r\n\t\t\t\t\t\t\tenabled: true,\r\n\t\t\t\t\t\t},\r\n\t\t\t\t\t},\r\n\t\t\t\t},\r\n\t\t\t\ttooltip: {\r\n\t\t\t\t\tpointFormat: '<span style=\"color:{point.color}\">\\u25CF<\/span> ' +\r\n\t\t\t\t\t\t'{series.name}: <b>{point.y}\u00b0C<\/b><br\/>',\r\n\t\t\t\t},\r\n\t\t\t\tzIndex: 1,\r\n\t\t\t\tcolor: '#FF3333',\r\n\t\t\t\tnegativeColor: '#48AFE8',\r\n\t\t\t}, {\r\n\t\t\t\tname: 'Precipitation',\r\n\t\t\t\tdata: this.precipitations, \/\/ Use only this series for precipitation\r\n\t\t\t\ttype: 'column',\r\n\t\t\t\tcolor: '#68CFE8',\r\n\t\t\t\tyAxis: 1,\r\n\t\t\t\tgroupPadding: 0,\r\n\t\t\t\tpointPadding: 0,\r\n\t\t\t\ttooltip: {\r\n\t\t\t\t\tvalueSuffix: ' mm',\r\n\t\t\t\t\tpointFormat: '<span style=\"color:{point.color}\">\\u25CF<\/span> ' +\r\n\t\t\t\t\t\t'{series.name}: <b>{point.y} <\/b><br\/>',\r\n\t\t\t\t},\r\n\t\t\t\tgrouping: false,\r\n\t\t\t\tdataLabels: {\r\n\t\t\t\t\tenabled: false,\r\n\t\t\t\t\t}\r\n\t\t\t\t}, {\r\n\t\t\t\tname: 'Air pressure',\r\n\t\t\t\tcolor: Highcharts.getOptions().colors[2],\r\n\t\t\t\tdata: this.pressures,\r\n\t\t\t\tmarker: {\r\n\t\t\t\t\tenabled: false,\r\n\t\t\t\t},\r\n\t\t\t\tshadow: false,\r\n\t\t\t\ttooltip: {\r\n\t\t\t\t\tvalueSuffix: ' hPa',\r\n\t\t\t\t},\r\n\t\t\t\tdashStyle: 'shortdot',\r\n\t\t\t\tyAxis: 2,\r\n\t\t\t}, {\r\n\t\t\t\tname: 'Lowest Temperature',\r\n\t\t\t\tcolor: Highcharts.getOptions().colors[3],\r\n\t\t\t\tdata: this.lowestTemp,\r\n\t\t\t\tmarker: {\r\n\t\t\t\t\tenabled: false,\r\n\t\t\t\t},\r\n\t\t\t\tshadow: false,\r\n\t\t\t\ttooltip: {\r\n\t\t\t\t\tvalueSuffix: ' C',\r\n\t\t\t\t},\r\n\t\t\t\tdashStyle: 'shortdot',\r\n\t\t\t\tyAxis: 1,\r\n\t\t\t},\r\n\t\t\t{\r\n\t\t\t\tname: 'Wind',\r\n\t\t\t\ttype: 'windbarb',\r\n\t\t\t\tid: 'windbarbs',\r\n\t\t\t\tcolor: Highcharts.getOptions().colors[1],\r\n\t\t\t\tlineWidth: 1.5,\r\n\t\t\t\tdata: this.winds,\r\n\t\t\t\tvectorLength: 18,\r\n\t\t\t\tyOffset: -15,\r\n\t\t\t\ttooltip: {\r\n\t\t\t\t\tvalueSuffix: ' m\/s',\r\n\t\t\t\t},\r\n\t\t\t},\r\n\t\t\t],\r\n\t\t};\r\n\t};\r\n\r\n\t\/**\r\n\t * Post-process the chart from the callback function, the second argument\r\n\t * Highcharts.Chart.\r\n\t *\/\r\n\tMeteogram.prototype.onChartLoad = function (chart) {\r\n\t\tthis.drawWeatherSymbols(chart);\r\n\t\tthis.drawBlocksForWindArrows(chart);\r\n\t};\r\n\r\n\t\/**\r\n\t * Create the chart. This function is called async when the data file is loaded\r\n\t * and parsed.\r\n\t *\/\r\n\tMeteogram.prototype.createChart = function () {\r\n\t\tthis.chart = new Highcharts.Chart(this.getChartOptions(), (chart) => {\r\n\t\t\tthis.onChartLoad(chart);\r\n\t\t});\r\n\t};\r\n\r\n\tMeteogram.prototype.error = function () {\r\n\t\tdocument.getElementById('loading').innerHTML =\r\n\t\t\t'<i class=\"fa fa-frown-o\"><\/i> Failed loading data, please try again later';\r\n\t};\r\n\r\n\t\/**\r\n\t * Handle the data. This part of the code is not Highcharts specific, but deals\r\n\t * with yr.no's specific data format\r\n\t *\/\r\n\tMeteogram.prototype.parseYrData = function () {\r\n\r\n\r\n\r\n\t\tif (!this.json) {\r\n\t\t\treturn this.error();\r\n\t\t}\r\n\r\n\t\t\/\/ Loop over hourly (or 6-hourly) forecasts\r\n\t\tthis.json.forEach((node) => {\r\n\r\n\t\t\tconst parts = node.Date.split('\/');\r\n\t\t\tconst us_date = parts[2] + '-' + parts[1] + '-' + parts[0];\r\n\t\t\tconst dateObject = new Date(Date.parse(us_date));\r\n\t\t\tdateObject.setHours(node.UTC_time);\r\n\t\t\tconsole.log(dateObject)\r\n\t\t\tconst x = Date.parse(dateObject);\r\n\t\t\tconsole.log(x)\r\n\t\t\tconsole.log(new Date(x).toDateString())\r\n\r\n\t\t\t\/*\r\n                  nextHours = node.data.next_1_hours || node.data.next_6_hours,\r\n                  symbolCode = nextHours && nextHours.summary.symbol_code,\r\n                  to = node.data.next_1_hours ? x + 36e5 : x + 6 * 36e5;\r\n\r\n              if (to > pointStart + 48 * 36e5) {\r\n                  return;\r\n              } *\/\r\n\r\n\t\t\t\t\/\/ Populate the parallel arrays\r\n\t\t\t\tthis.symbols.push(node.Conditions);\r\n\t\t\t\/\/ this.symbols.push(node.data.instant.symbol_code);\r\n\r\n\t\t\tthis.temperatures.push({\r\n\t\t\t\tx,\r\n\t\t\t\ty: changeStringToZero(node.Temp),\r\n\t\t\t\t\/\/ custom options used in the tooltip formatter\r\n\t\t\t\t\/\/ to,\r\n\t\t\t\t\/\/ symbolName: Meteogram.dictionary[\r\n\t\t\t\t\/\/ \tsymbolCode.replace(\/_(day|night)$\/, '')\r\n\t\t\t\t\/\/ ].text,\r\n\t\t\t});\r\n\r\n\t\t\tthis.precipitations.push({\r\n\t\t\t\tx,\r\n\t\t\t\ty: changeStringToZero(node.Prec),\r\n\t\t\t});\r\n\r\n\t\t\tthis.lowestTemp.push({\r\n\t\t\t\tx,\r\n\t\t\t\ty: changeStringToZero(node.Min_temp),\r\n\t\t\t});\r\n\r\n\t\t\t\/\/ if (i % 2 === 0) {\r\n\t\t\t\/\/ \tthis.winds.push({\r\n\t\t\t\/\/ \t\tx,\r\n\t\t\t\/\/ \t\tvalue: node.wind_spd,\r\n\t\t\t\/\/ \t\tdirection: node.wind_dir,\r\n\t\t\t\/\/ \t});\r\n\t\t\t\/\/ }\r\n\r\n\t\t\tthis.winds.push({\r\n\t\t\t\tx,\r\n\t\t\t\tvalue: changeStringToZero(node.Wins_speed),\r\n\t\t\t\tdirection: changeStringToZero(node.Wind_dir),\r\n\t\t\t});\r\n\t\t\tthis.pressures.push({\r\n\t\t\t\tx,\r\n\t\t\t\ty: changeStringToZero(node.Pressure),\r\n\t\t\t});\r\n\r\n\t\t\t\/\/ if (i === 0) {\r\n\t\t\t\/\/ \tpointStart = (x + to) \/ 2;\r\n\t\t})\r\n\r\n\t\t\/\/ Create the chart when the data is loaded\r\n\t\tthis.createChart();\r\n\t};\r\n\r\n\r\n\/\/ On DOM ready...\r\n\r\n\/\/ Set the hash to the yr.no URL we want to parse\r\n\/\/ if (!location.hash) {\r\n\/\/     location.hash = '\/wp-content\/uploads\/2024\/07\/tashkentApril.json';\r\n\/\/ }\r\n\r\n\/\/ const url = location.hash.substr(1);\r\n\/\/ Highcharts.ajax({\r\n\/\/     url,\r\n\/\/     dataType: 'json',\r\n\/\/     success: json => {\r\n\/\/         window.meteogram = new Meteogram(json, 'tashkentMeteogram');\r\n\/\/     },\r\n\/\/     error: Meteogram.prototype.error,\r\n\/\/     headers: {\r\n\/\/         \/\/ Override the Content-Type to avoid preflight problems with CORS\r\n\/\/         \/\/ in the Highcharts demos\r\n\/\/         'Content-Type': 'text\/plain'\r\n\/\/     }\r\n\/\/ });\r\n\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-839aa29 eael-infobox-icon-bg-shape-none eael-infobox-icon-hover-bg-shape-none elementor-widget elementor-widget-eael-info-box\" data-id=\"839aa29\" data-element_type=\"widget\" data-widget_type=\"eael-info-box.default\">\n\t\t\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t        <div class=\"eael-infobox icon-on-left\">\n\t            <div class=\"infobox-icon eael-icon-only\">\n\n            \n                            <div class=\"infobox-icon-wrap\">\n                    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 512 512\"><path d=\"M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM216 336l24 0 0-64-24 0c-13.3 0-24-10.7-24-24s10.7-24 24-24l48 0c13.3 0 24 10.7 24 24l0 88 8 0c13.3 0 24 10.7 24 24s-10.7 24-24 24l-80 0c-13.3 0-24-10.7-24-24s10.7-24 24-24zm40-208a32 32 0 1 1 0 64 32 32 0 1 1 0-64z\"><\/path><\/svg>                <\/div>\n            \n            \n        <\/div>\n            <div class=\"infobox-content eael-icon-only\">\n        <div><p>\u0418\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0434\u0430\u043d\u043d\u044b\u0435 \u043e \u043f\u043e\u0433\u043e\u0434\u0435 \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u044b \u0438\u0437 <a href=\"https:\/\/openweathermap.org\/api\/one-call-3\">API OpenWeather<\/a><\/p><\/div>        <\/div>\n            <\/div>\n\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>\u041d\u0430\u0432\u0435\u0434\u0438\u0442\u0435 \u0443\u043a\u0430\u0437\u0430\u0442\u0435\u043b\u044c \u043c\u044b\u0448\u0438 \u043d\u0430 \u0433\u0440\u0430\u0444\u0438\u043a, \u0447\u0442\u043e\u0431\u044b \u043f\u0440\u043e\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c \u043f\u043e\u0434\u0440\u043e\u0431\u043d\u044b\u0435 \u0435\u0436\u0435\u0434\u043d\u0435\u0432\u043d\u044b\u0435 \u0434\u0430\u043d\u043d\u044b\u0435 \u043e \u043f\u043e\u0433\u043e\u0434\u0435, \u0438 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u0438\u0442\u0435 \u0432\u043f\u0440\u0430\u0432\u043e, \u0447\u0442\u043e\u0431\u044b \u0443\u0432\u0438\u0434\u0435\u0442\u044c \u0431\u043e\u043b\u044c\u0448\u0435 \u0434\u043d\u0435\u0439. \u0412\u044b\u0431\u0435\u0440\u0438\u0442\u0435 \u0433\u043e\u0434 20242025 \u0412\u044b\u0431\u0435\u0440\u0438\u0442\u0435 \u043c\u0435\u0441\u044f\u0446 \u042f\u043d\u0432\u0430\u0440\u044c\u0424\u0435\u0432\u0440\u0430\u043b\u044c\u041c\u0430\u0440\u0442\u0410\u043f\u0440\u0435\u043b\u044c\u041c\u0430\u0439\u0418\u044e\u043d\u044c\u0418\u044e\u043b\u044c\u0410\u0432\u0433\u0443\u0441\u0442\u0421\u0435\u043d\u0442\u044f\u0431\u0440\u044c\u041e\u043a\u0442\u044f\u0431\u0440\u044c\u041d\u043e\u044f\u0431\u0440\u044c\u0414\u0435\u043a\u0430\u0431\u0440\u044c \u0412\u044b\u0431\u0435\u0440\u0438\u0442\u0435 \u0433\u043e\u0440\u043e\u0434 \u0410\u043b\u043c\u0430\u0442\u044b\u0410\u0448\u0445\u0430\u0431\u0430\u0434\u0410\u0441\u0442\u0430\u043d\u0430\u0411\u0438\u0448\u043a\u0435\u043a\u0414\u0443\u0448\u0430\u043d\u0431\u0435\u0422\u0430\u0448\u043a\u0435\u043d\u0442 \u0418\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0434\u0430\u043d\u043d\u044b\u0435 \u043e \u043f\u043e\u0433\u043e\u0434\u0435 \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u044b \u0438\u0437 API OpenWeather<\/p>\n","protected":false},"author":980,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"inline_featured_image":false,"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"site-sidebar-layout":"no-sidebar","site-content-layout":"page-builder","ast-site-content-layout":"full-width-container","site-content-style":"unboxed","site-sidebar-style":"unboxed","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","theme-transparent-header-meta":"default","adv-header-id-meta":"","stick-header-meta":"default","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"set","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":"","_links_to":"","_links_to_target":""},"class_list":["post-30800","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/centralasiaclimateportal.org\/ru\/wp-json\/wp\/v2\/pages\/30800","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/centralasiaclimateportal.org\/ru\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/centralasiaclimateportal.org\/ru\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/centralasiaclimateportal.org\/ru\/wp-json\/wp\/v2\/users\/980"}],"replies":[{"embeddable":true,"href":"https:\/\/centralasiaclimateportal.org\/ru\/wp-json\/wp\/v2\/comments?post=30800"}],"version-history":[{"count":2,"href":"https:\/\/centralasiaclimateportal.org\/ru\/wp-json\/wp\/v2\/pages\/30800\/revisions"}],"predecessor-version":[{"id":51251,"href":"https:\/\/centralasiaclimateportal.org\/ru\/wp-json\/wp\/v2\/pages\/30800\/revisions\/51251"}],"wp:attachment":[{"href":"https:\/\/centralasiaclimateportal.org\/ru\/wp-json\/wp\/v2\/media?parent=30800"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}