1. Startseite
  2. Wissensdatenbank
  3. Personalisierung
  4. Auslösen von Kartenaktionen mit Javascript

Auslösen von Kartenaktionen mit Javascript

Sie können eine Reihe von Javascript-Funktionen auslösen. Es ist möglich, benutzerdefiniertes JS direkt in den Plugin-Einstellungen hinzuzufügen. Gehen Sie zu Öffnen Sie User Map > Einstellungen > Erweitert > Custom JS.

Hier sind einige mögliche Anwendungsfälle:

Laden Sie die Karte neu

Dies kann hilfreich sein, wenn Sie ein Caching- oder Page-Preloading-Plugin verwenden. Manchmal blockiert das Vorladen das Laden der OUM-Karte, so dass sie neu geladen werden muss.

JavaScript
oumMap.invalidateSize();

Zu einem anderen Ort fliegen

Verwenden Sie die folgende JS-Funktion, nachdem Ihre Seite geladen wurde. Die erforderlichen Parameter sind Breitengrad, Längengrad und Zoom.

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

Fliegen zur aktuellen Benutzerposition

Verwenden Sie die folgende JS-Funktion, um einen Klick auf die Schaltfläche "Zeige mir, wo ich bin" auszulösen.

JavaScript
Dokument.querySelector('.leaflet-control-locate a').anklicken.();

Öffnen Sie das Formular "Ort hinzufügen".

Verwenden Sie die folgende JS-Funktion, um einen Klick auf die "+"-Schaltfläche auszulösen, um das Formular "Ort hinzufügen" zu öffnen.

JavaScript
jQuery(Dokument).bereit(Funktion() {
  Dokument.querySelector('#open-add-location-overlay').anklicken.();
});

Aktivieren/Deaktivieren einer Markierungskategorie

Verwenden Sie die folgende JS-Funktion, um einen Klick auf eine Markierungskategorie auszulösen. Die Zahl (z. B. "3") ist die Position der Kategorie in der Kategorieliste.

JavaScript
jQuery(Dokument).bereit(Funktion() {
  Dokument.querySelector('.oum-filter-list label:nth-of-type(3)').anklicken.();
});

Um alle Markierungskategorien gleichzeitig zu aktivieren oder zu deaktivieren, können Sie dieses Snippet verwenden:

JavaScript
jQuery(Dokument).bereit(Funktion() {
  Dokument.querySelectorAll('.oum-filter-list Bezeichnung').forEach((Kategorie) => {
    Kategorie.anklicken.()
  });
});

Um eine bestimmte Markerkategorie beim Laden der Seite zu aktivieren, können Sie dieses Snippet verwenden. Fügen Sie einfach beim Laden der Seite den Parameter ?oum-category=3 in Ihre URL ein. Die Zahl (z. B. "3") steht für die Position der Kategorie in der Kategorieliste. Siehe dieses Beispiel.

JavaScript
// 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('.oum-filter-list 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(`.oum-filter-list label:nth-of-type(${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.');
  }
}

Automatisches Ausfüllen des Feldes für den Untertitel

Wenn der Benutzer eine vorgeschlagene Adresse im Formular "Ort hinzufügen" sucht und anklickt, kann das Feld "Untertitel" automatisch mit dem Namen des Ortes ausgefüllt werden:

JavaScript
oumMap2.addEventListener('geosuche/showlocation', Funktion(e) { 
  Dokument.querySelector('#oum_Ort_Adresse').Wert = e.location.label;
});
War dieser Artikel hilfreich?

Verwandte Artikel


DE