Vous pouvez déclencher un certain nombre de fonctions Javascript. Il est possible d'ajouter des JS personnalisés directement dans les paramètres du plugin. Pour cela, rendez-vous à l'adresse suivante Ouvrir la carte de l'utilisateur > Paramètres > Avancés > JS personnalisé.

Voici quelques cas d'utilisation possibles :

Recharger la carte

Cela peut être utile si vous utilisez un plugin de mise en cache ou de préchargement de page. Parfois, le préchargement bloque le chargement de la carte OUM, de sorte qu'il faut la recharger.

oumMap.invalidateSize();

Voler vers un autre lieu

Utilisez la fonction JS suivante après le chargement de votre page. Les paramètres nécessaires sont la latitude, la longitude et le zoom.

oumMap.flyTo([40.737, -73.923], 8);

Voler jusqu'à la position actuelle de l'utilisateur

Utilisez la fonction JS suivante pour déclencher un clic sur le bouton "Montrez-moi où je suis".

document.querySelector('.leaflet-control-locate a').cliquer();

Ouvrir le formulaire "Ajouter un lieu

Utilisez la fonction JS suivante pour déclencher un clic sur le bouton "+" afin d'ouvrir le formulaire "Ajouter un lieu".

document.querySelector('#open-add-location-overlay').cliquer();

Activer/désactiver une catégorie de marqueurs

Utilisez la fonction JS suivante pour déclencher un clic sur un marqueur de catégorie. Le nombre (par exemple "3") correspond à la position de la catégorie dans la liste des catégories.

document.querySelector('.leaflet-control-layers-overlays label:nth-child(3)').cliquer();

Pour activer ou désactiver toutes les catégories de marqueurs en même temps, vous pouvez utiliser cet extrait :

document.querySelectorAll('.leaflet-control-layers-overlays label').forEach((catégorie) => {
  catégorie.cliquer()
});

Pour activer une catégorie de marqueurs spécifique au chargement de la page, vous pouvez utiliser ce snippet. Il suffit d'ajouter le paramètre ?oum-category=3 à votre URL au chargement de la page. Le nombre (par exemple "3") correspond à la position de la catégorie dans la liste des catégories. Voir cet exemple.

// Function to get the value of a specific URL parameter
function getQueryParam(param) {
  const urlParams = new URLSearchParams(window.location.search);
  return urlParams.get(param);
}

// Get the 'oum-category' parameter value from the URL
const categoryNumber = getQueryParam('oum-category');
  
// Check if the 'oum-category' parameter is present
if (categoryNumber !== null) {
  // Click all categories first
  document.querySelectorAll('.leaflet-control-layers-overlays label').forEach((category) => {
    category.click();
  });

  // Click specifically on the label based on the 'oum-category' value
  // Convert categoryNumber to a 1-based index for :nth-child() selector
  const categoryIndex = parseInt(categoryNumber, 10);
  if (!isNaN(categoryIndex)) { // Ensure categoryNumber is a valid number
    const targetLabel = document.querySelector(`.leaflet-control-layers-overlays label:nth-child(${categoryIndex})`);
    if (targetLabel) {
      targetLabel.click();
    } else {
      console.error('Specified category index is out of range.');
    }
  } else {
    console.error('Invalid category number specified in the URL parameter.');
  }
}

Remplir automatiquement le champ des sous-titres

Lorsque l'utilisateur recherche et clique sur une adresse suggérée dans le formulaire "Ajouter un lieu", le champ sous-titre peut être automatiquement rempli avec le nom de ce lieu :

oumMap2.addEventListener('geosearch/showlocation', fonction(e) { 
  document.querySelector('#oum_location_address').valeur = e.location.label ;
});