Xəritəni saytınıza əlavə edin

Bir <script> taqı — üçüncü tərəf yox, yalnız bizim skript. Açar domenə bağlıdır: başqası açarınızı götürsə belə, öz saytında işlədə bilməz.

nümunə seç

Tam xəritə — filtrli

Bütün data qatları sağdakı paneldən açılıb-bağlanır: qəsəbə, kənd, küçə, metro və 9 obyekt kateqoriyası. Xəritə hərəkət etdikcə görünən sahə üçün marker-lər yüklənir.

inteqrasiya kodu

<div id="az-map" style="height:460px"></div>
<script src="https://azerbaijanmap.ubermensch.cc/embed.js"
        data-key="SİZİN_EMBED_AÇARINIZ"
        data-mode="map"
        data-types="metro,Tibb"
        data-target="#az-map"></script>

data-types — başlanğıcda aktiv qatlar. Panel istifadəçiyə qalanını açmağa imkan verir.

Ən yaxın 20 — realtime konum izləmə

Konum icazəsindən sonra istifadəçinin mövqeyi canlı izlənir (watchPosition): nöqtə hərəkət etdikcə xəritədə sürüşür, dəqiqlik dairəsi göstərilir və 120 m-dən çox yerdəyişmədə ən yaxın 20 məkan avtomatik yenilənir. Markerə basanda ad, növ, ünvan və məsafə kart şəklində açılır.

inteqrasiya kodu

<div id="az-nearest" style="height:460px"></div>
<script src="https://azerbaijanmap.ubermensch.cc/embed.js"
        data-key="SİZİN_EMBED_AÇARINIZ"
        data-mode="nearest"
        data-live="1"        <!-- realtime izləmə; birdəfəlik üçün silin -->
        data-limit="20"
        data-target="#az-nearest"></script>

Konum yalnız brauzerdə istifadə olunur — serverə yazılmır, saxlanmır.

Bakı metrosu — real xəritədə

Üç xətt öz rəsmi rəngləri ilə, stansiyalar düzgün sırayla xətt boyunca birləşdirilir (qol stansiyaları — Bakmil, Xocəsən — qırıq xətlə). Qovşaq stansiyaları qalın halqa ilə seçilir; paneldən xətləri ayrıca yandırıb-söndürmək olar.

inteqrasiya kodu

<div id="az-metro" style="height:460px"></div>
<script src="https://azerbaijanmap.ubermensch.cc/embed.js"
        data-key="SİZİN_EMBED_AÇARINIZ"
        data-mode="metro"
        data-target="#az-metro"></script>

Stansiya kartında xətt, sıra nömrəsi və qovşaq məlumatı göstərilir.

Canlı axtarış + xəritə

Yaz-axtar qutusu: səhv yazılışa dözümlü axtarış (bdu, yasamal aptek, sabuncu…) — nəticələr xəritədə göstərilir.

inteqrasiya kodu

<div id="az-search" style="height:460px"></div>
<script src="https://azerbaijanmap.ubermensch.cc/embed.js"
        data-key="SİZİN_EMBED_AÇARINIZ"
        data-mode="search"
        data-target="#az-search"></script>

Kateqoriya xəritəsi

Yalnız seçilmiş kateqoriya(lar) — məsələn bütün Tibb obyektləri (xəstəxana, aptek, klinika). Kliniki saytlar, aptek şəbəkələri, filial xəritələri üçün ideal.

inteqrasiya kodu

<div id="az-med" style="height:460px"></div>
<script src="https://azerbaijanmap.ubermensch.cc/embed.js"
        data-key="SİZİN_EMBED_AÇARINIZ"
        data-mode="category"
        data-types="Tibb"
        data-center="40.401,49.867" data-zoom="12"
        data-target="#az-med"></script>

Tək məkan kartı

Ad yazırsınız — biz tapıb xəritədə kartla göstəririk. Ofisinizin "bizi tapın" xəritəsi üçün ən sadə yol.

inteqrasiya kodu

<div id="az-place" style="height:460px"></div>
<script src="https://azerbaijanmap.ubermensch.cc/embed.js"
        data-key="SİZİN_EMBED_AÇARINIZ"
        data-mode="place"
        data-q="İçərişəhər metro"
        data-target="#az-place"></script>

Hamısı birlikdə

Filtrli tam xəritə + üstündə canlı axtarış qutusu — portal / kataloq saytları üçün hazır kombinasiya.

inteqrasiya kodu

<div id="az-full" style="height:520px"></div>
<script src="https://azerbaijanmap.ubermensch.cc/embed.js"
        data-key="SİZİN_EMBED_AÇARINIZ"
        data-mode="map"
        data-search="1"
        data-types="metro,Tibb,Restoran və Kafe"
        data-center="40.394,49.867" data-zoom="12"
        data-target="#az-full"></script>

Fərdiləşdirmə — rəng, marker, kart

Hər şey sizin əlinizdədir: kateqoriya rəngləri (data-colors), marker növü — nöqtə və ya damcı-pin (data-marker), ölçüsü, kartda hansı sətirlərin görünəcəyi (data-card). Aşağıda Tibb qatı çəhrayı pin-lərlə, kartda yalnız ad + növ + ünvan.

inteqrasiya kodu

<div id="az-custom" style="height:460px"></div>
<script src="https://azerbaijanmap.ubermensch.cc/embed.js"
        data-key="SİZİN_EMBED_AÇARINIZ"
        data-mode="category"
        data-types="Tibb"
        data-colors='{"Tibb":"#e91e8c"}'
        data-marker="pin" data-marker-size="30"
        data-card="ad,tip,unvan"
        data-center="40.383,49.85" data-zoom="14"
        data-target="#az-custom"></script>

<!-- JS API ilə TAM custom kart da mümkündür: -->
<script>
AzMap.render('#az-custom', {key:'AÇAR', mode:'category', types:'Tibb',
  card: m => `<b>${m.ad}</b><br>☎ Zəng: <a href="tel:012">012</a>`});
</script>

Xəritə stilləri

7 hazır stil: işıqlı, qaranlıq (dark), klassik, sadə (yazısız), voyager, relyef, peyk. data-style ilə başlanğıc stil, data-styles="1" ilə istifadəçiyə seçici panel. Aşağıda qaranlıq rejim + sağ-altda stil seçici.

inteqrasiya kodu

<div id="az-dark" style="height:460px"></div>
<script src="https://azerbaijanmap.ubermensch.cc/embed.js"
        data-key="SİZİN_EMBED_AÇARINIZ"
        data-mode="map"
        data-style="qaranliq"     <!-- isiqli | qaranliq | klassik | sade | voyager | relyef | peyk -->
        data-styles="1"           <!-- stil seçici paneli -->
        data-types="metro,Restoran və Kafe"
        data-center="40.394,49.86" data-zoom="12"
        data-target="#az-dark"></script>

Xəritənin küncündəki yazı defolt «CC | AzərbaycanMap»-dır — admin embed açarı verərkən istəyə görə dəyişə bilər.

Naviqasiya — sürətölçən + nəqliyyat

Google Maps-vari canlı gediş rejimi: konum realtime izlənir, seçdiyiniz nəqliyyat işarəsi (🚗 avtomobil / 🚴 velosiped / 🚶 piyada) yolda hərəkət edir və istiqamətə görə dönür, gedilən yol izi çəkilir, aşağıda sürətölçən HUD: ani sürət (km/s), yol, müddət, orta sürət.

inteqrasiya kodu

<div id="az-nav" style="height:460px"></div>
<script src="https://azerbaijanmap.ubermensch.cc/embed.js"
        data-key="SİZİN_EMBED_AÇARINIZ"
        data-mode="track"
        data-vehicle="car"        <!-- car | bike | walk (istifadəçi də dəyişə bilir) -->
        data-style="voyager"
        data-target="#az-nav"></script>

Sürət cihazın GPS-indən gəlir (yoxdursa məsafə/zamandan hesablanır). Konum serverə yazılmır.

3D sürüş — əsl WebGL naviqasiya

Həqiqi 3D (MapLibre GL, WebGL): perspektivli səhnə, 3D binalar, gediş istiqamətinə hamar fırlanan kamera — Google Maps sürüş rejimi kimi. 8 nəqliyyat modeli (sedan, SUV, idman, pikap, mikroavtobus, motosiklet, velosiped, piyada) — kuzov/paltar rəngi rəng düyməsi ilə seçilir, piyada yeriyəndə addımlayır. 2D/3D düyməsi kamera bucağını dəyişir.

inteqrasiya kodu

<div id="az-3d" style="height:460px"></div>
<script src="https://azerbaijanmap.ubermensch.cc/embed.js"
        data-key="SİZİN_EMBED_AÇARINIZ"
        data-mode="track"
        data-view="3d"            <!-- arxadan izləmə (2D/3D düyməsi ilə dəyişilir) -->
        data-vehicle="sedan"      <!-- sedan | suv | sport | pikap | van | moto | bike | walk -->
        data-color="#e63b46"      <!-- maşın / velosiped / paltar rəngi -->
        data-style="voyager"
        data-target="#az-3d"></script>

Kamera, fırlanma və sprite-lər tam bizim skriptdədir — əlavə kitabxana yüklənmir.

açar

Embed / API açarı üçün müraciət

Açarlar əl ilə verilir. Formu doldurun — Qiyas sizə dönüş edəcək. Embed açarı yazdığınız domenə bağlanır: yalnız sizin saytınızdan işləyir.