KRBL/ArgusSite
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 2 Wiki Activity

update markers

Browse Source
This commit is contained in:
Ivan
2023-08-01 16:05:54 +03:00
parent dfc8c52d6a
commit f24a0c708a
2 changed files with 46 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
static/templates/live.html
View File

@ -517,7 +517,7 @@ const selectedDevices = Array.from(checkboxes)
.then(data => {
console.log(data.devicesData);
data.devicesData.forEach(device => {
const { serial, longitude, latitude, direction, speed } = device;
const { serial, status, longitude, latitude, direction, speed } = device;
var newDirection = direction + 90
console.log(newDirection);
@ -525,10 +525,10 @@ const selectedDevices = Array.from(checkboxes)
const el = document.createElement('div');
el.className = 'marker';
// el.style.transform = `rotate(${direction / 100}deg)`;
el.innerHTML = `<svg id="marker-${serial}" style="transform: rotate(${direction}deg)" xmlns="http://www.w3.org/2000/svg" width="26" height="26" viewBox="0 0 26 26" fill="none">
el.innerHTML = `<svg class="active-${status}" id="marker-${serial}" style="transform: rotate(${direction}deg)" xmlns="http://www.w3.org/2000/svg" width="26" height="26" viewBox="0 0 26 26" fill="none">
<path d="M12.9815 25.0195C19.5462 25.0336 24.9931 19.6101 25.0073 13.0454C25.0214 6.49253 19.5861 1.03375 13.0214 1.01961C6.46848 1.00549 1.02147 6.44081 1.00735 12.9937C0.993201 19.5584 6.42852 25.0054 12.9815 25.0195Z" fill="#8086F9"/>
<path d="M7.43175 18.2547L12.1398 6.33536C12.471 5.51254 13.5652 5.49137 13.8928 6.31561L18.5493 18.2786C18.8653 19.0675 17.9932 19.748 17.2537 19.0052L13.3092 15.0438C13.1215 14.8434 12.8862 14.8429 12.6975 15.0425L8.73605 18.9868C7.98152 19.7264 7.1124 19.0422 7.43175 18.2547Z" fill="white" fill-opacity="0.85"/>
</svg><br><span class="speed">${speed} км/ч</span>`;
</svg><br><span class="speed active-${status}">${speed} км/ч</span>`;
// Создание нового маркера на карте
const marker = new mapboxgl.Marker(el)
@ -551,7 +551,7 @@ function updateMapMarkers(devicesData) {
// Создание новых маркеров на карте на основе полученных данных
devicesData.forEach(device => {
const { serial, longitude, latitude, direction, speed } = device;
const { serial, status, longitude, latitude, direction, speed } = device;
var newDirection = direction + 90
console.log(newDirection);
@ -559,10 +559,10 @@ function updateMapMarkers(devicesData) {
const el = document.createElement('div');
el.className = 'marker';
// el.style.transform = `rotate(${direction}deg)`;
el.innerHTML = `<svg id="marker-${serial}" style="transform: rotate(${direction}deg)" xmlns="http://www.w3.org/2000/svg" width="26" height="26" viewBox="0 0 26 26" fill="none">
el.innerHTML = `<svg class="active-${status}" id="marker-${serial}" style="transform: rotate(${direction}deg)" xmlns="http://www.w3.org/2000/svg" width="26" height="26" viewBox="0 0 26 26" fill="none">
<path d="M12.9815 25.0195C19.5462 25.0336 24.9931 19.6101 25.0073 13.0454C25.0214 6.49253 19.5861 1.03375 13.0214 1.01961C6.46848 1.00549 1.02147 6.44081 1.00735 12.9937C0.993201 19.5584 6.42852 25.0054 12.9815 25.0195Z" fill="#8086F9"/>
<path d="M7.43175 18.2547L12.1398 6.33536C12.471 5.51254 13.5652 5.49137 13.8928 6.31561L18.5493 18.2786C18.8653 19.0675 17.9932 19.748 17.2537 19.0052L13.3092 15.0438C13.1215 14.8434 12.8862 14.8429 12.6975 15.0425L8.73605 18.9868C7.98152 19.7264 7.1124 19.0422 7.43175 18.2547Z" fill="white" fill-opacity="0.85"/>
</svg><br><span class="speed">${speed} км/ч</span>`;
</svg><br><span class="speed active-${status}">${speed} км/ч</span>`;
// Создание нового маркера на карте
const marker = new mapboxgl.Marker(el)