Skip to content
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
91 changes: 1 addition & 90 deletions people/index.qmd
Original file line number Diff line number Diff line change
Expand Up @@ -90,93 +90,4 @@ page-layout: full
:::


:::

## Group Locations

```{=html}
<!-- Leaflet CSS and JS from CDN -->
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css"
integrity="sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY="
crossorigin="" />

<script src="https://unpkg.com/[email protected]/dist/leaflet.js"
integrity="sha256-20nQCchB9co0qIjJZRGuk2/Z9VM+kNiyxNV1lvTlZBo="
crossorigin=""></script>

<!-- Map container with enhanced styling -->
<div id="people-map" style="height: 400px; width: 100%; margin: 20px 0; border-radius: 8px; box-shadow: 0 4px 8px rgba(0,0,0,0.1); border: 1px solid #ddd;"></div>

<script>
document.addEventListener('DOMContentLoaded', function() {
// Check if Leaflet is loaded
if (typeof L !== 'undefined') {
try {
// Initialize the map centered on Austin, TX (UT location)
var map = L.map('people-map').setView([30.2849, -97.7341], 10);

// Add tiles - trying modern working alternatives to deprecated Stamen Fastly
// Option 1: Try Stamen Watercolor via current provider
var tileLayer;

// Try multiple providers in order of preference
try {
// First try: Stamen Watercolor via Stadia Maps (may require API key)
tileLayer = L.tileLayer('https://tiles.stadiamaps.com/tiles/stamen_watercolor/{z}/{x}/{y}.jpg', {
attribution: 'Map tiles by <a href="http://stamen.com">Stamen Design</a>, under <a href="http://creativecommons.org/licenses/by/3.0">CC BY 3.0</a>. Data by <a href="http://openstreetmap.org">OpenStreetMap</a>, under <a href="http://www.openstreetmap.org/copyright">ODbL</a>.',
minZoom: 1,
maxZoom: 16
});

// Handle tile loading errors with fallbacks
var fallbackTriggered = false;
tileLayer.on('tileerror', function(e) {
if (!fallbackTriggered) {
fallbackTriggered = true;
console.warn('Stamen tiles unavailable, using alternative watercolor-style tiles');
map.removeLayer(tileLayer);

// Fallback: Use CartoDB Positron (clean alternative)
L.tileLayer('https://{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}{r}.png', {
attribution: '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors © <a href="https://carto.com/attributions">CARTO</a>',
subdomains: 'abcd',
maxZoom: 20
}).addTo(map);
}
});

tileLayer.addTo(map);

} catch (error) {
console.warn('Error setting up Stamen tiles, using standard tiles:', error);
// Final fallback to reliable OpenStreetMap
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors',
maxZoom: 19
}).addTo(map);
}

// Add a marker for the University of Texas at Austin
var marker = L.marker([30.2849, -97.7341]).addTo(map);
marker.bindPopup("<strong>McPherson Group</strong><br/>University of Texas at Austin<br/>Austin, TX");

console.log('Map initialized successfully');
} catch (error) {
console.error('Error initializing map:', error);
// Fallback: show a simple text message
document.getElementById('people-map').innerHTML =
'<div style="display: flex; align-items: center; justify-content: center; height: 100%; background-color: #f8f9fa; color: #6c757d; text-align: center; padding: 20px;">' +
'<div><strong>McPherson Group</strong><br/>University of Texas at Austin<br/>Austin, TX<br/><em>Interactive map loading...</em></div>' +
'</div>';
}
} else {
console.error('Leaflet library not loaded');
// Fallback: show location info
document.getElementById('people-map').innerHTML =
'<div style="display: flex; align-items: center; justify-content: center; height: 100%; background-color: #f8f9fa; color: #6c757d; text-align: center; padding: 20px;">' +
'<div><strong>McPherson Group</strong><br/>University of Texas at Austin<br/>Austin, TX<br/><em>Map functionality requires network access</em></div>' +
'</div>';
}
});
</script>
```
:::