Съдържание
Можете да персонализирате карта на Google, за да отговори на специфичните нужди на аудиторията на уебсайта ви с API на Google Maps 3.0. Един от методите за персонализация е да се вмъкне кръг, който показва радиус на разстоянието около определено място. Можете например да покажете радиуса от пет километра около туристическо място, така че посетителите да могат да видят близките хотели и ресторанти. За да създадете радиус на разстояние около местоположение или точка, използвайте класа "Кръг" на Google Maps.
Етап 1
Отворете HTML файла и отидете в раздела, който съдържа кода на картата на Google.
Стъпка 2
Превъртете надолу кода, докато намерите този, който определя местоположението на маркера. За да намерите лесно отметката, потърсете думата „google.maps.Marker“ в HTML файла.
Стъпка 3
Отдолу, където дефинирате маркера, създайте слоя "Кръг" и го прикрепете към него. Например въведете:
var circleExample = new google.maps.Circle ({map: map
Стъпка 4
Добавете радиуса на кръга, който ще бъде около маркера в метри:
var circleExample = new google.maps.Circle ({карта: радиус на картата: 5000
Стъпка 5
Създайте цвят на запълване за кръга. Определяте цвета, използвайки шестнадесетичен формат. Например въведете:
var circleExample = нов google.maps.Circle ({карта: радиус на картата: 5000 fillColor = #FFFFFF});
Стъпка 6
Свържете или добавете кръга към маркера:
var circleExample = нов google.maps.Circle ({карта: радиус на картата: 5000 fillColor = #FFFFFF}); circleExample.bindTo (‘карта’, маркер);
Стъпка 7
Запазете картата и тествайте. Google Maps ще покаже бял кръг с радиус 5000 метра около местоположението на маркера.