leaflet = { { // Import Leaflet Geocoder JS and CSS const leafletGeocoderJS = await import("https://unpkg.com/leaflet-control-geocoder/dist/Control.Geocoder.js"); const leafletGeocoderCSS = document.createElement("link"); leafletGeocoderCSS.href = "https://unpkg.com/leaflet-control-geocoder/dist/Control.Geocoder.css"; leafletGeocoderCSS.rel = "stylesheet"; document.head.appendChild(leafletGeocoderCSS); } { const link = document.createElement("link"); link.href = resolve("leaflet@1.2.0/dist/leaflet.css"); link.rel = "stylesheet"; document.head.appendChild(link); } // Create container for the map, legend, header, and footer const container = DOM.element("div", { style: `display: flex; flex-direction: column; align-items: center;` }); // Create header const header = DOM.element("div", { style: `margin-bottom: 10px; text-align: center; font-weight: bold; font-size: 20px;` }); header.textContent = "Active emissions and environmental cleanup in Harris County"; container.appendChild(header); // Add chatter below the header const chatter = DOM.element("div", { style: `margin-bottom: 10px; text-align: center; font-size: 14px; max-width: 600px;` }); chatter.innerHTML = ` Industrial Hazardous Waste Corrective Action (IHWCA) sites are places where past pollution is being addressed. All active and inactive sites are included. Title V permit facilities are large-scale industrial polluters regulated under federal air quality standards.

Hover over each circle to see the site's owner. `; container.appendChild(chatter); // Add media query for responsive styling const styleSheet = document.createElement("style"); styleSheet.innerHTML = ` @media (max-width: 600px) { div[style*="width: 15px;"] { width: 12px !important; height: 12px !important; } } `; document.head.appendChild(styleSheet); // Create map container const mapContainer = DOM.element("div", { style: `width: 100%; height: 500px;` }); container.appendChild(mapContainer); // Create footer const footer = DOM.element("div", { style: `margin-top: 10px; text-align: left; font-size: 14px; line-height: 1.5; width: 100%;` }); footer.innerHTML = "Notes: Data regarding storage tanks or water rights are not included in the map.
Source: Texas Commission on Environmental Quality
Map: José Luis Martínez/Houston Landing"; container.appendChild(footer); yield container; const map = L.map(mapContainer).setView([29.8, -95.38], 9.5); map.attributionControl.setPrefix(""); const tiles = L.tileLayer( "https://{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}@2x.png", { attribution: '© OpenStreetMap contributors' } ).addTo(map); const getColor = (type) => { switch (type) { case "Title V Air Permit": return "blue"; case "IHWCA": return "red"; default: return "gray"; // Default color for unexpected types } }; data.forEach((d) => { const marker = L.circleMarker([d.lat, d.lon], { radius: .01, color: getColor(d["category"]), fillOpacity: 0.5 }).addTo(map); const popupContent = `

Site or company:
${d["company_name"].replace(/(.{30})/g, '$1
')}

`; marker.bindTooltip(popupContent, { permanent: false, direction: "top", className: "custom-tooltip" }); }); return container; }