Estoy usando Leaflet para mostrar las próximas jornadas de puertas abiertas en un mapa a partir de los datos que recibo al obtener JSON de una URL.
El único valor con el que tengo que trabajar es: "ACTRIS_OpenHousePublicUpcoming":"Public: Sun 5 Sep, 3:00PM-5:00PM"
Puedo convertir esta fecha al 5 de septiembre de 2021 usando lo siguiente:
ophouse = ACTRIS_OpenHousePublicUpcoming; const [weekday,month,day,h1,h2] = ophouse.substr(8).split(/[\s,-]+/); var d = new Date(); var n = d.getFullYear(); var openhousedate = [month,day, n].join(" "); var formatted = openhousedate; const javaScriptRelease = new Date(formatted); const javaScriptRelease2 = new Date("2021/09/21"); Desde aquí he intentado ocultar cualquier marcador que esté en el pasado ocultando la .leaflet-marker-icon . Agregué el registro de la consola para asegurarme de que funcionaba y cada resultado regresa con el registro correcto (es decir, en el pasado o próximo).
if (javaScriptRelease2 < javaScriptRelease) { console.log('open house in the future'); } else { console.log('open house in the past'); $(".leaflet-marker-icon").css("dislpay", "none"); $(".leaflet-shadow-pane").css("dislpay", "none"); }Por alguna razón esto no está funcionando. Se han ocultado muchos marcadores si uso
$(".leaflet-marker-icon").css("opacity", "0");pero todavía hay jornadas de puertas abiertas vencidas que aparecen en los resultados. Además, cuando hago zoom, aparecen todos los resultados y ninguno está oculto.
¿Hay una mejor manera de lograr ocultar estos marcadores?
Aquí hay un JsFiddle de mi código completo... no funciona porque tengo que ocultar el token de API. https://jsfiddle.net/planbjz/2aL0vbju/2/
Simplemente no cree un marcador de folleto en absoluto cuando tenga un punto de datos caducado:
if (javaScriptRelease2 < javaScriptRelease) { console.log('open house in the future'); // Create a corresponding Marker var marker = L.marker([element.Latitude, element.Longitude]).bindPopup('my content'); markers.addLayer(marker); } else { console.log('open house in the past'); // Do nothing }