Yandex kaardistab api 2.1 ülemineku. Kiirendus- ja optimeerimistööd

Oleme välja andnud Yandex.Maps 2.1 API beetaversiooni. Selle peamine omadus on kaardi liidese täielik ümberkujundamine. Pealegi mõjutasid muudatused mitte ainult välimus, aga ka kaardi juhtelementide käitumist. Kuna algselt oli selge, et tagasiühilduvuse riket ei saa vältida, siis tegime ka API jõudluse parandamiseks vajalikke arhitektuurilisi muudatusi (neist lähemalt postituse lõpus).

Disaini osas oli meie jaoks oluline, et liides näeks ühtviisi hea välja erineva suurusega seadmetel ja ekraanidel. Üks peamisi raskusi on see, et me ei tea kunagi ette, milline sisseehitatud kaartidega teenus või sait välja näeb. Seetõttu pidime ümberkujunduse väljatöötamisel püüdma pakkuda võimalikult palju võimalusi.

Oma probleemide lahendamiseks otsustasime uus versioon rakendada adaptiivset liidese disaini. Veel ühel konverentsil tegid disainer madhare ja arendaja zloylos ettekande, miks me vajame kohanemisvõimet ja kuidas me seda API-s täpselt rakendasime. Selles postituses kirjeldan meie lahenduste tausta ja kontseptsiooni, räägin sellest, mis on veel versioonis 2.1-beeta uut ja mis veel muutub 2.1 väljalaske jaoks.

Miks me disainile mõtleme? Pärast versiooni 2.0 väljaandmist kirjutasime juba postituse, milles rääkisime oma lähenemisest API arendamisele. Kontseptsiooni olemus seisneb selles, et me ei tee toodet mitte ainult arendajatele, vaid ka neile, kes kasutavad oma töö tulemusi. Kui inimesel on meie kaartide kasutamine mugav ja meeldiv ning ta nõuab neid oma lemmikteenustest, on see tõeline edu. Samas peaks arendajatel olema ka lihtne ja meeldiv kasutajate soove rahuldada, mis tähendab, et peame nende tööd API-ga nii palju kui võimalik lihtsustama. Neid mõtteid silmas pidades alustasime tööd versiooni 2.0 kallal ja uuest 2.1 beetaversioonist sai sama kontseptsiooni loogiline jätk. Uurimine Vaadeldes meie API installatsioone ja analüüsides kaartide kasutamise juhtumeid, tuvastasime kaks peamist tüüpi arendajaid.
  • Nad lahendavad tüüpilisi probleeme, ei taha kulutada palju aega ja eelistavad valmis Yandexi liideseid. See on ligikaudu 90%.
  • Nad lahendavad ebastandardseid probleeme või eelistavad isegi standardprobleeme lahendada omal moel. Standardsed juhtnupud neile ei sobi. Vaja on kaartide tõsist kohandamist. Loogiline, et see on ülejäänud 10%.
Seega pidime kõigepealt hästi hakkama saama, jättes teiseks manööverdamisruumi. Need. valmistada komplekt valmislahendused, mis ise kontrollivad lõpliku kaardi välimust, s.t. “nad teevad seda hästi”, kuid samas saab neid soovi korral kohandada vastavalt enda vajadustele. Peamine ülesanne oli tasakaalu hoidmine.

Olles otsustanud vaatajaskonna üle, hakkasime uurima kasutusjuhtumeid. Selgus, et meie puhul on kummalisel kombel esmatähtis suurus. Saime 3+1 valikut: väikesed, keskmised, suured kaardi- ja mobiilisaidid.

Joonistame erineva suurusega kaartidele kujundusi. Kõige keerulisem on väikesed kaardid. Tundub, et kuna väike suurus Tasub eemaldada kõik kaardi juhtelemendid, kuid te ei taha ka funktsionaalsust kaotada. Seetõttu tegime eriti väikeste kaartide jaoks uued juhtelemendid:

Lisatud on ka uus juhtelement - "laienda kaarti täisekraanile". See säästab saidil ruumi, paigutades väikese kaardi ja lõppkasutajal on endiselt võimalus vaadata suur kaart. Kogu kaardi vajalik käitumine on API poolel juba programmeeritud. Üldiselt sündis selle nupu idee siis, kui mõtlesime sellele lahendusele mobiilseadmed. Mõistliku suurusega kaart töölaual võib mobiilseadmes täiesti kasutuks muutuda. Täisekraan lahendab selle probleemi:

Lisaks balunide disain väikesed suurused kart. Nüüd on väikestel kaartidel ja mobiilseadmete ekraanidel tavaline õhupall asendatud ekraani allservas oleva ribaga. See võimaldab hoida kaarti kasutajate jaoks informatiivsemana. Soovi korral saab selle valiku keelata.

Keskmiste kaartidega on kõik palju lihtsam. Sest ruumi on ümber pöörata:

Nagu suurte kaartide puhul:

Et arendajatel oleks kaardi juhtelementide valimine võimalikult lihtne, tegime erinevate kaardisuuruste jaoks kolm valmis komplekti.
map.controls.add("vaikimisi");
Saadaolevate võtmete loend:
smallMapDefaultSet // väikesele
mediumMapDefaultSet // normaalseks
largeMapDefaultSet // suurte jaoks

Vajalikud juhtelemendid saab muidugi ikkagi ise määrata.
myMap.controls .add("trafficControl") // traffic.add("searchControl") // search.add("zoomControl") // zoom control.add("typeSelector") // layers.add("geolocationControl " ) // geolocation.add("fullscreenControl") // täisekraan...

Kohandatavus Ei piisa lihtsalt liidese kujunduse renderdamisest erineva suurusega kaardi jaoks. Kaardiga lehekülge saab ju avada erinevatel ekraanidel. Seetõttu otsustati rakendada kaardiliideste adaptiivne käitumine. Erinevad liidese elemendid korraldavad ümber ja muudavad oma suurust olenevalt kaardikonteineri tegelikust suurusest.

Rakendasime adaptiivse käitumise läbi control.Manager . Saate selle määrata ka nende nuppude ja loendite jaoks, mille loote ise.


Kiirendus- ja optimeerimistööd Geoobjekt on kaardil peamine olem. Sellise tiitli eest tuleb tal maksta üsna keerulise ja tülika struktuuriga. Geoobjektide töö esimene iteratsioon seisnes koormuse jagamises nende loomise ajal. Püüdsime kõike taluda ettevalmistavad toimingud geoobjekti ehitajast kohtadesse, kus neid tegelikult vaja läheb. See andis palju häid tulemusi. Samuti tegime mõnes kohas olemite laisa initsialiseerimise _defineGetteri_ ja defineProperty abil (_defineGetter_, muide, on veidi kiirem). Oleme oma sündmuste süsteemis vähendanud geoobjekti sündmuste tellimuste arvu. Osaliselt aitas kaasa geoobjektide rühma korraga liitumise vastuvõtmine ja seejärel sihtobjekti määratlemine käitlejas. Siinkohal tuleb tunnistada, et kiirendust on tunda vaid dom- ja canvas-siltide peal, uued svg-sildid tuleb viimistleda (miks me seda beetaks kutsume? Sest beeta siis mitte midagi... ;)

Töötamise ajal oli meil aega selle tulemuste põhjal koodis veidi puhastada, siin on mikroleiud:
Mikrojäreldus 1. Käsitleja funktsiooni läbimisel on palju tulusam läbida funktsioon eraldi ja kontekst eraldi. Kui soovite kohe siduda, kaaluge, kas saate seda endale lubada.
Mikrojäreldus 2. Vähendage vahepealsete massiivide, objektide ja anonüümsete funktsioonide arvu. Neid ei puhasta prügivedaja alati hästi.

Muud muudatused
  • Versioonis API 2.0 peavad arendajad asukoha määramiseks IP või geolokatsiooni API abil kasutama oma vajalikud meetodid ja töödelda tulemust. Versioonis 2.1 lisate lihtsalt uue standardse juhtelemendi:
    juhtimine.GeolocationControl(parameetrid) Samuti on täiustatud API-s kasutatavat kasutaja asukoha mehhanismi. Nüüd valitakse brauseri geograafilise asukoha ja IP-aadressi järgi geolokatsiooni hulgast automaatselt kõige täpsem tulemus.
  • API standardsed sildid on SVG-s ümber joonistatud, mis tähendab, et neile saab anda kohandatud värve.
  • Paketisüsteem versioonis 2.1 kaotatakse. API-sid on muudetud nii, et need oleksid võimalikult suurel määral kohandatud API komponentide nõudmisel laadimisega, mille jaoks enamik vastendusi on viidud asünkroonsesse režiimi. Töö veel käib.
  • Sellise suure värskenduse jaoks pidime ohverdama tagasiühilduvuse versiooniga 2.0. Samuti võib versiooni 2.1 ametliku väljalaske tõttu beetaversiooni teatud osade tagasiühilduvus katkeda.
    • Klasterdaja muutub oluliselt.
    • Map.action.Manager kirjutatakse ümber.
    • Lubadused viiakse ellu vastavalt
  • Selles artiklis tahan alustada artiklite seeriat Yandex.Mapsi API-ga töötamise kohta. Yandex.Mapsi dokumentatsioon on üsna täielik, kuid selles sisalduva teabe killustatus on suur, kui te dokumentatsiooni esimest korda külastate, ei saa te seda ilma poole liitrita välja mõelda ja probleemi lahendada; võib kulutada palju aega dokumentatsiooni ja otsingumootori kaudu otsimisele. See artiklite seeria räägib praktilistest lahendustest kõige levinumate Yandex.Maps API kasutamise juhtumitele, mille kirjutamise ajal oli uusim versioon 2.1.

    Kodulehe kontaktandmetesse paigutamisel on sageli vaja sisestada kaart, millele märgitakse selle organisatsiooni asukoht, mille jaoks veebisaiti arendatakse. Lihtsamal juhul võib see olla lihtsalt võrgukaartidelt (või mitte võrgus) pärit ekraanipilt:

    Kaardikujundajat saab kasutada interaktiivse kaardi sisestamiseks
    https://tech.yandex.ru/maps/tools/constructor/ :

    Kui vajame kaartide täpsemat kasutamist (oma sildid, kaartide programmiline liikumine jne), siis selleks peame kasutama Yandex.Maps API-t: https://tech.yandex.ru/maps/jsapi/ . Kaartide kasutamise näitena käsitletakse selles artiklis kaardi loomist, lisades lihtsalt kohandatud sildi ja õhupalli.

    Esiteks ühendame API komponendid:

    Kui arendate kaartide abil suurt rakendust, on parem ühendada teatud versiooni API komponendid, nii et Yandexi poolel API värskendamisel ei puruneks tootmises midagi:

    Kaart tuleb paigutada mõnda plokki, näiteks sisse div#kaart. Järgmisena tuleb selles plokis kaart luua (pärast kaardi ja DOM-i valmisoleku sündmuse käivitamist):

    ymaps.ready(init); funktsioon init() ( var myMap; myMap = new ymaps.Map ("kaart" , ( keskpunkt: [ 55.76 , 37.64 ], suum: 7 ) ) ; )

    Siin näitame:

  • ploki identifikaator "kaart", kus koostame kaardi;
  • Keskus— kaardi keskpunkt, mis näitab laiust ja pikkuskraadi;
  • suumi— kaardi mõõtkava tegur.
  • Vaikimisi loob Yandex.Maps palju tarbetuid elemente, mida enamikul juhtudel veebisaitidel vaja ei lähe. Põhimõtteliselt piisab, kui rakendada juhtnuppudele ja kaardi käitumisele 2 tingimust:

  • Kaardielementidest on ainult suumi liugur;
  • Kaardi mõõtkava ei tohiks hiirt kerides muuta.
  • Nende nõuete täitmiseks täiendame koodi:

    ymaps.ready(init); funktsioon init() ( var myMap; myMap = new ymaps.Map ("kaart", ( keskel: [ 55.76, 37.64 ], suum: 13, juhtnupud: ) ) ; myMap.behaviors .disable ( "scrollZoom") ; myMap. controls.add("zoomControl" , ( asukoht: ( üleval: 15 , vasakul: 15 ) ) ;

    Siin oleme puudega "scrollZoom" ja lisas "zoomControl" asukohaga ülemisest vasakust nurgast.

    Nüüd peame lisama artiklile kaardile nööpnõela, laadima selle pildi saidilt http://medialoot.com/item/free-vector-map-location-pins/ alla ja asetama selle koodi; järgmisel viisil:

    ymaps.ready(init); funktsioon init() ( var myMap; myMap = new ymaps.Map ("kaart", ( keskel: [ 55.7652, 37.63836 ], suum: 17, juhtnupud: ) ) ; myMap.behaviors .disable ( "scrollZoom") ; myMap. juhtelemendid .add ( "zoomControl" , ( positsioon: ( üleval: 15 , vasakul: 15 ) ) ) var myPlacemark = new ymaps.Placemark ( [ 55.7649 , 37.63836 ] , ( ) , ( iconLayout: "H, ikoon" vaikimisi #imamage : , iconImageSize: [ 40 , 51 ] , iconImageOffset: [ - 20 , - 47 ] ) ) ) myMap.geoObjects .add (myPlacemark) ;

    Siin deklareerime muutuja myPlacemark, mille esimesse parameetrisse kirjutame markeri ymaps.Kohamärk Näitame märgi koordinaadid ja kolmandas parameetris:

  • sisse märkima ikooniPaigutus et kasutatakse kohandatud sildi pilti;
  • iconImageHref— tee pildile;
  • ikoonPildi suurus— näidata pildi mõõtmed;
  • iconImageOffset— näitame nihet pildi vasakpoolsest ülanurgast pildil olevasse punkti, millele osutame vajaliku helitugevuse suunas. See on vajalik selleks, et kaardi skaleerimisel märgi asukoht kaotsi ei läheks. Miks nihe on näidatud negatiivsetes väärtustes - API loojat teab ainult jumal.
  • Ja läbi myMap.geoObjects.add() lisage kaardile märk.

    Nüüd teeme õhupalli, mis kuvatakse, kui klõpsate kaardisildil, võtame õhupalli paigutuse ja selle sisu aadressilt http://designdeck.co.uk/a/1241;

    ymaps.ready(init); funktsioon init() ( var myMap; myMap = new ymaps.Map ("kaart", ( keskel: [ 55.7652, 37.63836 ], suum: 17, juhtnupud: ) ) ; myMap.behaviors .disable ( "scrollZoom") ; myMap. juhtelemendid .add ( "zoomControl" , ( asukoht: ( üleval: 15 , vasakul: 15 ) ) ; var html = "" html += " " ; html += "" ; html += "

    Victoria torni aiad

    " ; html += "" ; html += "

    Londoni linn

    " ; html += "" ; html += "

    Ühendkuningriik

    " ; html += "

    020 7641 5264

    " ; html += "" ; html += "" ; var myPlacemark = new ymaps.Placemark ([ 55.7649 , 37.63836 ] , ( balloonContent: html ) , ( ikoonPaigutus: "vaikimisi#pilt" , ikoonImageHref: " http:// sait/failid/apiyamaps1/min_marker.png ", IconimageSize: [40, 51], IconimageOffset: [ - 20, - 47], BalloonLayout:" Vaikimisi#ImageWithContent ", BalloonContesze: [289, 151], BalloonimageHref:" Http: "Http:" Http: "Http:" Http: "Http:" //site/files/APIYaMaps1/min_popup.png" , balloonImageOffset: [ - 144 , - 147 ] , balloonImageSize: [ 289 , 151 ] , balloonShadow: false ) ) ; myjects.geomarke)

    Siin me:

  • V õhupallSisu määrake sisu, mida õhupalli avamisel kuvatakse;
  • õhupalli paigutus— näitame, et õhupallipaigutusena kasutatakse kohandatud pilti;
  • balloonContentSize Ja balloonImageSize— vastavalt sisu ja pildi suurused;
  • balloonImageHref— tee pildile;
  • balloonImageOffset— nihe vasaku ülanurga suhtes;
  • balloonVari— õhupalli varju keelamine (ei mõjuta kohandatud piltide puhul midagi).
  • Väljalaskekandidaat on API versioon, mis on avalikuks kasutamiseks saadaval, kuid on veel kinnitamisel. Enne väljalasekandidaadi installimist stabiilse versioonina testitakse seda kohe pärast selle väljalaskmist vigade suhtes, mis võivad põhjustada API funktsionaalsuse halvenemist. Kasutades oma projektides väljalaskekandidaate, saate aidata meil võimalikud vead õigeaegselt tuvastada. Saate oma rakenduse toimimist eeltestida ka API uue versiooniga.

    Väljalaskekandidaate tuleks kasutada rakenduste arendus- ja testimiskeskkonnas. See aitab vältida vigu tootmiskeskkonnas. Saate lubada väljalaskekandidaadi järgmiselt.

    Kui mõni aeg pärast väljalasekandidaadi avaldamist ei leita vigu, mis viivad funktsionaalsuse halvenemiseni, installitakse väljalasekandidaat API stabiilse versioonina ja sellele pääseb juurde lingi api-maps.yandex.ru/2.1 kaudu.

    Praeguse versiooni lubamine

    Rakenduse kasutamisel soovitame määrata põhiversiooni (st ärge määrake versiooni kolmandat numbrit). See tagab, et praegune versioon, st vastava põhiversiooni uusim stabiilne versioon, lülitatakse automaatselt sisse. Näiteks kui määrate versiooni 2.1, lubatakse uusim saadaolev stabiilne versioon 2.1.x (näiteks 2.1.47):

    Määratud versiooni lubamine

    Kuigi väikeversioonide vahel on täielik ühilduvus tagatud, võite harvadel juhtudel avastada, et teie klientrakendus ei tööta nii nagu ette nähtud, kui lubate uusima API versiooni. Nende olukordade vältimiseks peate võib-olla eriti kriitilistel juhtudel lubama konkreetse API versiooni. Selleks määrake selle number tervikuna:

    Märge. Kui kasutate kindlat versiooni, proovige seda regulaarselt uuemale versioonile vahetada (näiteks iga paari kuu tagant). Asi on selles, et aja jooksul saame teie projektis kasutatava alaversiooni keelata ja seejärel lubatakse API praegune versioon automaatselt. Versioonivärskendus võib aga põhjustada teie rakenduse korrektse töötamise. Sel põhjusel soovitame seda sa hoiad

    jälgige API värskendusi ja lülituge niipea kui võimalik uuematele versioonidele.

    Kokkuvõttev tabel

    Allolev tabel annab soovitusi API erinevate versioonide lubamiseks, olenevalt teie projekti tüübist ja keerukusest.
    Projekti tüüp

    Projekti tüüp Soovitatav versioon rakenduste käitamiseks Soovitatav versioon on väljatöötamisel

    Keskmised ja suured projektid põhikaardiga

    Funktsionaalsuse testimiseks uusim versioon.

    Keskmised ja suured keerukate kaardifunktsioonidega projektid

    Funktsionaalsuse testimiseks seadistage versioon.

    Projektid, mis kasutavad API kommertsversiooni

    Määra versioon (vt allolevat märkust)

    Märge.

    Kui kasutate määratud versiooni, proovige seda regulaarselt uuemale versioonile vahetada. Asi on selles, et aja jooksul saame teie rakenduses kasutatava alaversiooni keelata ja seejärel lubatakse API praegune versioon automaatselt. Versioonivärskendus võib aga põhjustada teie rakenduse korrektse töötamise. Sel põhjusel soovitame teil API värskendusi jälgida ja esimesel võimalusel uuematele versioonidele üle minna.

    29. aprillil 2014 teatati, et Yandex.Maps API 2.1 uus versioon lahkub beetaolekust ja nüüd saate sellele turvaliselt üle minna. Järgmistes postitustes kavatsen teile seda API versiooni tutvustada. Põhiline

    — kaardiliideste uus adaptiivne disain;

    — multiruuter — võimalus ehitada ühe marsruudi asemel kõik võimalikud marsruudid;

    modulaarne süsteem API. Kõikide API moodulite loend on toodud teatmeteoses.

    uus viis objektide kuvamine kaardil, mis võimaldab luua rohkem märke kui versioonis 2.0.

    Üksikasjalikku dokumentatsiooni Yandex.Maps API 2.1 uue versiooni kohta saab lugeda.

    Vaatame lihtsaimat näidet kaardi loomisest Yandex.Maps 2.1 API abil.

    Siin on tema kood:

    Lihtsaim näide kaardi loomine Yandex.Maps API 2.1 abil. var myMap; // Oodake, kuni API laaditakse ja DOM on valmis. ymaps.ready(init); function init () ( // Kaardi eksemplari loomine ja selle sidumine konteineriga // antud ID-ga ("kaart"). myMap = new ymaps.Map("map", ( // Kaardi lähtestamisel tuleb määrake // selle keskpunkt ja skaleerimisfaktor: , //. Nižni Novgorod suum: 12 )); )

    Kohe alguses ühendame kaartide API aadressil http://api-maps.yandex.ru/

    Vaatame parameetreid lähemalt:

    lang – määratud kahe parameetriga language_region,

    keel – kahekohaline keelekood. Näidatud sisse ISO formaat 639-1.
    piirkond – kahekohaline riigikood. Määratud ISO 3166-1 formaadis.

    Praegu toetatakse järgmisi lokaate:

    lang=ru_RU;
    lang=et_EE;
    lang=ru_UA;
    lang=uk_UA;
    lang=tr_TR.

    Täiendavaid parameetreid saab kasutada:

    koordinaator – geograafiliste koordinaatide määramise järjekord API funktsioonides, mis aktsepteerivad sisendina pikkus-laiuskraadi paare (nt kohatähis).

    Võimalikud väärtused:

    latlong - [laiuskraad, pikkuskraad] - kasutatakse vaikimisi;
    longlat – [pikkuskraad, laiuskraad].

    Vaikeväärtus: latlong.

    load — laaditud moodulite loend.

    Vaikeväärtus: package.full.

    režiim — API laadimisrežiim.

    mode=release – API-koodi saab alla laadida pakendatud kujul, et minimeerida liiklust ja brauseri täitmiskiirust;
    mode=debug – allalaadimisrežiim lähtekoodi kujul.

    Vaikeväärtus: vabastamine.

    Ühenduse parameetrite kohta saate rohkem lugeda

    Kaardi kuvamiseks on määratud konteinerina, mille suurus ei ole null;

    Kaardi parameetrid määratakse koodis:

    myMap = new ymaps.Map('map', (
    keskus: , // Nižni Novgorodi kaardi keskus
    suum: 12 - suumitase
    });

    Peaksite looma kaardi pärast kogu veebilehe laadimist. See tagab, et kaardi konteiner on loodud ja sellele pääseb ligi ID-ga. Kaardi lähtestamiseks pärast lehe laadimist saate kasutada funktsiooni ready().

    Valmis funktsioon kutsutakse välja, kui API laaditakse ja DOM on moodustatud

    ymaps.ready(init);

    funktsioon init() (
    // Looge kaardi eksemplar ja siduge see konteineriga
    // antud id ("kaart").
    myMap = new ymaps.Map('map', (
    // Kaardi lähtestamisel tuleb täpsustada
    // selle keskpunkt ja skaleerimisfaktor.
    keskus: , // Nižni Novgorod
    suum: 12
    });

    Vaikimisi kuvatakse kaardil kõik saadaolevad juhtelemendid.

    Kaardi tüüp - diagramm.

    API pakub viit sisseehitatud kaarditüüpi:

    Skeem (yandex#map) - vaikimisi;
    satelliit (yandex#satellite);
    Hübriid (yandex # hübriid);
    Rahvakaart (yandex#publicMap);
    Avaliku kaardi hübriid (yandex#publicMapHybrid).

    Näide kaardi tüübi määramisest Satelliit

    Näidiskood:

    Valime kaardi tüübi – satelliit. Näide kaardi loomisest Yandex.Maps API 2.1 abil. body, html ( polster: 0; veeris: 0; laius: 100%; kõrgus: 100%; ) var myMap; // Oodake, kuni API laaditakse ja DOM on valmis. ymaps.ready(init); function init () ( // Kaardieksemplari loomine ja selle sidumine konteineriga // antud ID-ga ("kaart"). myMap = new ymaps.Map("map", ( // Kaardi lähtestamisel tuleb määrake // selle keskpunkt ja suumitegur: , // Nižni Novgorodi suum: 12, tüüp: "yandex#satellite" )).

    Nagu ma juba ütlesin, lisatakse vaikimisi kaardile vaikimisi juhtelementide komplekt "mediumMapDefaultSet".

    Kaardile vajalike juhtelementide lisamiseks saate juhtelementide parameetris selle loomisel määrata vastavate võtmete loendi.

    Siin on näidiskood kaardi mõõtkava ja tüübi juhtelementide jaoks.

    Näidiskood:

    body, html ( polster: 0; veeris: 0; laius: 100%; kõrgus: 100%; )

    Kaardi juhtnupud. Näide kaardi loomisest Yandex.Maps API 2.1 abil. body, html ( polster: 0; veeris: 0; laius: 100%; kõrgus: 100%; ) var myMap; // Oodake, kuni API laaditakse ja DOM on valmis. ymaps.ready(init); function init () ( // Kaardi eksemplari loomine ja selle sidumine konteineriga // antud ID-ga ("kaart"). myMap = new ymaps.Map("map", ( // Kaardi lähtestamisel tuleb määrake // selle keskpunkt ja suumitegur: , // Nižni Novgorodi suum: 12, juhtnupud: ["zoomControl", "typeSelector"] ));

    Kaardi käitumist on võimalik määrata käitumise parameetri abil.

    Selle väärtuste määramisega saame lubada või keelata erinevaid kaardi käitumise parameetreid:

    suumi kaarti topeltklõpsuga hiirenupuga;

    kaardi lohistamine hiire või ühe puutega;

    kaardi suumimine, kui valite ala hiire vasaku nupuga;

    suumi kaarti multi-touch puute abil;

    kaardi suumimine ala valimisel hiire parema nupuga;

    kauguse mõõtmine;

    kaardi suumimine hiirerattaga.

    Näidiskood, kus hiireratta suum on keelatud.

    body, html ( polster: 0; veeris: 0; laius: 100%; kõrgus: 100%; )

    Kaardi käitumise juhtimine. Näide kaardi loomisest Yandex.Maps API 2.1 abil. body, html ( polster: 0; veeris: 0; laius: 100%; kõrgus: 100%; ) var myMap; // Oodake, kuni API laaditakse ja DOM on valmis. ymaps.ready(init); function init () ( // Kaardi eksemplari loomine ja selle sidumine konteineriga // antud ID-ga ("kaart"). myMap = new ymaps.Map("map", ( // Kaardi lähtestamisel tuleb määrake // selle keskpunkt ja suumitegur: , // Nižni Novgorodi suum: 12 ));

    Kaardi parameetreid on võimalik muuta pärast selle loomist.

    Lubage suumimine hiirerattaga

    myMap.behaviors.enable("scrollZoom");

    Lülita välja

    myMap.behaviors.disable("scrollZoom");

    Installige uut tüüpi Narodnaja kaardid

    myMap.setType('yandex#publicMap');

    Uue kaardikeskuse seadistamine

    Praeguseks kõik.

    Jätkub…

    Seotud väljaanded