# Térkép és lista szinkronban (Map Sync)

> A Map Sync elem: a térkép mozgatásával vagy nagyításával a Map Listing és más listák is csak a látható terület elemeit mutatják.

A **Map Sync** elem (Elementorban widget, blokkszerkesztőben blokk, Bricksben elem) összekapcsolja a térképet a lekérdezéssel: amikor a látogató mozgatja vagy nagyítja a térképet, csak a látható területen lévő elemek maradnak a listában. A leírás Elementorra szól, de a három szerkesztőben a menet ugyanaz.

## Előkészítés

- Kapcsold be a **Térképes listák** modult a **JetEngine → JetEngine → Modulok** fülön.
- Kell egy listázási sablon a bejegyzésekhez, egy a térképhez, és egy **Térkép** vagy címet tároló metamező, amelyet a bejegyzéseknél kitöltöttél.
- A Map Sync a JetSmartFilters bővítménnyel együtt működik, ezért az is legyen aktív.

## Csak a Map Listing szűrése nagyításkor

1. Szerkeszd az oldalt vagy sablont, és add hozzá a **Map Sync** elemet.
2. Állítsd be a **Query ID** mezőt (például `map`). Ez az azonosító köti össze a Map Syncet a térképpel.
3. Add hozzá a **Map Listing** elemet. Válaszd ki a térképhez készített **Listing** sablont, és az **Address Meta Field** mezőbe írd a címet tároló metamező nevét.
4. A **Map Listing** **Advanced** fülén, a **Layout** részben a **CSS ID** mezőbe írd be ugyanazt az értéket, amit a Map Sync **Query ID** mezőjébe írtál.
5. Tedd közzé az oldalt.

A frontenden a térkép mozgatásakor és nagyításakor a látható határokon belüli elemek jelennek meg, a többi eltűnik.

Fontos: a Map Sync felülírja a lekérdezés középpontjának beállítását. A látogató mindig a határokon belüli elemeket látja, függetlenül a geokeresési lekérdezés beállításaitól.

## Map Listing és másik lista szinkronja

A Map Sync nemcsak a térképpel működik, hanem más elemekkel is: például egy Listing Griddel úgy, hogy a lista csak azokat az elemeket mutatja, amelyek a térképen éppen láthatók.

Ez a funkció jelenleg csak bejegyzésekre működik.

### Lekérdezés

1. A **JetEngine → Lekérdezéskészítő** oldalon hozz létre új lekérdezést, adj neki nevet (például „Ingatlanok térképes lekérdezése”).
2. A **Lekérdezés típusa** maradjon **Bejegyzések lekérdezése**, és az **Általános** fülön válaszd ki a bejegyzéstípust (például **Ingatlanok**).
3. A **Geo Search** fülön jelölj ki egy pontot a térképen (ennek környékét látják az oldal megnyitásakor), a **Címmező** mezőbe írd a címet tároló metamező **Name/ID** értékét, állítsd be a **Távolság**-ot és az **Egységek**-et.
4. Mentsd a lekérdezést.

Ha a használt metamező **Szöveg** típusú, kapcsold be a **JetEngine → Térképek beállításai** oldalon a **Preload coordinates by address** kapcsolót, és a **Meta fields to preload** mezőbe írd be a mező nevét, így a cím koordinátákká alakul.

### Az oldal

1. Tedd az oldalra a **Map Sync** elemet, és állítsd be a **Query ID** mezőt (például `map`), amellyel a **Map Listing** elemhez kapcsolódik.
2. Kapcsold be az **Additional Providers Enabled** kapcsolót.
3. Az **Additional Provider** mezőben válaszd ki a szolgáltatót (a példában **JetEngine**).
4. Az **Additional Query ID** mezőbe írj egy azonosítót (például `list`), amelyet a Listing Gridhez rendelsz. Több szolgáltatóhoz az **Add Item** gombbal új sort vehetsz fel.
5. Készíts kétoszlopos elrendezést. Az elsőbe tedd a **Listing Grid** elemet, válaszd ki a listázási sablont (például **Properties Listing Item**), az oszlopok száma legyen 1.
6. A **Custom Query** fülön kapcsold be a **Use Custom Query** kapcsolót, és válaszd ki a most létrehozott lekérdezést.
7. A **Listing Grid** **Advanced** fülén, a **Layout** részben a **CSS ID** mezőbe írd be az **Additional Query ID** értékét (`list`).
8. A másik oszlopba tedd a **Map Listing** elemet. Válaszd ki a térkép listázási sablonját, az **Address Meta Field** mezőbe írd a címet tároló mező nevét, és a **Posts Number** értékét emeld meg (például 20-ra), hogy több pont látsszon a térképen.
9. A **Map Listing** **Advanced** fülén a **CSS ID** mezőbe írd be a Map Sync **Query ID** értékét (`map`).
10. Mentsd az oldalt.

### Eredmény

A frontenden a térkép a lekérdezésben beállított pontra középez, és a lista még nincs szinkronban. A szinkron akkor indul, amikor mozgatod a térképet. Ha ráközelítesz egy területre, a Listing Gridben csak azok az elemek maradnak, amelyek a térképen is láthatók.

A Map Sync által kapott eredmények minden nézetben (Listing Grid, Dynamic Calendar, Map Listing, Products Grid, Products List és a többi) mindig a térképen kijelölt határokon belüli elemeket mutatják. A térképre alkalmazott szűrők viszont nem hatnak a többi nézet eredményére, és nem zárnak ki elemeket a Listing Gridből, a naptárból vagy a Map Listingből.

## Korlát: szűrőkkel nem használható egyszerre

Ha az oldalon **Location & Distance** vagy **User Geolocation** szűrő is van, a Map Syncel egyszerre nem használható: a térkép mozgatásakor ezek a szűrők alaphelyzetbe állnak. Ezekről a [Listázás földrajzi hely és távolság szerint](https://hub.hellowp.io/hu/plugins/jet-engine/listazas-geokereses/) fejezet szól.
