KRBL/ArgusSite
6
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
Signed by untrusted user who does not match committer: ppechenkoo
GPG Key ID: 0C191B86D9582583
2 changed files with 46 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

67
server.js
View File

@ -34,17 +34,17 @@ app.get("/devices/drivers", drivers);
app.get("/devices/update", update); app.get("/devices/update", update);
// const DB_User = process.env.DB_USER; const DB_User = process.env.DB_USER;
// const DB_Password = process.env.DB_PASSWORD; const DB_Password = process.env.DB_PASSWORD;
// const DB_Host = process.env.DB_HOST; const DB_Host = process.env.DB_HOST;
// const DB_Port = process.env.DB_PORT; const DB_Port = process.env.DB_PORT;
// const DB_Name = process.env.DB_NAME; const DB_Name = process.env.DB_NAME;
const DB_User = "postgres"; // const DB_User = "postgres";
const DB_Password = "password"; // const DB_Password = "password";
const DB_Host = "postgres"; // const DB_Host = "postgres";
const DB_Port = "5432"; // const DB_Port = "5432";
const DB_Name = "postgres"; // const DB_Name = "postgres";
async function index(req, res) { async function index(req, res) {
var templateData = { var templateData = {
@ -161,10 +161,13 @@ app.post("/devices-geo", async (req, res) => {
// console.log(selectedDevices); // console.log(selectedDevices);
const placeholders = selectedDevices const placeholders = selectedDevices
.map((_, index) => `$${index + 1}`) .map((_, index) => `$${index + 1}`)
.join(","); .join(",");
const subquery = ` const subquery = `
SELECT MAX(time) AS time, serial SELECT g.serial, g.longitude, g.latitude, g.direction, g.speed, r.lastkeepalive
FROM geo g
INNER JOIN (
SELECT serial, MAX(time) AS time
FROM geo FROM geo
WHERE serial IN ( WHERE serial IN (
SELECT serial SELECT serial
@ -172,24 +175,34 @@ app.post("/devices-geo", async (req, res) => {
WHERE id IN (${placeholders}) WHERE id IN (${placeholders})
) )
GROUP BY serial GROUP BY serial
`; ) s ON g.serial = s.serial AND g.time = s.time
const query = ` INNER JOIN registrars r ON g.serial = r.serial
SELECT g.serial, g.longitude, g.latitude, g.direction, g.speed `;
FROM geo g
INNER JOIN (${subquery}) s pool.query(subquery, selectedDevices, (err, result) => {
ON g.serial = s.serial AND g.time = s.time if (err) {
`; console.error("Ошибка выполнения запроса:", err);
res.status(500).json({ error: "Ошибка сервера" });
return;
}
const minuteInMillis = 60000;
// Process the result to include lastkeepalive information
const devicesData = result.rows.map((row) => ({
serial: row.serial,
longitude: row.longitude,
latitude: row.latitude,
direction: row.direction,
speed: row.speed,
status: Date.now() - Date.parse(row.lastkeepalive) <= minuteInMillis,
}));
pool.query(query, selectedDevices, (err, result) => {
if (err) {
console.error("Ошибка выполнения запроса:", err);
res.status(500).json({ error: "Ошибка сервера" });
return;
}
// console.log(result.rows); // console.log(result.rows);
const devicesData = result.rows;
res.json({ devicesData }); res.json({ devicesData });
}); });
}); });

12
static/templates/live.html
View File

@ -517,7 +517,7 @@ const selectedDevices = Array.from(checkboxes)
.then(data => { .then(data => {
console.log(data.devicesData); console.log(data.devicesData);
data.devicesData.forEach(device => { data.devicesData.forEach(device => {
const { serial, longitude, latitude, direction, speed } = device; const { serial, status, longitude, latitude, direction, speed } = device;
var newDirection = direction + 90 var newDirection = direction + 90
console.log(newDirection); console.log(newDirection);
@ -525,10 +525,10 @@ const selectedDevices = Array.from(checkboxes)
const el = document.createElement('div'); const el = document.createElement('div');
el.className = 'marker'; el.className = 'marker';
// el.style.transform = `rotate(${direction / 100}deg)`; // 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="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"/> <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) const marker = new mapboxgl.Marker(el)
@ -551,7 +551,7 @@ function updateMapMarkers(devicesData) {
// Создание новых маркеров на карте на основе полученных данных // Создание новых маркеров на карте на основе полученных данных
devicesData.forEach(device => { devicesData.forEach(device => {
const { serial, longitude, latitude, direction, speed } = device; const { serial, status, longitude, latitude, direction, speed } = device;
var newDirection = direction + 90 var newDirection = direction + 90
console.log(newDirection); console.log(newDirection);
@ -559,10 +559,10 @@ function updateMapMarkers(devicesData) {
const el = document.createElement('div'); const el = document.createElement('div');
el.className = 'marker'; el.className = 'marker';
// el.style.transform = `rotate(${direction}deg)`; // 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="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"/> <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) const marker = new mapboxgl.Marker(el)