Cypriot Price Data Dashboard<\/title>\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" \/>\n <style>\n body {\n font-family: Arial, sans-serif;\n display: flex;\n flex-direction: column;\n align-items: center;\n margin: 0;\n background-color: #f0f0f0;\n padding: 20px;\n overflow-x: hidden;\n }\n h2 {\n font-size: 1em;\n font-weight: bold;\n color: #333;\n margin-top: 30px;\n margin-bottom: 10px;\n text-align: left;\n width: 100%;\n max-width: 1200px;\n }\n .wrapper { width: 100%; max-width: 1200px; }\n .summary-container {\n display: flex;\n gap: 20px;\n flex-wrap: wrap;\n padding: 20px 0;\n justify-content: flex-start;\n }\n .summary-box {\n background-color: white;\n padding: 20px;\n border-radius: 10px;\n box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);\n text-align: center;\n width: 250px;\n }\n .summary-title { font-size: 1em; margin-bottom: 10px; color: #333; font-weight: bold; }\n .value { font-size: 2em; }\n .pv { color: rgba(75,192,192,1); }\n .ml { color: rgba(255,159,64,1); }\n .lr { color: rgba(54,162,235,1); }\n .chart-container {\n width: 80%;\n max-width: 800px;\n background-color: white;\n padding: 20px;\n border-radius: 10px;\n box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);\n margin-bottom: 40px;\n }\n canvas { width:100%; min-height:300px; max-height:400px }\n .date-container { margin-bottom:20px; }\n <\/style>\n <script src=\"https:\/\/cdn.jsdelivr.net\/npm\/chart.js@4.4.1\/dist\/chart.umd.js\"><\/script>\n <script src=\"https:\/\/cdn.jsdelivr.net\/npm\/chartjs-adapter-date-fns\"><\/script>\n<\/head>\n<body>\n<div class=\"wrapper\">\n\n \n <h2>Cypriot Day-Ahead Prices and Balancing Prices<\/h2>\n \n <div class=\"chart-container\"><canvas id=\"pricesTodayChart\"><\/canvas><\/div> \n\n \n <h2>Cypriot Prices for Selected Period<\/h2>\n <div class=\"date-container\">\n <label>From: <input type=\"date\" id=\"startDate\"><\/label>\n <label>To: <input type=\"date\" id=\"endDate\"><\/label>\n <button onclick=\"updateForecastPeriod()\">Update Results<\/button>\n <button onclick=\"downloadPeriodCSV()\">Download CSV<\/button>\n <\/div>\n\n <h2>Day-Ahead Prices \u2013 Selected Period<\/h2>\n <div class=\"summary-container\">\n \n <\/div>\n <div class=\"chart-container\"><canvas id=\"pricesPeriodChart\"><\/canvas><\/div>\n\n <h2>Balancing Prices & Volumes \u2013 Selected Period<\/h2>\n \n <h3>FCR Prices<\/h3>\n <div class=\"chart-container\"><canvas id=\"FCRChart\"><\/canvas><\/div>\n <h3>FCR Volumes<\/h3>\n <div class=\"chart-container\"><canvas id=\"FCRVOLChart\"><\/canvas><\/div>\n <h3>aFRR Prices<\/h3>\n <div class=\"chart-container\"><canvas id=\"aFRRChart\"><\/canvas><\/div>\n <h3>aFRR Volumes<\/h3>\n <div class=\"chart-container\"><canvas id=\"aFRRVOLChart\"><\/canvas><\/div>\n <h3>mFRR Prices<\/h3>\n <div class=\"chart-container\"><canvas id=\"mFRRChart\"><\/canvas><\/div>\n <h3>mFRR Volumes<\/h3>\n <div class=\"chart-container\"><canvas id=\"mFRRVOLChart\"><\/canvas><\/div>\n \n\n<\/div>\n\n\n<script>\n\nconst PV_CAPACITY = 5000; \/\/ W\n\n\/\/ MAE for PV \u2192 normalized as % of installed capacity\nfunction maePV(actual, forecast) {\n const common = actual.filter(a => forecast.find(f => f.x.getTime() === a.x.getTime()));\n const diffs = common.map(a => {\n const f = forecast.find(f => f.x.getTime() === a.x.getTime());\n return Math.abs(a.y - f.y);\n });\n const rawMAE = diffs.length ? (diffs.reduce((s,v)=>s+v,0)\/diffs.length) : null;\n return rawMAE !== null ? ((rawMAE \/ PV_CAPACITY) * 100).toFixed(2) + \"%\" : \"-\";\n}\n\n\/\/ MAE for Weather \u2192 keep units (W\/m\u00b2, \u00b0C, %RH)\nfunction maeRaw(actual, forecast) {\n const common = actual.filter(a => forecast.find(f => f.x.getTime() === a.x.getTime()));\n const diffs = common.map(a => {\n const f = forecast.find(f => f.x.getTime() === a.x.getTime());\n return Math.abs(a.y - f.y);\n });\n return diffs.length ? (diffs.reduce((s,v)=>s+v,0)\/diffs.length).toFixed(2) : \"-\";\n}\n\n\/\/ Helper: parse UTC timestamps\nfunction parseUTC(ts) {\n return new Date(ts); \/\/ keep UTC, Chart.js will shift to Athens\n}\n\nasync function loadPrices() {\n const tz = \"Europe\/Athens\";\n const now = new Date();\n\n \/\/ Today (end of range)\n const todayStart = new Date(now.getFullYear(), now.getMonth(), now.getDate(), 0, 0, 0);\n const todayEnd = new Date(now.getFullYear(), now.getMonth(), now.getDate(), 23, 59, 59);\n\n \/\/ Three-day range: start = 2 days before today\n const threeDaysStart = new Date(todayStart);\n threeDaysStart.setDate(threeDaysStart.getDate() - 1);\n\n const tomorrowEnd = new Date(todayEnd);\n tomorrowEnd.setDate(tomorrowEnd.getDate() + 1);\n\n \/\/ Fetch Forecasts\n const PriceUrl = `https:\/\/api.thingspeak.com\/channels\/3158340\/feeds.json?api_key=T9VJKG2R60CNLP9G&start=${threeDaysStart.toISOString()}&end=${tomorrowEnd.toISOString()}&timezone=${tz}`;\n const PriceResp = await fetch(PriceUrl);\n const PriceFeeds = (await PriceResp.json()).feeds || [];\n\n \/\/ Fetch Actual\n \/\/ const actualUrl = `https:\/\/api.thingspeak.com\/channels\/3043618\/feeds.json?api_key=T3ZXSZASX0FNHN6T&start=${todayStart.toISOString()}&end=${todayEnd.toISOString()}&average=60&timezone=${tz}`;\n \/\/ const actualResp = await fetch(actualUrl);\n \/\/ const actualFeeds = (await actualResp.json()).feeds || [];\n\n \/\/ const actualData = actualFeeds.map(f => ({\n \/\/ x: parseUTC(f.created_at),\n \/\/ y: parseFloat(f.field2) || 0\n \/\/ }));\n\n const DAM_price = PriceFeeds.map(f => ({\n x: parseUTC(f.created_at),\n y: parseFloat(f.field1) || 0\n }));\n\n const DAM_volume = PriceFeeds.map(f => ({\n x: parseUTC(f.created_at),\n y: parseFloat(f.field2) || 0\n }));\n\n const hourTick = {callback: function(value, index, ticks) {\n const dt = new Date(value);\n const hours = dt.getHours();\n\n \/\/ Show date at midnight\n if (hours === 0) {\n return dt.toLocaleDateString(\"en-GB\", {\n day: \"2-digit\",\n month: \"short\"\n });\n }\n\n \/\/ Show hour only\n return dt.toLocaleTimeString(\"en-GB\", {\n hour: \"2-digit\"\n });\n }\n }\n\n if(window.pricesTodayChartObj) window.pricesTodayChartObj.destroy();\n window.pricesTodayChartObj = new Chart(document.getElementById(\"pricesTodayChart\").getContext(\"2d\"), {\n type: \"line\",\n data: {\n datasets: [\n { label: \"DAM Prices\", data: DAM_price, borderColor: \"rgba(75,192,192,1)\", borderWidth:2, pointRadius:0 },\n { label: \"DAM volume\", data: DAM_volume, borderColor: \"rgba(255,159,64,1)\", borderWidth:2, pointRadius:0 }\n ]\n },\n options: {\n responsive: true,\n maintainAspectRatio: false,\n scales: {\n x: {\n type: \"time\",\n time: { unit: \"hour\" },\n adapters: { date: { zone: \"Europe\/Athens\" } },\n min: threeDaysStart,\n max: tomorrowEnd,\n ticks: hourTick\n },\n y: { title: { display: true, text: \"PV Power (W)\" } }\n }\n }\n });\n}\nwindow.addEventListener(\"load\", loadPrices);\n\n\nasync function updateForecastPeriod() {\n const tz = \"Europe\/Athens\";\n const s = document.getElementById(\"startDate\").value;\n const e = document.getElementById(\"endDate\").value;\n if (!s || !e) { alert(\"Please select both dates\"); return; }\n\n \/\/ --- helper to parse Athens timezone correctly ---\n function parseAthens(ts) {\n return new Date(ts.replace(\"Z\", \"+03:00\"));\n }\n\n \/\/ Align start & end to Athens local time (midnight boundaries)\n const start = new Date(`${s}T00:00:00+03:00`);\n const end = new Date(`${e}T23:59:59+03:00`);\n const endPlus = new Date(end.getTime() + 1000); \/\/ small buffer\n\n \/\/ ---------------- PV ----------------\n const priceUrl = `https:\/\/api.thingspeak.com\/channels\/3158341\/feeds.json?api_key=HJ3WTPN71CIASY2A&start=${start.toISOString()}&end=${endPlus.toISOString()}&timezone=${tz}`;\n const priceResp = await fetch(priceUrl);\n const PriceFeeds = (await priceResp.json()).feeds || [];\n\n const volumeUrl = `https:\/\/api.thingspeak.com\/channels\/3233568\/feeds.json?api_key=OVXM80QT4LG9WL9X&start=${start.toISOString()}&end=${endPlus.toISOString()}&timezone=${tz}`;\n const volumeResp = await fetch(volumeUrl);\n const volumeFeeds = (await volumeResp.json()).feeds || [];\n\n const DAM_price = PriceFeeds.map(f => ({\n x: parseUTC(f.created_at),\n y: parseFloat(f.field1) || 0\n }));\n\n const DAM_volume = PriceFeeds.map(f => ({\n x: parseUTC(f.created_at),\n y: parseFloat(f.field2) || 0\n }));\n\n const FCR_up = PriceFeeds.map(f => ({\n x: parseUTC(f.created_at),\n y: parseFloat(f.field3) || 0\n }));\n\n const FCR_down = PriceFeeds.map(f => ({\n x: parseUTC(f.created_at),\n y: parseFloat(f.field4) || 0\n }));\n\n const aFRR_up = PriceFeeds.map(f => ({\n x: parseUTC(f.created_at),\n y: parseFloat(f.field5) || 0\n }));\n\n const aFRR_down = PriceFeeds.map(f => ({\n x: parseUTC(f.created_at),\n y: parseFloat(f.field6) || 0\n }));\n\n const mFRR_up = PriceFeeds.map(f => ({\n x: parseUTC(f.created_at),\n y: parseFloat(f.field7) || 0\n }));\n\n const mFRR_down = PriceFeeds.map(f => ({\n x: parseUTC(f.created_at),\n y: parseFloat(f.field8) || 0\n }));\n\n const FCR_up_vol = volumeFeeds.map(f => ({\n x: parseUTC(f.created_at),\n y: parseFloat(f.field2) || 0\n }));\n\n const FCR_down_vol = volumeFeeds.map(f => ({\n x: parseUTC(f.created_at),\n y: parseFloat(f.field1) || 0\n }));\n\n const aFRR_up_vol = volumeFeeds.map(f => ({\n x: parseUTC(f.created_at),\n y: parseFloat(f.field4) || 0\n }));\n\n const aFRR_down_vol = volumeFeeds.map(f => ({\n x: parseUTC(f.created_at),\n y: parseFloat(f.field3) || 0\n }));\n\n const mFRR_up_vol = volumeFeeds.map(f => ({\n x: parseUTC(f.created_at),\n y: parseFloat(f.field6) || 0\n }));\n\n const mFRR_down_vol = volumeFeeds.map(f => ({\n x: parseUTC(f.created_at),\n y: parseFloat(f.field5) || 0\n }));\n\n const hourTick = {autoSkip: false,\n callback: function(value, index, ticks) {\n const dt = new Date(value);\n const hours = dt.getHours();\n\n if (hours === 0) {\n return dt.toLocaleDateString(\"en-GB\", {\n day: \"2-digit\",\n month: \"short\"\n });\n }\n return dt.toLocaleTimeString(\"en-GB\", {\n hour: \"2-digit\"\n });\n },\n major: {\n enabled: true\n }\n }\n\n if (window.pricesPeriodChartObj) window.pricesPeriodChartObj.destroy();\n window.pricesPeriodChartObj = new Chart(document.getElementById(\"pricesPeriodChart\").getContext(\"2d\"), {\n type: \"line\",\n data: {\n datasets: [\n { label: \"DAM Prices\", data: DAM_price, borderColor: \"rgba(75,192,192,1)\", borderWidth:2, pointRadius:0 },\n { label: \"DAM volume\", data: DAM_volume, borderColor: \"rgba(255,159,64,1)\", borderWidth:2, pointRadius:0 }\n ]\n },\n options: {\n responsive: true,\n maintainAspectRatio: false,\n scales: {\n x: {\n type: \"time\",\n time: { unit: \"hour\" },\n min: start,\n max: endPlus,\n ticks: hourTick\n },\n y: { title: { display: true, text: \"Day-Ahead Price & Volume\" } }\n }\n }\n });\n\n if (window.FCRChartObj) window.FCRChartObj.destroy();\n window.FCRChartObj = new Chart(document.getElementById(\"FCRChart\").getContext(\"2d\"), {\n type: \"line\",\n data: {\n datasets: [\n { label: \"FCR up\", data: FCR_up, borderColor: \"rgba(75,192,192,1)\", borderWidth:2, pointRadius:0 },\n { label: \"FCR down\", data: FCR_down, borderColor: \"rgba(255,159,64,1)\", borderWidth:2, pointRadius:0 }\n ]\n },\n options: { responsive:true, maintainAspectRatio:false, scales:{ x:{type:\"time\",time:{unit:\"hour\"},min:start,max:endPlus, ticks: hourTick}, y:{title:{display:true,text:\"FCR Balancing Prices\"}} } }\n });\n\n if (window.FCRVOLChartObj) window.FCRVOLChartObj.destroy();\n window.FCRVOLChartObj = new Chart(document.getElementById(\"FCRVOLChart\").getContext(\"2d\"), {\n type: \"line\",\n data: {\n datasets: [\n { label: \"FCR volume up\", data: FCR_up_vol, borderColor: \"rgba(75,192,192,1)\", borderWidth:2, pointRadius:0 },\n { label: \"FCR volume down\", data: FCR_down_vol, borderColor: \"rgba(255,159,64,1)\", borderWidth:2, pointRadius:0 }\n ]\n },\n options: { responsive:true, maintainAspectRatio:false, scales:{ x:{type:\"time\",time:{unit:\"hour\"},min:start,max:endPlus, ticks: hourTick}, y:{title:{display:true,text:\"FCR Balancing Volumes\"}} } }\n });\n\n if (window.mFRRChartObj) window.mFRRChartObj.destroy();\n window.mFRRChartObj = new Chart(document.getElementById(\"mFRRChart\").getContext(\"2d\"), {\n type: \"line\",\n data: {\n datasets: [\n { label: \"mFRR up\", data: mFRR_up, borderColor: \"rgba(75,192,192,1)\", borderWidth:2, pointRadius:0 },\n { label: \"mFRR down\", data: mFRR_down, borderColor: \"rgba(255,159,64,1)\", borderWidth:2, pointRadius:0 }\n ]\n },\n options: { responsive:true, maintainAspectRatio:false, scales:{ x:{type:\"time\",time:{unit:\"hour\"},min:start,max:endPlus, ticks: hourTick}, y:{title:{display:true,text:\"mFRR Balancing Prices\"}} } }\n });\n\n if (window.mFRRVOLChartObj) window.mFRRVOLChartObj.destroy();\n window.mFRRVOLChartObj = new Chart(document.getElementById(\"mFRRVOLChart\").getContext(\"2d\"), {\n type: \"line\",\n data: {\n datasets: [\n { label: \"mFRR volume up\", data: mFRR_up_vol, borderColor: \"rgba(75,192,192,1)\", borderWidth:2, pointRadius:0 },\n { label: \"mFRR volume down\", data: mFRR_down_vol, borderColor: \"rgba(255,159,64,1)\", borderWidth:2, pointRadius:0 }\n ]\n },\n options: { responsive:true, maintainAspectRatio:false, scales:{ x:{type:\"time\",time:{unit:\"hour\"},min:start,max:endPlus, ticks: hourTick}, y:{title:{display:true,text:\"mFRR Balancing Volumes\"}} } }\n });\n\n if (window.aFRRChartObj) window.aFRRChartObj.destroy();\n window.aFRRChartObj = new Chart(document.getElementById(\"aFRRChart\").getContext(\"2d\"), {\n type: \"line\",\n data: {\n datasets: [\n { label: \"aFRR up\", data: aFRR_up, borderColor: \"rgba(75,192,192,1)\", borderWidth:2, pointRadius:0 },\n { label: \"aFRR down\", data: aFRR_down, borderColor: \"rgba(255,159,64,1)\", borderWidth:2, pointRadius:0 }\n ]\n },\n options: { responsive:true, maintainAspectRatio:false, scales:{ x:{type:\"time\",time:{unit:\"hour\"},min:start,max:endPlus, ticks: hourTick}, y:{title:{display:true,text:\"aFRR Balancing Prices\"}} } }\n });\n\n if (window.aFRRVOLChartObj) window.aFRRVOLChartObj.destroy();\n window.aFRRVOLChartObj = new Chart(document.getElementById(\"aFRRVOLChart\").getContext(\"2d\"), {\n type: \"line\",\n data: {\n datasets: [\n { label: \"aFRR volume up\", data: aFRR_up_vol, borderColor: \"rgba(75,192,192,1)\", borderWidth:2, pointRadius:0 },\n { label: \"aFRR volume down\", data: aFRR_down_vol, borderColor: \"rgba(255,159,64,1)\", borderWidth:2, pointRadius:0 }\n ]\n },\n options: { responsive:true, maintainAspectRatio:false, scales:{ x:{type:\"time\",time:{unit:\"hour\"},min:start,max:endPlus, ticks: hourTick}, y:{title:{display:true,text:\"aFRR Balancing Volumes\"}} } }\n });\n\n \/\/ ---------------- CSV ----------------\n periodData = [];\n const allTimes = [...new Set([\n ...DAM_price.map(d => d.x.getTime()),\n ...DAM_volume.map(d => d.x.getTime()),\n ...FCR_up.map(d => d.x.getTime()),\n ...FCR_down.map(d => d.x.getTime()),\n ...aFRR_up.map(d => d.x.getTime()),\n ...aFRR_down.map(d => d.x.getTime()),\n ...mFRR_up.map(d => d.x.getTime()),\n ...mFRR_down.map(d => d.x.getTime())\n ])].sort();\n\n allTimes.forEach(t => {\n const time = new Date(t);\n function getVal(arr) {\n const obj = arr.find(d => d.x.getTime() === t);\n return obj ? obj.y : \"\";\n }\n periodData.push({\n time,\n DAMPrice: getVal(DAM_price),\n DAMVolume: getVal(DAM_volume),\n FCRup: getVal(FCR_up),\n FCRdown: getVal(FCR_down),\n aFRRup: getVal(aFRR_up),\n aFRRdown: getVal(aFRR_down),\n mFRRup: getVal(mFRR_up),\n mFRRdown: getVal(mFRR_down)\n });\n });\n}\n\n\n\nlet periodData = []; \/\/ global store\n\nfunction downloadPeriodCSV() {\n if (!periodData.length) {\n alert(\"Please run Update Results first!\");\n return;\n }\n const header = [\"Time\",\"DAM_price\",\"DAM_volume\",\"FCR_up\",\"FCR_down\",\"aFRR_up\",\"aFRR_down\",\"mFRR_up\",\"mFRR_down\"];\n const rows = periodData.map(r => [\n r.time.toISOString(),\n r.DAMPrice, r.DAMVolume, r.FCRup,\n r.FCRdown, r.aFRRup,\n r.aFRRdown, r.mFRRup,\n r.mFRRdown\n ]);\n const csv = [header.join(\",\"), ...rows.map(r => r.join(\",\"))].join(\"\\n\");\n const blob = new Blob([csv], { type: \"text\/csv\" });\n const url = URL.createObjectURL(blob);\n const a = document.createElement(\"a\");\n a.href = url;\n a.download = \"Prices_Selected_Period.csv\";\n a.click();\n URL.revokeObjectURL(url);\n}\n\n<\/script>\n<\/body>\n<\/html>\n\n","protected":false},"excerpt":{"rendered":"<p>Cypriot Price Data Dashboard Cypriot Day-Ahead Prices and Balancing Prices Cypriot Prices for Selected Period From: To: Update Results Download CSV Day-Ahead Prices \u2013 Selected Period Balancing Prices & Volumes \u2013 Selected Period FCR Prices FCR Volumes aFRR Prices aFRR Volumes mFRR Prices mFRR Volumes<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-351","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.kios.ucy.ac.cy\/optimres\/wp-json\/wp\/v2\/pages\/351","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.kios.ucy.ac.cy\/optimres\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.kios.ucy.ac.cy\/optimres\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.kios.ucy.ac.cy\/optimres\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.kios.ucy.ac.cy\/optimres\/wp-json\/wp\/v2\/comments?post=351"}],"version-history":[{"count":5,"href":"https:\/\/www.kios.ucy.ac.cy\/optimres\/wp-json\/wp\/v2\/pages\/351\/revisions"}],"predecessor-version":[{"id":362,"href":"https:\/\/www.kios.ucy.ac.cy\/optimres\/wp-json\/wp\/v2\/pages\/351\/revisions\/362"}],"wp:attachment":[{"href":"https:\/\/www.kios.ucy.ac.cy\/optimres\/wp-json\/wp\/v2\/media?parent=351"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":351,"date":"2026-01-07T11:48:06","date_gmt":"2026-01-07T11:48:06","guid":{"rendered":"https:\/\/www.kios.ucy.ac.cy\/optimres\/?page_id=351"},"modified":"2026-01-22T14:23:49","modified_gmt":"2026-01-22T14:23:49","slug":"cyprus-electricity-market-results","status":"publish","type":"page","link":"https:\/\/www.kios.ucy.ac.cy\/optimres\/cyprus-electricity-market-results\/","title":{"rendered":"Cyprus Electricity Market Results"},"content":{"rendered":"\n\n\n\n \n Cypriot Price Data Dashboard<\/title>\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" \/>\n <style>\n body {\n font-family: Arial, sans-serif;\n display: flex;\n flex-direction: column;\n align-items: center;\n margin: 0;\n background-color: #f0f0f0;\n padding: 20px;\n overflow-x: hidden;\n }\n h2 {\n font-size: 1em;\n font-weight: bold;\n color: #333;\n margin-top: 30px;\n margin-bottom: 10px;\n text-align: left;\n width: 100%;\n max-width: 1200px;\n }\n .wrapper { width: 100%; max-width: 1200px; }\n .summary-container {\n display: flex;\n gap: 20px;\n flex-wrap: wrap;\n padding: 20px 0;\n justify-content: flex-start;\n }\n .summary-box {\n background-color: white;\n padding: 20px;\n border-radius: 10px;\n box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);\n text-align: center;\n width: 250px;\n }\n .summary-title { font-size: 1em; margin-bottom: 10px; color: #333; font-weight: bold; }\n .value { font-size: 2em; }\n .pv { color: rgba(75,192,192,1); }\n .ml { color: rgba(255,159,64,1); }\n .lr { color: rgba(54,162,235,1); }\n .chart-container {\n width: 80%;\n max-width: 800px;\n background-color: white;\n padding: 20px;\n border-radius: 10px;\n box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);\n margin-bottom: 40px;\n }\n canvas { width:100%; min-height:300px; max-height:400px }\n .date-container { margin-bottom:20px; }\n <\/style>\n <script src=\"https:\/\/cdn.jsdelivr.net\/npm\/chart.js@4.4.1\/dist\/chart.umd.js\"><\/script>\n <script src=\"https:\/\/cdn.jsdelivr.net\/npm\/chartjs-adapter-date-fns\"><\/script>\n<\/head>\n<body>\n<div class=\"wrapper\">\n\n \n <h2>Cypriot Day-Ahead Prices and Balancing Prices<\/h2>\n \n <div class=\"chart-container\"><canvas id=\"pricesTodayChart\"><\/canvas><\/div> \n\n \n <h2>Cypriot Prices for Selected Period<\/h2>\n <div class=\"date-container\">\n <label>From: <input type=\"date\" id=\"startDate\"><\/label>\n <label>To: <input type=\"date\" id=\"endDate\"><\/label>\n <button onclick=\"updateForecastPeriod()\">Update Results<\/button>\n <button onclick=\"downloadPeriodCSV()\">Download CSV<\/button>\n <\/div>\n\n <h2>Day-Ahead Prices \u2013 Selected Period<\/h2>\n <div class=\"summary-container\">\n \n <\/div>\n <div class=\"chart-container\"><canvas id=\"pricesPeriodChart\"><\/canvas><\/div>\n\n <h2>Balancing Prices & Volumes \u2013 Selected Period<\/h2>\n \n <h3>FCR Prices<\/h3>\n <div class=\"chart-container\"><canvas id=\"FCRChart\"><\/canvas><\/div>\n <h3>FCR Volumes<\/h3>\n <div class=\"chart-container\"><canvas id=\"FCRVOLChart\"><\/canvas><\/div>\n <h3>aFRR Prices<\/h3>\n <div class=\"chart-container\"><canvas id=\"aFRRChart\"><\/canvas><\/div>\n <h3>aFRR Volumes<\/h3>\n <div class=\"chart-container\"><canvas id=\"aFRRVOLChart\"><\/canvas><\/div>\n <h3>mFRR Prices<\/h3>\n <div class=\"chart-container\"><canvas id=\"mFRRChart\"><\/canvas><\/div>\n <h3>mFRR Volumes<\/h3>\n <div class=\"chart-container\"><canvas id=\"mFRRVOLChart\"><\/canvas><\/div>\n \n\n<\/div>\n\n\n<script>\n\nconst PV_CAPACITY = 5000; \/\/ W\n\n\/\/ MAE for PV \u2192 normalized as % of installed capacity\nfunction maePV(actual, forecast) {\n const common = actual.filter(a => forecast.find(f => f.x.getTime() === a.x.getTime()));\n const diffs = common.map(a => {\n const f = forecast.find(f => f.x.getTime() === a.x.getTime());\n return Math.abs(a.y - f.y);\n });\n const rawMAE = diffs.length ? (diffs.reduce((s,v)=>s+v,0)\/diffs.length) : null;\n return rawMAE !== null ? ((rawMAE \/ PV_CAPACITY) * 100).toFixed(2) + \"%\" : \"-\";\n}\n\n\/\/ MAE for Weather \u2192 keep units (W\/m\u00b2, \u00b0C, %RH)\nfunction maeRaw(actual, forecast) {\n const common = actual.filter(a => forecast.find(f => f.x.getTime() === a.x.getTime()));\n const diffs = common.map(a => {\n const f = forecast.find(f => f.x.getTime() === a.x.getTime());\n return Math.abs(a.y - f.y);\n });\n return diffs.length ? (diffs.reduce((s,v)=>s+v,0)\/diffs.length).toFixed(2) : \"-\";\n}\n\n\/\/ Helper: parse UTC timestamps\nfunction parseUTC(ts) {\n return new Date(ts); \/\/ keep UTC, Chart.js will shift to Athens\n}\n\nasync function loadPrices() {\n const tz = \"Europe\/Athens\";\n const now = new Date();\n\n \/\/ Today (end of range)\n const todayStart = new Date(now.getFullYear(), now.getMonth(), now.getDate(), 0, 0, 0);\n const todayEnd = new Date(now.getFullYear(), now.getMonth(), now.getDate(), 23, 59, 59);\n\n \/\/ Three-day range: start = 2 days before today\n const threeDaysStart = new Date(todayStart);\n threeDaysStart.setDate(threeDaysStart.getDate() - 1);\n\n const tomorrowEnd = new Date(todayEnd);\n tomorrowEnd.setDate(tomorrowEnd.getDate() + 1);\n\n \/\/ Fetch Forecasts\n const PriceUrl = `https:\/\/api.thingspeak.com\/channels\/3158340\/feeds.json?api_key=T9VJKG2R60CNLP9G&start=${threeDaysStart.toISOString()}&end=${tomorrowEnd.toISOString()}&timezone=${tz}`;\n const PriceResp = await fetch(PriceUrl);\n const PriceFeeds = (await PriceResp.json()).feeds || [];\n\n \/\/ Fetch Actual\n \/\/ const actualUrl = `https:\/\/api.thingspeak.com\/channels\/3043618\/feeds.json?api_key=T3ZXSZASX0FNHN6T&start=${todayStart.toISOString()}&end=${todayEnd.toISOString()}&average=60&timezone=${tz}`;\n \/\/ const actualResp = await fetch(actualUrl);\n \/\/ const actualFeeds = (await actualResp.json()).feeds || [];\n\n \/\/ const actualData = actualFeeds.map(f => ({\n \/\/ x: parseUTC(f.created_at),\n \/\/ y: parseFloat(f.field2) || 0\n \/\/ }));\n\n const DAM_price = PriceFeeds.map(f => ({\n x: parseUTC(f.created_at),\n y: parseFloat(f.field1) || 0\n }));\n\n const DAM_volume = PriceFeeds.map(f => ({\n x: parseUTC(f.created_at),\n y: parseFloat(f.field2) || 0\n }));\n\n const hourTick = {callback: function(value, index, ticks) {\n const dt = new Date(value);\n const hours = dt.getHours();\n\n \/\/ Show date at midnight\n if (hours === 0) {\n return dt.toLocaleDateString(\"en-GB\", {\n day: \"2-digit\",\n month: \"short\"\n });\n }\n\n \/\/ Show hour only\n return dt.toLocaleTimeString(\"en-GB\", {\n hour: \"2-digit\"\n });\n }\n }\n\n if(window.pricesTodayChartObj) window.pricesTodayChartObj.destroy();\n window.pricesTodayChartObj = new Chart(document.getElementById(\"pricesTodayChart\").getContext(\"2d\"), {\n type: \"line\",\n data: {\n datasets: [\n { label: \"DAM Prices\", data: DAM_price, borderColor: \"rgba(75,192,192,1)\", borderWidth:2, pointRadius:0 },\n { label: \"DAM volume\", data: DAM_volume, borderColor: \"rgba(255,159,64,1)\", borderWidth:2, pointRadius:0 }\n ]\n },\n options: {\n responsive: true,\n maintainAspectRatio: false,\n scales: {\n x: {\n type: \"time\",\n time: { unit: \"hour\" },\n adapters: { date: { zone: \"Europe\/Athens\" } },\n min: threeDaysStart,\n max: tomorrowEnd,\n ticks: hourTick\n },\n y: { title: { display: true, text: \"PV Power (W)\" } }\n }\n }\n });\n}\nwindow.addEventListener(\"load\", loadPrices);\n\n\nasync function updateForecastPeriod() {\n const tz = \"Europe\/Athens\";\n const s = document.getElementById(\"startDate\").value;\n const e = document.getElementById(\"endDate\").value;\n if (!s || !e) { alert(\"Please select both dates\"); return; }\n\n \/\/ --- helper to parse Athens timezone correctly ---\n function parseAthens(ts) {\n return new Date(ts.replace(\"Z\", \"+03:00\"));\n }\n\n \/\/ Align start & end to Athens local time (midnight boundaries)\n const start = new Date(`${s}T00:00:00+03:00`);\n const end = new Date(`${e}T23:59:59+03:00`);\n const endPlus = new Date(end.getTime() + 1000); \/\/ small buffer\n\n \/\/ ---------------- PV ----------------\n const priceUrl = `https:\/\/api.thingspeak.com\/channels\/3158341\/feeds.json?api_key=HJ3WTPN71CIASY2A&start=${start.toISOString()}&end=${endPlus.toISOString()}&timezone=${tz}`;\n const priceResp = await fetch(priceUrl);\n const PriceFeeds = (await priceResp.json()).feeds || [];\n\n const volumeUrl = `https:\/\/api.thingspeak.com\/channels\/3233568\/feeds.json?api_key=OVXM80QT4LG9WL9X&start=${start.toISOString()}&end=${endPlus.toISOString()}&timezone=${tz}`;\n const volumeResp = await fetch(volumeUrl);\n const volumeFeeds = (await volumeResp.json()).feeds || [];\n\n const DAM_price = PriceFeeds.map(f => ({\n x: parseUTC(f.created_at),\n y: parseFloat(f.field1) || 0\n }));\n\n const DAM_volume = PriceFeeds.map(f => ({\n x: parseUTC(f.created_at),\n y: parseFloat(f.field2) || 0\n }));\n\n const FCR_up = PriceFeeds.map(f => ({\n x: parseUTC(f.created_at),\n y: parseFloat(f.field3) || 0\n }));\n\n const FCR_down = PriceFeeds.map(f => ({\n x: parseUTC(f.created_at),\n y: parseFloat(f.field4) || 0\n }));\n\n const aFRR_up = PriceFeeds.map(f => ({\n x: parseUTC(f.created_at),\n y: parseFloat(f.field5) || 0\n }));\n\n const aFRR_down = PriceFeeds.map(f => ({\n x: parseUTC(f.created_at),\n y: parseFloat(f.field6) || 0\n }));\n\n const mFRR_up = PriceFeeds.map(f => ({\n x: parseUTC(f.created_at),\n y: parseFloat(f.field7) || 0\n }));\n\n const mFRR_down = PriceFeeds.map(f => ({\n x: parseUTC(f.created_at),\n y: parseFloat(f.field8) || 0\n }));\n\n const FCR_up_vol = volumeFeeds.map(f => ({\n x: parseUTC(f.created_at),\n y: parseFloat(f.field2) || 0\n }));\n\n const FCR_down_vol = volumeFeeds.map(f => ({\n x: parseUTC(f.created_at),\n y: parseFloat(f.field1) || 0\n }));\n\n const aFRR_up_vol = volumeFeeds.map(f => ({\n x: parseUTC(f.created_at),\n y: parseFloat(f.field4) || 0\n }));\n\n const aFRR_down_vol = volumeFeeds.map(f => ({\n x: parseUTC(f.created_at),\n y: parseFloat(f.field3) || 0\n }));\n\n const mFRR_up_vol = volumeFeeds.map(f => ({\n x: parseUTC(f.created_at),\n y: parseFloat(f.field6) || 0\n }));\n\n const mFRR_down_vol = volumeFeeds.map(f => ({\n x: parseUTC(f.created_at),\n y: parseFloat(f.field5) || 0\n }));\n\n const hourTick = {autoSkip: false,\n callback: function(value, index, ticks) {\n const dt = new Date(value);\n const hours = dt.getHours();\n\n if (hours === 0) {\n return dt.toLocaleDateString(\"en-GB\", {\n day: \"2-digit\",\n month: \"short\"\n });\n }\n return dt.toLocaleTimeString(\"en-GB\", {\n hour: \"2-digit\"\n });\n },\n major: {\n enabled: true\n }\n }\n\n if (window.pricesPeriodChartObj) window.pricesPeriodChartObj.destroy();\n window.pricesPeriodChartObj = new Chart(document.getElementById(\"pricesPeriodChart\").getContext(\"2d\"), {\n type: \"line\",\n data: {\n datasets: [\n { label: \"DAM Prices\", data: DAM_price, borderColor: \"rgba(75,192,192,1)\", borderWidth:2, pointRadius:0 },\n { label: \"DAM volume\", data: DAM_volume, borderColor: \"rgba(255,159,64,1)\", borderWidth:2, pointRadius:0 }\n ]\n },\n options: {\n responsive: true,\n maintainAspectRatio: false,\n scales: {\n x: {\n type: \"time\",\n time: { unit: \"hour\" },\n min: start,\n max: endPlus,\n ticks: hourTick\n },\n y: { title: { display: true, text: \"Day-Ahead Price & Volume\" } }\n }\n }\n });\n\n if (window.FCRChartObj) window.FCRChartObj.destroy();\n window.FCRChartObj = new Chart(document.getElementById(\"FCRChart\").getContext(\"2d\"), {\n type: \"line\",\n data: {\n datasets: [\n { label: \"FCR up\", data: FCR_up, borderColor: \"rgba(75,192,192,1)\", borderWidth:2, pointRadius:0 },\n { label: \"FCR down\", data: FCR_down, borderColor: \"rgba(255,159,64,1)\", borderWidth:2, pointRadius:0 }\n ]\n },\n options: { responsive:true, maintainAspectRatio:false, scales:{ x:{type:\"time\",time:{unit:\"hour\"},min:start,max:endPlus, ticks: hourTick}, y:{title:{display:true,text:\"FCR Balancing Prices\"}} } }\n });\n\n if (window.FCRVOLChartObj) window.FCRVOLChartObj.destroy();\n window.FCRVOLChartObj = new Chart(document.getElementById(\"FCRVOLChart\").getContext(\"2d\"), {\n type: \"line\",\n data: {\n datasets: [\n { label: \"FCR volume up\", data: FCR_up_vol, borderColor: \"rgba(75,192,192,1)\", borderWidth:2, pointRadius:0 },\n { label: \"FCR volume down\", data: FCR_down_vol, borderColor: \"rgba(255,159,64,1)\", borderWidth:2, pointRadius:0 }\n ]\n },\n options: { responsive:true, maintainAspectRatio:false, scales:{ x:{type:\"time\",time:{unit:\"hour\"},min:start,max:endPlus, ticks: hourTick}, y:{title:{display:true,text:\"FCR Balancing Volumes\"}} } }\n });\n\n if (window.mFRRChartObj) window.mFRRChartObj.destroy();\n window.mFRRChartObj = new Chart(document.getElementById(\"mFRRChart\").getContext(\"2d\"), {\n type: \"line\",\n data: {\n datasets: [\n { label: \"mFRR up\", data: mFRR_up, borderColor: \"rgba(75,192,192,1)\", borderWidth:2, pointRadius:0 },\n { label: \"mFRR down\", data: mFRR_down, borderColor: \"rgba(255,159,64,1)\", borderWidth:2, pointRadius:0 }\n ]\n },\n options: { responsive:true, maintainAspectRatio:false, scales:{ x:{type:\"time\",time:{unit:\"hour\"},min:start,max:endPlus, ticks: hourTick}, y:{title:{display:true,text:\"mFRR Balancing Prices\"}} } }\n });\n\n if (window.mFRRVOLChartObj) window.mFRRVOLChartObj.destroy();\n window.mFRRVOLChartObj = new Chart(document.getElementById(\"mFRRVOLChart\").getContext(\"2d\"), {\n type: \"line\",\n data: {\n datasets: [\n { label: \"mFRR volume up\", data: mFRR_up_vol, borderColor: \"rgba(75,192,192,1)\", borderWidth:2, pointRadius:0 },\n { label: \"mFRR volume down\", data: mFRR_down_vol, borderColor: \"rgba(255,159,64,1)\", borderWidth:2, pointRadius:0 }\n ]\n },\n options: { responsive:true, maintainAspectRatio:false, scales:{ x:{type:\"time\",time:{unit:\"hour\"},min:start,max:endPlus, ticks: hourTick}, y:{title:{display:true,text:\"mFRR Balancing Volumes\"}} } }\n });\n\n if (window.aFRRChartObj) window.aFRRChartObj.destroy();\n window.aFRRChartObj = new Chart(document.getElementById(\"aFRRChart\").getContext(\"2d\"), {\n type: \"line\",\n data: {\n datasets: [\n { label: \"aFRR up\", data: aFRR_up, borderColor: \"rgba(75,192,192,1)\", borderWidth:2, pointRadius:0 },\n { label: \"aFRR down\", data: aFRR_down, borderColor: \"rgba(255,159,64,1)\", borderWidth:2, pointRadius:0 }\n ]\n },\n options: { responsive:true, maintainAspectRatio:false, scales:{ x:{type:\"time\",time:{unit:\"hour\"},min:start,max:endPlus, ticks: hourTick}, y:{title:{display:true,text:\"aFRR Balancing Prices\"}} } }\n });\n\n if (window.aFRRVOLChartObj) window.aFRRVOLChartObj.destroy();\n window.aFRRVOLChartObj = new Chart(document.getElementById(\"aFRRVOLChart\").getContext(\"2d\"), {\n type: \"line\",\n data: {\n datasets: [\n { label: \"aFRR volume up\", data: aFRR_up_vol, borderColor: \"rgba(75,192,192,1)\", borderWidth:2, pointRadius:0 },\n { label: \"aFRR volume down\", data: aFRR_down_vol, borderColor: \"rgba(255,159,64,1)\", borderWidth:2, pointRadius:0 }\n ]\n },\n options: { responsive:true, maintainAspectRatio:false, scales:{ x:{type:\"time\",time:{unit:\"hour\"},min:start,max:endPlus, ticks: hourTick}, y:{title:{display:true,text:\"aFRR Balancing Volumes\"}} } }\n });\n\n \/\/ ---------------- CSV ----------------\n periodData = [];\n const allTimes = [...new Set([\n ...DAM_price.map(d => d.x.getTime()),\n ...DAM_volume.map(d => d.x.getTime()),\n ...FCR_up.map(d => d.x.getTime()),\n ...FCR_down.map(d => d.x.getTime()),\n ...aFRR_up.map(d => d.x.getTime()),\n ...aFRR_down.map(d => d.x.getTime()),\n ...mFRR_up.map(d => d.x.getTime()),\n ...mFRR_down.map(d => d.x.getTime())\n ])].sort();\n\n allTimes.forEach(t => {\n const time = new Date(t);\n function getVal(arr) {\n const obj = arr.find(d => d.x.getTime() === t);\n return obj ? obj.y : \"\";\n }\n periodData.push({\n time,\n DAMPrice: getVal(DAM_price),\n DAMVolume: getVal(DAM_volume),\n FCRup: getVal(FCR_up),\n FCRdown: getVal(FCR_down),\n aFRRup: getVal(aFRR_up),\n aFRRdown: getVal(aFRR_down),\n mFRRup: getVal(mFRR_up),\n mFRRdown: getVal(mFRR_down)\n });\n });\n}\n\n\n\nlet periodData = []; \/\/ global store\n\nfunction downloadPeriodCSV() {\n if (!periodData.length) {\n alert(\"Please run Update Results first!\");\n return;\n }\n const header = [\"Time\",\"DAM_price\",\"DAM_volume\",\"FCR_up\",\"FCR_down\",\"aFRR_up\",\"aFRR_down\",\"mFRR_up\",\"mFRR_down\"];\n const rows = periodData.map(r => [\n r.time.toISOString(),\n r.DAMPrice, r.DAMVolume, r.FCRup,\n r.FCRdown, r.aFRRup,\n r.aFRRdown, r.mFRRup,\n r.mFRRdown\n ]);\n const csv = [header.join(\",\"), ...rows.map(r => r.join(\",\"))].join(\"\\n\");\n const blob = new Blob([csv], { type: \"text\/csv\" });\n const url = URL.createObjectURL(blob);\n const a = document.createElement(\"a\");\n a.href = url;\n a.download = \"Prices_Selected_Period.csv\";\n a.click();\n URL.revokeObjectURL(url);\n}\n\n<\/script>\n<\/body>\n<\/html>\n\n","protected":false},"excerpt":{"rendered":"<p>Cypriot Price Data Dashboard Cypriot Day-Ahead Prices and Balancing Prices Cypriot Prices for Selected Period From: To: Update Results Download CSV Day-Ahead Prices \u2013 Selected Period Balancing Prices & Volumes \u2013 Selected Period FCR Prices FCR Volumes aFRR Prices aFRR Volumes mFRR Prices mFRR Volumes<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-351","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.kios.ucy.ac.cy\/optimres\/wp-json\/wp\/v2\/pages\/351","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.kios.ucy.ac.cy\/optimres\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.kios.ucy.ac.cy\/optimres\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.kios.ucy.ac.cy\/optimres\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.kios.ucy.ac.cy\/optimres\/wp-json\/wp\/v2\/comments?post=351"}],"version-history":[{"count":5,"href":"https:\/\/www.kios.ucy.ac.cy\/optimres\/wp-json\/wp\/v2\/pages\/351\/revisions"}],"predecessor-version":[{"id":362,"href":"https:\/\/www.kios.ucy.ac.cy\/optimres\/wp-json\/wp\/v2\/pages\/351\/revisions\/362"}],"wp:attachment":[{"href":"https:\/\/www.kios.ucy.ac.cy\/optimres\/wp-json\/wp\/v2\/media?parent=351"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}