Arhiva pentru tagul “Harti”

Hărţi (cu surse) schimbabile

După cum mai spuneam şi prin alte articole, e bine că avem opţiuni pentru hărţi (Google, Yahoo, Microsoft, şi nu numai, oferă aşa ceva), mai ales că acoperirea unor aceloraşi zone diferă între servicii. Şi atunci e normal că cineva s-a întrebat la un moment dat: nu ar fi frumos să ai aceeaşi zonă cu sursa de hartă uşor schimbabilă? Dacă nu citiţi prin RSS/email acest articol atunci mai jos vedeţi în acţiune ideea. SwitchMaps este o pagină web ce permite să generezi rapid o astfel de hartă, primind la final un cod de folosit: sau varianta iframe, sau varianta link. Vedeţi lista derulantă din colţul stânga-sus? De acolo puteţi schimba uşor pe harta Bing sau Yahoo).


Hărţile Microsoft au mai evoluat

Hărţile Microsoft au devenit Hărţile Live, iar mai apoi Hărţile Bing (adresa: Bing.com/maps/). Iar un anunţ de ieri ne spune că se lucrează la ele, adăugându-se noi facilităţi. Dacă aţi mai folosit hărţile Microsoft veţi observa schimbările (dincolo de cele provocate de integrarea cu Bing). Controalele pentru navigare arată acum puţin altfel, dar marea noutate este banda de instrumente ce apare la baza coloanei din stânga. La zoom in şi out vom vedea acum nişte elemente ajutătoare, ce ne permit să sărim direct la nivel de ţară, oraş sau stradă. Apropo: m-am uitat la străzile unor oraşe mai mari şi e îmbucurător nivelul de detaliu.

imagine

Dar Microsoft se laudă cel mai mult cu noul sistem pentru rute. Cum nu sunt şofer, habar nu …


Google îl dă pe Mihai drept exemplu

Un român trebuie să fie foarte mândru astăzi: Mihai e prezentat ca Featured Map Maker de însuşi colosalul Google. Mă rog, de fapt de blogul Google pentru Google Earth & Maps, dar e suficient. Şi cu el mulţi români se pot simţi mândri. Ştiţi probabil în câte rânduri am criticat – şi în 2006, când eram pată albă 100%, şi în 2009 – slaba prezentare a României pe hărţile Google. Dar de când ţara noastră a fost inclusă în Google Map Maker lucrurile s-au schimbat radical şi se dezvoltă cu rapiditate. Începem să fim mai mulţumiţi, deşi mai e muuult de lucru. Iar cât priveşte StreetView, încă Norc.ro suplineşte bine o parte din nevoi.

 imagine

Dar să revenim la …


Calcularea distanţelor pe hărţile Google

Vă amintiţi că acum câteva zile v-am arătat cum din câteva linii de cod putem face o webaplicaţie care să ne spună distanţa dintre două puncte? Mihai mi-a recomandat o webaplicaţie mai complexă. Evident, ceea ce am scris eu era doar de dragul introducerii în API-ul de la Google Maps. Google Maps Distance Calculator merge pe aceeaşi idee dar mult mai departe. După cum puteţi vedea mai jos, webaplicaţia permite stabilirea unui traseu mai lung, care nu mai e limitat la două puncte. De exemplu traseul de mai jos ni se spune că ar avea – atenţie! în linie dreaptă! nu pe şosele! – aproximativ 1082 de kilometri.

imagine

Un marcator odată pusă poate fi mutat pe hartă, fără probleme (iar linia cu traseul este evident redesenată). …


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 …


ChartsBin: date statistice puse în hărţi

ChartsBin este un proiect interesant. Practic îşi propune să arate tot felul de date statistice (unele utile… altele parcă luate din rubrica mondenă…) în grafice interactive. Mai jos vedeţi versiunea embed pentru o hartă cu distribuirea cinematografelor – e 100% statică. Dar daţi click pe ea şi veţi ajunge la harta interactivă. Iar dacă ţineţi mouse-ul peste România veţi vedea că noi avem – cică – 73 de cinematografe, pe când vecina Ungarie 216. Un click pe References de sub grafic vă va dezvălui în fiecare caz care este sursa datelor.

Number of Cinema Screens by Country

Vizitând situl veţi putea descoperi tot felul de hărţi: câte animale pe cale de dispariţie sunt în fiecare ţară; vârsta medie a primelor relaţii sexuale; emisiile de C2O pe ţară; dar şi statistici despre câştigătorii premiilor Nobel (deja am …


uMapper îţi permite să foloseşti hărţile proprii

Despre uMapper am scris încă de când era în stadiul alfa. Este una dintre webaplicaţiile cele mai bune când vine vorba de hărţi. Folosind API-urile surselor clasice de hărţi (Google, Microsoft, Yahoo…) uMapper oferă un set de instrumente intuitive pentru a face hărţile mai funcţionale. Am văzut anul acesta că poţi face şi jocuri cu hărţi (dă click cât mai aproape de localitatea unde în anul X s-a născut Y). Şi uMapper continuă să crească. Într-un email primit astăzi cu noutăţile recente am aflat despre o facilitate lansată acum câteva săptămâni care, cel puţin după cunoştinţele mele, este unică: poţi să foloseşti propriile tale hărţi!!!

Să zicem că vrei să afişezi o hartă cu România cum arăta înainte de ciopârţirea ei sau să foloseşti o hartă cu lumea …


Şi GMS lipeşte hărţi

Acum câteva luni am scris articolul Google Map Buddy lipeşte hărţi. Sunt mai multe astfel de programe, iar recent am testat GMS (de la Google Map Saver). Este un mic program ce nu necesită instalare, deci poate fi folosit imediat. Introduceţi locaţia dorită, eventual coordonatele dacă vreţi să fiţi mai exact, alegeţi un factor de zoom şi stilul de hartă. La rezoluţii aveţi diverse opţiuni, până la 4096×4096 de pixeli (din câte înţeleg teoretic poţi salva şi hărţi mai mari, dar autorul nu recomandă). Mai rămâne să daţi Save Image (după ce v-aţi asigurat că totul arată cum aţi dori) şi gata! Foarte util dacă mergeţi undeva (alt oraş, altă ţară) şi doriţi o hartă rapid, de păstrat în format electronic sau tipărit.

imagine

Un …


Cum pun în situl meu o hartă Google (II)

Ridicăm miza articolului precedent. Presupunând că aţi înţeles ce făceam acolo, acum dorim să evidenţiem pe hartă locul unde este firma noastră. Mai mult, marcatorul să fie clickabil şi la un click să dea informaţii suplimentare. Evident, ceea ce vedeţi mai jos, cu puţină pricepere, poate fi adaptat pentru a arăta o serie de obiective pe o hartă, fiecare cu informaţii suplimentare la un click.

Liniile noi sunt de la 18 la 40. În prima linie nouă definim icoana pe care o folosim pentru a arăta locaţia noastră. Am făcut pentru aceasta un PNG cu iconiţa. Avem apoi o variabilă cu coordonatele firmei şi creăm marcatorul. Simplu! Ca la un click să arate un text, mai întâi definim textul, creăm o fereastră de informaţii ce va fi afişată pe evenimentul „click”, urmărit de marcator prin funcţia „addListener”.

Vedeţi rezultatul în acţiune, într-o pagină separată, aici. Cu puţin CSS puteţi face …


Cum pun în situl meu o hartă Google

Am văzut că de ceva vreme România este ceva mai bine prezentă pe Google Maps. Dacă sunteţi într-unul dintre oraşele ce au mai multe date introduse, veţi dori poate să includeţi o hartă în situl propriu. De exemplu pentru a arăta sediul firmei. Cât de greu este? Pornind de la un tutorial găsit aici am pus laolaltă liniile de cod necesare pentru a atinge strict acest scop: al afişării hărţii. Dar într-un prim pas ne trebuie coordonatele locaţiei. O căutăm pe Maps.Google.com după care dăm click pe Link. Primul câmp text ne oferă o adresă ce conţine coordonatele. Căutaţi-le în acea adresă după ll=.

Acum că ştim coordonatele, mai trebuie doar codul următor.

[HTML]

function initializare() {
var coordonate = new google.maps.LatLng(46.76991,23.58844);
var setari = {
zoom: 16,
center: coordonate,
mapTypeControl: true,
mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU},
navigationControl: true,
navigationControlOptions: {style: google.maps.NavigationControlStyle.SMALL},
mapTypeId: google.maps.MapTypeId.ROADMAP
};