|
snippet to view all the letters at once <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Landsat Alphabet Viewer</title>
<style>
body { font-family: Arial, sans-serif; text-align: center; }
#imageContainer { display: flex; flex-wrap: wrap; justify-content: center; }
img { width: 100px; height: 100px; margin: 5px; object-fit: cover; }
</style>
</head>
<body>
<h1>Landsat Alphabet Viewer</h1>
<div id="imageContainer"></div>
<script>
const letters = {
'A': 3, 'B': 1, 'C': 2, 'D': 1, 'E': 3, 'F': 1, 'G': 0, 'H': 1,
'I': 4, 'J': 2, 'K': 1, 'L': 3, 'M': 2, 'N': 2, 'O': 1, 'P': 1,
'Q': 1, 'R': 3, 'S': 2, 'T': 1, 'U': 2, 'V': 3, 'W': 1, 'X': 2,
'Y': 2, 'Z': 1
};
const container = document.getElementById('imageContainer');
const baseUrl = 'https://landsat.gsfc.nasa.gov/apps/YourNameInLandsat-main/public/images/';
for (const [letter, maxNum] of Object.entries(letters)) {
for (let i = 0; i <= maxNum; i++) {
const img = document.createElement('img');
img.src = `${baseUrl}${letter.toLowerCase()}_${i}.jpg`;
img.alt = `${letter}_${i}`;
img.title = `${letter}_${i}`;
container.appendChild(img);
}
}
</script>
</body>
</html>
|