Last active
April 25, 2026 17:48
-
-
Save bhyde/9ef8a7fe0e989cf16b6158f1c0952790 to your computer and use it in GitHub Desktop.
wave height pink
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Chicago Lake Michigan Wave Height Forecast</title> | |
| <style> | |
| body { font-family: monospace; margin: 20px; background: #f5f5f5; } | |
| pre { background: white; padding: 20px; border-radius: 8px; overflow-x: auto; white-space: pre-wrap; } | |
| h1 { color: #333; } | |
| #loading { color: #666; } | |
| </style> | |
| </head> | |
| <body> | |
| <h1>Wave Height Forecast (41.98°N, 87.64°W) - Auto-loaded</h1> | |
| <pre id="output" class="loading">Loading forecast...</pre> | |
| <script> | |
| async function loadWaveHeights() { | |
| const output = document.getElementById('output')!; | |
| output.textContent = 'Loading...'; | |
| try { | |
| const url = "https://marine-api.open-meteo.com/v1/marine?latitude=41.983584&longitude=-87.643485&hourly=wave_height&forecast_days=3"; | |
| const response = await fetch(url); | |
| const data: any = await response.json(); | |
| const times = data.hourly.time; | |
| const heightsM = data.hourly.wave_height; | |
| const pairs: [string, string][] = []; | |
| for (let i = 0; i < times.length; i++) { | |
| const heightFt = (heightsM[i] * 3.28084).toFixed(2) + ' ft'; | |
| pairs.push([times[i], heightFt]); | |
| } | |
| output.textContent = JSON.stringify(pairs, null, 2); | |
| output.classList.remove('loading'); | |
| } catch (error) { | |
| output.textContent = `Error: ${error}`; | |
| } | |
| } | |
| // Load on page load | |
| window.addEventListener('load', loadWaveHeights); | |
| </script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment