באג | באג בקבלת נתונים בAPI רק בקובץ המלא
-
בניתי אתר שלוקח נתונים מ API ומציג אותם בגרפים
הקטע הוא שרק בכתובת הזאת הוא לא מצליח לקחת את הנתונים ובכל קובץ אחר שאני שולח הוא כן מצליח
זה הקוד של האתר (הוספתי שם גם סתם בדיקה שינסה לשאוב את הנתונים והוא בכלל לא מקבל רק כשהקובץ בלי הגרפים)<!DOCTYPE html> <html lang="he"> <head> <meta charset="utf-8"> <title>תצוגת נתונים ApprovalAll.ymgr - גמר</title> <style> body { direction: rtl; font-family: 'Heebo', Arial, sans-serif; background: linear-gradient(120deg, #e3f2fd 0%, #bbdefb 100%); margin: 0; padding: 0; } .container { width: 100vw; max-width: 100vw; margin: 0; background: rgba(255,255,255,0.95); border-radius: 24px 24px 0 0; box-shadow: 0 8px 32px 0 rgba(44,62,80,0.12); padding: 0 0 32px 0; } h2 { margin-top: 0; color: #1976d2; font-size: 3.6em; text-align: center; letter-spacing: 2px; text-shadow: 0 2px 8px #90caf9; font-weight: 900; } .loading { text-align: center; color: #1976d2; font-size: 2em; margin-top: 40px; font-weight: bold; } .error { text-align: center; color: #f44336; font-size: 2em; margin-top: 40px; font-weight: bold; } #chart { display: none; width: 100vw!important; height: 80vh!important; min-height: 400px; margin: 0; background: #fff; border-radius: 32px; box-shadow: 0 4px 24px 0 rgba(44,62,80,0.10); border: 2px solid #90caf9; } </style> </head> <body> <div class="container"> <h2>סך נקודות לכל מתמודד - גמר</h2> <div id="loading" class="loading">טוען נתונים...</div> <div id="error" class="error" style="display:none;"></div> <canvas id="chart" style="display:none;width:100vw!important;height:80vh!important;min-height:400px;margin:0;"></canvas> </div> <link href="https://fonts.googleapis.com/css2?family=Heebo:wght@700;900&display=swap" rel="stylesheet"> <script src="https://cdn.jsdelivr.net/npm/chart.js"></script> <script src="https://cdn.jsdelivr.net/npm/chartjs-plugin-datalabels@2"></script> <script> const url = "https://www.call2all.co.il/ym/api/RenderYMGRFile?token=023130270:1****&wath=ivr2:3/ApprovalAll.ymgr&convertType=json¬LoadLang=0"; let finalists = {}; let addedPoints = {}; // טען שמות מתמודדי הגמר מהקובץ ששומר הדשבורד function loadFinalists() { fetch('finalists.php') .then(r => r.json()) .then(obj => { if (obj && typeof obj === 'object') finalists = obj; }); } function getRandomName(num) { const randomNames = ["אורן", "שירה", "יואב"]; return randomNames[(num-1) % randomNames.length]; } // צבעים ייחודיים לכל מתמודד const colors = [ '#1976d2', '#f44336', '#4caf50' ]; let chartInstance = null; function updateChart() { fetch(url) .then(response => response.json()) .then(json => { document.getElementById('loading').style.display = 'none'; document.getElementById('error').style.display = 'none'; // הצג רק 3 מתמודדים ראשונים const NUM_CONTESTANTS = 3; let points = {}; if (json.data && Array.isArray(json.data)) { json.data.forEach(row => { if (row["נקודות"] && row["P050"]) { // המרה למספר תקני (למניעת בעיות עם "01" וכו') let p = String(Number(row["P050"])); // תמיד "1", "2", "3" let name = finalists[p] || getRandomName(Number(p)); let pts = Number(row["נקודות"]); if (!points[name]) points[name] = 0; points[name] += pts; } }); } // Build 3 contestants, always in order 1-3 let labels = []; let data = []; let bgColors = []; for (let i = 1; i <= NUM_CONTESTANTS; i++) { let name = finalists[i] || getRandomName(i); let totalPoints = (points[name] || 0) + (addedPoints[i] || 0); labels.push([i, name]); data.push(totalPoints); bgColors.push(colors[(i-1) % colors.length]); } if (labels.length > 0) { document.getElementById('chart').style.display = 'block'; const ctx = document.getElementById('chart').getContext('2d'); if (chartInstance) { chartInstance.data.labels = labels; chartInstance.data.datasets[0].data = data; chartInstance.data.datasets[0].backgroundColor = bgColors; chartInstance.update(); } else { chartInstance = new Chart(ctx, { type: 'bar', data: { labels: labels, datasets: [{ label: 'סך נקודות', data: data, backgroundColor: bgColors, borderRadius: 8 }] }, options: { maintainAspectRatio: false, responsive: true, animation: { duration: 1200, easing: 'easeOutBounce' }, plugins: { legend: { display: false }, title: { display: true, text: 'סך נקודות לכל מתמודד - גמר', font: { size: 54, weight: 'bold' }, color: '#1976d2', padding: { top: 30, bottom: 30 } }, datalabels: { display: false // לא להציג מספר על הגרף } }, scales: { x: { title: { display: true, text: 'מתמודד', font: { size: 36 }, color: '#1976d2' }, ticks: { font: { size: 32, weight: 'bold' }, color: function(context) { if (context.tick && Array.isArray(context.tick.label)) { return [ colors[context.index % colors.length], '#1976d2' ]; } return '#1976d2'; }, callback: function(value, index, ticks) { const label = this.getLabelForValue(value); if (Array.isArray(label)) { return [label[0].toString(), label[1]]; } return label; } } }, y: { title: { display: true, text: 'נקודות', font: { size: 36 }, color: '#1976d2' }, ticks: { font: { size: 32, weight: 'bold' }, color: '#1976d2' }, beginAtZero: true } }, layout: { padding: 60 } }, plugins: [ChartDataLabels] }); } } }) .catch(err => { document.getElementById('loading').style.display = 'none'; document.getElementById('error').innerText = "שגיאה בטעינת הנתונים!"; document.getElementById('error').style.display = 'block'; }); } // טען שמות מתמודדי הגמר והצג גרף כל 2 שניות function refreshFinal() { loadFinalists(); updateChart(); } refreshFinal(); setInterval(refreshFinal, 2000); </script> <div class="container"> <h2>כל הנתונים מה-API</h2> <div id="output">טוען נתונים...</div> </div> <script> const url = "https://www.call2all.co.il/ym/api/RenderYMGRFile?token=023130270:1*****2&wath=ivr2:3/ApprovalAll.ymgr&convertType=json¬LoadLang=0"; function fetchAndShow() { fetch(url) .then(r => r.json()) .then(data => { document.getElementById('output').innerHTML = '<pre>' + JSON.stringify(data, null, 2) + '</pre>'; }) .catch(err => { document.getElementById('output').innerHTML = 'שגיאה בטעינת הנתונים: ' + err; }); } fetchAndShow(); setInterval(fetchAndShow, 2000); </script> </body> </html>
-
-