Mason Capital Group — Downtown Bentonville Explore Map
https://unpkg.com/leaflet@1.9.4/dist/leaflet.css
https://unpkg.com/leaflet.markercluster@1.5.3/dist/MarkerCluster.css
Mason Capital Group · Downtown Map
// Mason brand tints for categories (visual match to DBI Explore filters)
const BRAND = '#b80003';
const TINTS = { attractions:'#ffc1c3', eat:'#ffe9ea', drink:'#ffe1e2', shop:'#ffd5d6', art:'#ffcbcd' };
// Build map
const map = L.map('map', { scrollWheelZoom:false });
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',{
maxZoom:19,
attribution:'© OpenStreetMap contributors | Curated by Mason Capital Group'
}).addTo(map);
// Layer groups w/ clustering
const groups = {
attractions: L.markerClusterGroup({ spiderfyOnMaxZoom:true }),
eat: L.markerClusterGroup({ spiderfyOnMaxZoom:true }),
drink: L.markerClusterGroup({ spiderfyOnMaxZoom:true }),
shop: L.markerClusterGroup({ spiderfyOnMaxZoom:true }),
art: L.markerClusterGroup({ spiderfyOnMaxZoom:true })
};
// Helpers
const iconStyle = (t)=>({ radius:8, weight:2, color:BRAND, fillColor:t, fillOpacity:.9 });
function addPOI(p, layerName){
if (!p.lat || !p.lng) return;
const m = L.circleMarker([p.lat, p.lng], iconStyle(TINTS[layerName]));
const link = p.url ? ` ${p.url}Details →` : '';
m.bindPopup(`
${p.name}
${p.address||''}
${link}
`);
groups[layerName].addLayer(m);
return m.getLatLng();
}
// Load data
const DATA = JSON.parse(document.getElementById('MASON_DATA').textContent);
const bounds = L.latLngBounds();
// Add each category
['eat','drink','shop','art','attractions'].forEach(layer=>{
(DATA[layer]||[]).forEach(p=>{
const ll = addPOI(p, layer);
if (ll) bounds.extend(ll);
});
groups[layer].addTo(map);
});
// Fit to markers (fallback to Square)
if (bounds.isValid()) map.fitBounds(bounds.pad(0.15));
else map.setView([36.37246, -94.20867], 16);
// Chip toggles (like DBI Explore)
document.getElementById('chipbar').addEventListener('click', (e)=>{
const chip = e.target.closest('.chip'); if (!chip) return;
chip.classList.toggle('active');
const key = chip.dataset.layer;
if (chip.classList.contains('active')) groups[key].addTo(map);
else map.removeLayer(groups[key]);
});
