Radial Distance Google Maps API izmantošana

Saturs

• 1. solis
• 2. solis
• 3. solis
• 4. solis
• 5. solis
• 6. solis
• 7. solis

Izmantojot Google Maps 3.0 API, varat pielāgot Google karti, lai tā atbilstu jūsu vietnes auditorijas īpašajām vajadzībām. Viena no personalizācijas metodēm ir ievietot apli, kas parāda attāluma rādiusu ap konkrētu vietu. Jūs varat, piemēram, parādīt piecu kilometru rādiusu ap tūristu vietu, lai apmeklētāji varētu redzēt tuvumā esošās viesnīcas un restorānus. Lai izveidotu attāluma rādiusu ap atrašanās vietu vai punktu, izmantojiet Google Maps klasi "Loks".

1. solis

Atveriet HTML failu un dodieties uz sadaļu, kurā ir Google kartes kods.

2. solis

Ritiniet kodu uz leju, līdz atrodat to, kas nosaka marķiera atrašanās vietu. Lai ērti atrastu grāmatzīmi, meklējiet HTML failā terminu "google.maps.Marker".

3. solis

Zem marķiera definēšanas izveidojiet slāni "Circle" un piestipriniet to. Piemēram, ierakstiet:

var circleExample = new google.maps.Circle ({karte: karte

4. solis

Pievienojiet apļa rādiusu, kas būs ap marķieri metros:

var circleExample = new google.maps.Circle ({karte: kartes rādiuss: 5000

5. solis

Izveidojiet apļa aizpildījuma krāsu. Jūs definējat krāsu, izmantojot heksadecimālo formātu. Piemēram, ierakstiet:

var circleExample = new google.maps.Circle ({karte: kartes rādiuss: 5000 fillColor = #FFFFFF});

6. solis

Saistiet vai pievienojiet loku marķierim:

var circleExample = new google.maps.Circle ({karte: kartes rādiuss: 5000 fillColor = #FFFFFF}); circleExample.bindTo (’karte’, marķieris);

7. solis

Saglabājiet karti un pārbaudiet. Google Maps rādīs baltu apli ar 5000 metru rādiusu ap marķiera atrašanās vietu.