Distanţa dintre două puncte pe harta Google


Acum o săptămână am povestit despre cum pun în situl meu o hartă Google. Vă propun să mergem mai departe. Mai mult de joacă am scris câteva linii de cod care ilustrează mai multe concepte. În primul rând data trecută un marcator era fixat. În exemplul de astăzi ambii marcatori pot fi deplasaţi prin tragere cu mouse-ul. Tot ce trebuie pentru aceasta e să adăugăm draggable: true la opţiuni la crearea marcatorului. Iniţial am pus un marcator dar apoi m-am gândit să pun doi şi să fac ceva: să măsor distanţa între ei. (Mutaţi-i vă rog mai jos.)

Evident, nu am calculat-o (deşi se putea) cu vreo formulă matematică, ci folosind funcţia distanceFrom. Aveţi mai jos codul pentru un marcator (identic, de fapt în oglindă, e pentru celălalt) şi după cum vedeţi calcularea distanţei e simplă: obţii poziţia marcatorilor şi apelezi funcţia amintită. Apoi afişăm într-un balon informaţia. Ca să fie mai interesant exemplul, am şi desenat o linie între cele două puncte. (Aceasta ar trebui suplimentar să vă atragă atenţia că distanţa e calculată în linie dreaptă, nu pe şosea, deci nu vă miraţi dacă veţi estima distanţa dintre Bucureşti şi Baia Mare că iese mult mai mică decât o ştiţi.) Nu e simplu?

[JAVASCRIPT]GEvent.addListener(marker1, „dragend”, function() {
var location1 = marker1.getLatLng();
var location2 = marker2.getLatLng();
var distanta = location1.distanceFrom(location2);
distanta=Math.round(distanta/1000);
marker1.openInfoWindowHtml(„Dupa indelungi eforturi
am calculat distanta
„+
„dintre punctul A si punctul B.
Rezultatul: „+distanta+ „km.„);
map.removeOverlay(oldpolyline);
var polyline = new GPolyline([location1,location2], „#cc0000”, 2);
oldpolyline=polyline;
map.addOverlay(polyline);
});[/JAVASCRIPT]

Dacă vreţi să aprofundaţi exemplul, uitaţi-vă în sursa acestei pagini web.

PS: Dacă micşoraţi harta puteţi estima şi distanţa Iaşi-Paris şi altele. Nu foarte util, dar merge de dragul demonstraţiei tehnice.

PS2: Dacă încep să vă placă hărţile Google şi vreţi să lucraţi cu ele, puteţi folosi marcatorii (peste 600) oferiţi aici. Sunt pe categorii şi numărul lor creşte constant.


Apreciază articolul:

1 stea2 stea3 stea4 stea5 stea (8 evaluări, media: 4,38 din 5)
Loading...Loading...

4 comentarii

  1. Nei Nicolau spune:

    Salut!
    Citesc toate articolele postate pe CNet.ro… foarte interesante… Am invatat si mai am de invatat foarte multe din aceste articole. Am inceput sa citesc despre jQuery si am trecut apoi la Ext JS (nu sunt articole despre Ext JS pe site – am 3 manuale in format electronic daca te intereseaza)… Tot in faza de incepator sunt.
    In acest moment incerc sa ma documentez si sa invat despre hartile dinamice Google.
    Ma intereseaza modalitatile prin care se pot adauga markere pe o harta dinamica, markerele sa poata fi mutate (draggable) si in final sa se preia intr-o baza de date pozitia markerelor si sa se calculeze ruta (nu distanta in linie dreapta).
    Mi-ar fi de mare ajutor unele sfaturi… ce API sa studiez V2 sau V3… cateva exemple de cod.
    Multumesc si o zi buna.

  2. radu.capan spune:

    Multumesc de aprecieri. Pentru ceea ce va intereseaza ca prima trimitere nu am decat „locul de joaca” (cu coduri ce pot fi modificate chiar acolo)
    http://code.google.com/apis/ajax/playground/
    pe langa API-ul oficial (2 si 3)
    http://code.google.com/intl/ro-RO/apis/maps/
    cu
    http://code.google.com/intl/ro-RO/apis/maps/documentation/v3/examples/index.html
    si
    http://code.google.com/intl/ro-RO/apis/maps/documentation/v3/demogallery.html

  3. florin_olt spune:

    Foarte interesant…

  4. ovidiu spune:

    Salut!
    Cum putem calcula vizibilitatea intre cele doua puncte?


Lasă un răspuns

Adresa ta de email nu va fi publicată. Câmpurile necesare sunt marcate *