--> */ function NMap(params) { //initialize a map, zoomSnap enables smaller zoom intervals, intial view is center of texas. 5.75 is initial zoom level let map = L.map("ecoregion_map", { zoomSnap: 0.25 }).setView( [31.75, -99.9], 5.75 ); //select a tile layer //https://leaflet-extras.github.io/leaflet-providers/preview/ L.tileLayer( "https://server.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer/tile/{z}/{y}/{x}", { maxZoom: 15, minZoom: 5, attribution: "Tiles © Esri — Esri, DeLorme, NAVTEQ, TomTom, Intermap, iPC, USGS, FAO, NPS, NRCAN, GeoBase, Kadaster NL, Ordnance Survey, Esri Japan, METI, Esri China (Hong Kong), and the GIS User Community", } ).addTo(map); //prevents map pins that overlap from being hidden //https://github.com/jawj/OverlappingMarkerSpiderfier-Leaflet const OMS = new OverlappingMarkerSpiderfier(map); // ZIP CODE lookup API link // https://www.geonames.org/ const zipLookupURL = "http://api.geonames.org/postalCodeSearchJSON?username=jlienhard&country=US&postalcode="; // Address lookup API link // https://geocoding.geo.census.gov/geocoder/ const addressLookupURL = "https://geocoding.geo.census.gov/geocoder/locations/onelineaddress?benchmark=2020&format=json&address="; //additional options for map icons // https://github.com/masajid390/BeautifyMarker const iconOptions = { borderWidth: 3, iconShape: "marker", iconSize: [30, 30], iconAnchor: [15, 30], innerIconAnchor: [0, 5.5], }; //add texas boundry geojson to map L.geoJSON(texasGeo, { style: { weight: "5", fillOpacity: 0, color: "#3c5799" }, }).addTo(map); //add layer controller to map. this is used for the layer toggle checkboxes const layerControl = L.control .layers(null, null, { collapsed: false }) .addTo(map); /* This will create a legend based on the level 3 ecoregions. It will be loaded if either the level 3 ecoregion or level 4 ecoregions are loaded. If both ecoregions are not shown by default, this will be minimized on load. */ if (params.eco3Load === true || params.eco4Load === true) { //add legend to map const level3legend = L.control({ position: "bottomright" }); //add legend level3legend.onAdd = function (map) { const div = L.DomUtil.create("div", "lvl3legend"); const items = L.DomUtil.create("div", "legend-items"); div.appendChild(items); items.innerHTML += "
Level 3 Ecoregions Loading
${ecoregion.info}
Reference: Griffith, Bryce, Omernick & Rodgers (2007). Ecoregions of Texas.`); l3sidebar.show(); }) .addTo(level3Layer); } //add the layer to the map if (params.eco3Show === true) { map.addLayer(level3Layer); } //add layer to overlay so it can be toggled layerControl.addOverlay(level3Layer, "Level 3 Ecoregions"); }); }; loadLevel3Ecos(); //initialize sidebar const l3sidebar = L.control.sidebar("l3sidebar", { position: "left", }); //add controls to sidebar map.addControl(l3sidebar); } /* *eco4Load* will load the level 3 ecoregion data. Must be TRUE in order for eco4Show to work. *eco4Show* will automatically populate the map with the level 4 ecoregions. If not selected, the ecoregions & legend (for level 3 ecoregions) will load, but will be toggled off & minimized respectively. */ if (params.eco4Load === true) { //initialize ecoregion layer const level4Layer = new L.layerGroup(); //add loading spinner while ecoregions load document.querySelector("#ecoregion_map").insertAdjacentHTML( "afterend", `Level 4 Ecoregions Loading
${ecoregion.info}
Reference: Griffith, Bryce, Omernick & Rodgers (2007). Ecoregions of Texas.`); l4sidebar.show(); }) .addTo(level4Layer); } if (params.eco4Show === true) { //add the layer to the map map.addLayer(level4Layer); } //add layer to overlay so it can be toggled layerControl.addOverlay(level4Layer, "Level 4 Ecoregions"); }); }; loadLevel4Ecos(); const l4sidebar = L.control.sidebar("l4sidebar", { position: "right", }); map.addControl(l4sidebar); } /* *chapterLoad* will load the chapter location pins & chapter counties to create a "heatmap". Must be TRUE in order for chapterShow to work. *chapterShow* will automatically populate the map with the chapter location pins & chapter counties. If not selected, the chapter location pins & chapter counties will load but will be toggled off. */ if (params.chapterLoad === true) { const loadChapters = async () => { const chapterOptions = { ...iconOptions }; chapterOptions.borderColor = "#3c5799"; chapterOptions.textColor = "#3c5799"; chapterOptions.icon = "users"; //initialize layer for chapter pins const chapterPins = new L.LayerGroup(); //initialize layer for chapter counties const chapterCounties = new L.LayerGroup(); //storage for chapter counties const countyArr = []; //add loading spinner while ecoregions load document.querySelector("#ecoregion_map").insertAdjacentHTML( "afterend", `Chapters Loading
${ele.title.rendered} Chapter
`; let popup = `${ele.acf.ch_tag}
${ ele.acf.ch_email === "" ? "" : `Email Us${nursery.title.rendered}
`; //build popup let popup = `We Ship!
" : "" } Visit our Homepage`; if (nursery.acf.map_item_associated_organization) { popup += `Associated Chapters
`; nursery.acf.map_item_associated_organization.forEach((ele) => { const chapter = ele.replace(/ +/g, "-").toLowerCase(); popup += `${ele}${garden.title.rendered}
`; //build popup let popup = `Address: ${ garden.acf.map_item_loc.address }
Learn about this garden ${ garden.acf.map_item_external_url ? `Associated Chapters
`; garden.acf.map_item_associated_organization.forEach((ele) => { const chapter = ele.replace(/ +/g, "-").toLowerCase(); popup += `${ele}${garden.title.rendered}
`; //build popup let popup = `Address: ${ garden.acf.map_item_loc.address }
${ garden.acf.map_item_exit_number ? `Exit: ${garden.acf.map_item_exit_number}
` : "" }Associated Chapters
`; garden.acf.map_item_associated_organization.forEach((ele) => { const chapter = ele.replace(/ +/g, "-").toLowerCase(); popup += `${ele}${garden.title.rendered}
`; //build popup let popup = `Address: ${ garden.acf.map_item_loc.address }
Learn about this garden ${ garden.acf.map_item_external_url ? `Associated Organizations
`; garden.acf.map_item_associated_organization.forEach((ele) => { popup += `${ele}
`;
});
}
const marker = L.marker(
[garden.acf.map_item_loc.lat, garden.acf.map_item_loc.lng],
{
icon: L.BeautifyIcon.icon(gardenOptions),
}
)
.addTo(gardenPins)
.bindTooltip(tooltip)
.bindPopup(popup);
OMS.addMarker(marker);
}
map.addLayer(gardenPins);
layerControl.addOverlay(
gardenPins,
" Native Plant Gardens"
);
};
loadNativeGarden();
}
};
fetchMapData();
if (
params.eco3Show !== true &&
params.eco4Show !== true &&
params.chapterLoad !== true
) {
document.querySelector(".spinner-container").hidden = true;
}
}
/*
*speaker* will load & show the speaker locations.
*/
if (params.speaker === true) {
const url = "https://npsot.org/wp-json/wp/v2/speaker_bureau/?per_page=100";
const speakerArr = [];
const fetchSpeakerData = async () => {
try {
let speakerRes = await fetch(url);
let speakerJSON = await speakerRes.json();
speakerArr.push(speakerJSON);
} catch (error) {
console.log(error);
}
const speakerData = await Promise.all(speakerArr);
if (params.speaker) {
//initialize layer for speaker pins
const OMS = new OverlappingMarkerSpiderfier(map);
const speakerPins = new L.LayerGroup();
const speakerOptions = { ...iconOptions };
speakerOptions.icon = "graduation-cap";
speakerOptions.textColor = "#C41E3A";
speakerOptions.borderColor = "#C41E3A";
speakerOptions.backgroundColor = "rgba(255,255,255,0.8)";
const allSpeakers = speakerData[0].filter(
(ele) => ele.acf.speaker_post_type === "Speaker"
);
for (speaker of allSpeakers) {
//build tooltip
let tooltip = `
${speaker.title.rendered}
`; //build popup let popup = `Lives in ${ speaker.acf.speaker_location.city }
${ speaker.acf.driving_distance > 1 ? `Speaker will drive ${speaker.acf.driving_distance} miles
` : "Speaker does not travel
" } View this Speaker's Info`; if (speaker.acf.speaker_affiliation) { let speakerAffiliations = speaker.acf.speaker_affiliation.split(", "); popup += `Associated Organization${ speakerAffiliations.length > 1 ? "s" : "" }
`; speakerAffiliations.forEach((ele) => { popup += `${ele}
`; }); } const marker = L.marker( [ speaker.acf.speaker_location.lat, speaker.acf.speaker_location.lng, ], { icon: L.BeautifyIcon.icon(speakerOptions), } ) .addTo(speakerPins) .bindTooltip(tooltip) .bindPopup(popup) .on("click", function (e) { const regex = /"([^"]*)"/g; const data = e.target._tooltip._content.match(regex); const circle = L.circle( [data[1].slice(1, -1) * 1, data[2].slice(1, -1) * 1], { color: "#C41E3A", radius: data[0].slice(1, -1) * 1609, } ).addTo(map); circle.on("click", () => { circle.remove(); }); }); OMS.addMarker(marker); } map.addLayer(speakerPins); layerControl.addOverlay( speakerPins, " Speakers Bureau" ); } }; fetchSpeakerData(); if ( params.eco3Show !== true && params.eco4Show !== true && params.chapterLoad !== true ) { document.querySelector(".spinner-container").hidden = true; } } } //this toggles the legend when the toggle legend button is clicked const toggleLegend = () => { const legend = document.querySelector(".legend-items"); legend.style.display === "none" ? (legend.style.display = "block") : (legend.style.display = "none"); }; Skip to contentSpeaker: Sarah Ziomek
More details coming soon!
Fort Worth Botanic Gardens in the Rose Room
3220 Botanic Garden Blvd, Fort Worth, Texas 76107
6:15 pm Socializing & snacks
6:30 pm Business meeting and announcements
The presentation will follow our business meeting.
This meeting is hybrid; in person with a virtual Zoom option.