javascript — круги в API Карт Google

В настоящее время у меня есть маркеры для всех моих субподрядчиков на карте. У меня есть переменная для каждой строки в базе данных, содержащая количество миль, которые они готовы проехать.

Как бы я добавил круги, которые покрывают эту область?

<script>
/*
* MAP 2
*/
jQuery(function() {
"use strict";

// init map
var map = new GMaps({
div: '#applicantLocation',
lat: 39.8282,
lng: -85.4373943,
zoom: 4
});

<?php

$sql = "SELECT * FROM vendorApps ORDER BY `dateReceived` DESC";
$result = $conn->query($sql);

if ($result->num_rows > 0) {
include "includes/php/getTimeAgo.php";
// output data of each row
while($row = $result->fetch_assoc()) {
$zip    = $row["zip"];
$getZip = "SELECT `lat` , `lng` FROM `zips` WHERE `zip` =  \"$zip\" ";
$getZipResult = $conn->query($getZip);

if ($getZipResult->num_rows > 0) {
// output data of each row
while($getZipRow = $getZipResult->fetch_assoc()) {

$vendor_lat = $getZipRow['lat'];
$vendor_lng = $getZipRow['lng'];

$link = '<a href="applicantProfile.php?appID='.$row["vendorAppID"].'">';
echo '

// add Vendor marker
map.addMarker({
lat: '.$vendor_lat.',
lng: '.$vendor_lng.',
title: "'.$row["fName"].' '.$row["lName"].'",
infoWindow: {
content: "'.$row["fName"].' '.$row["lName"].' is a '.$row["vendorType"].' in '.$row["city"].', '.$row["state"].'."}
});
';
}
}
}
}
?>
});
</script>

1

Решение

Ваш код не показывает попытку добавить круг, но вот как вы можете это сделать:

Круг имеет radius и center имущество:

радиус | Тип: число — радиус в метрах на поверхности Земли

центр | Тип: LatLng — Центр

Проверить Ссылка.

Так что вам нужно будет перевести свою стоимость из миль в метры: http://www.metric-conversions.org/length/miles-to-meters.htm

Пример:

var cityCircle = new google.maps.Circle({
strokeColor: '#FF0000',
strokeOpacity: 0.8,
strokeWeight: 2,
fillColor: '#FF0000',
fillOpacity: 0.35,
map: map,
center: new google.maps.LatLng(10,20), // replace lat (10) and lng (20) with your $vendor_lat and $vendor_lng values
radius: radius // your converted value from miles to meters
});

редактировать:

Поскольку вы используете Gmaps, проверьте ссылку здесь:
https://hpneo.github.io/gmaps/documentation.html#GMaps-drawCircle

Так что я думаю, вы должны использовать map.drawCircle()

map.drawCircle({
lat: '.$vendor_lat.',
lng: '.$vendor_lng.',
radius: radius // your converted value from miles to meters
// other options go here (see below)
});

Все другие варианты, которые вы можете использовать в соответствии с Google Maps ссылка в документации gmaps упоминается следующее:

drawCircle принимает любую опцию, определенную в google.maps.CircleOptions, и любое событие, определенное в google.maps.Circle (раздел «События»).

4

Другие решения

Других решений пока нет …

По вопросам рекламы [email protected]