Currently i am having problem in determining if the markers is inside of the circle array or not.The code that i have provided manages to know the markers only for one to two circle while the rest does not know.
Quote:
The code of creating the circle
$.ajax({
type: "GET",
url: 'http://localhost:59927//api//Values//FlagingDevice(WithoutParameters)',
contentType: 'application/json; charset=utf-8',
dataType: 'json',
success: function (data, status, xhr) {
for (var i = 0; i < data.Table.length; i++) {
circle[i] = L.circle([data.Table[i].Latitude, data.Table[i].Longitude], 50, { color: '#FFFFFF', opacity: 0.5, fillColor: 'white', fillOpacity: .3 }).addTo(map);
}
},
error: function (xhr) {
alert(xhr.responseText);
}
});
Quote:
The code in determine if the markers is inside the circles array
$.ajax({
type: "POST",
url: '',
data: {
Name: value
},
success: function (data, status, xhr) {
for (var s = 0; s < marker1.length; s++) {
map.removeLayer(marker1[s]);
}
for (var i = 0; i < data.length; i++) {
var value = i + 1;
if (circle[i].contains(L.latLng([data[i].Latitude, data[i].Longitude]))) {
var customPopup1 = 'Station: ' + data[i].StationName;
var customOptions1 =
{
'maxWidth': '500',
'className': 'custom'
};
circle[i].bindPopup(customPopup1, customOptions1);
}
else {
marker1[i] = L.marker([data[i].Latitude, data[i].Longitude]).addTo(map);
var customPopup = 'Latitude: ' + data[i].Latitude + '</br>Longitude: ' + data[i].Longitude
+ '</br>Station: ' + data[i].StationName + ' </br>Box: ' + data[i].Name + '</br>Timestamp: ' + data[i].LocationSend
+ `<br/><a href='/Home/History?DeviceID=${value}'>Click here for Location History</a><br/>`;
marker1[i].bindPopup(customPopup);
}
}
setTimeout(function () { getCookie("Token", variable); }, 10000);
},
error: function (xhr) {
alert(xhr.responseText);
}
});
What I have tried:
I have tried to research for solution however to no avail