auto-sync: 2026-05-04 00:30:01
This commit is contained in:
38
tasks/enduro-trails/prototype/static/app.js
vendored
38
tasks/enduro-trails/prototype/static/app.js
vendored
@@ -442,36 +442,50 @@ function updateRulerLine() {
|
||||
function addRulerPoint(lngLat, isLast) {
|
||||
const map = window._map;
|
||||
const pt = [lngLat.lng, lngLat.lat];
|
||||
const idx = rulerPoints.length;
|
||||
rulerPoints.push(pt);
|
||||
|
||||
// Считаем расстояние от предыдущей точки
|
||||
let segDist = 0;
|
||||
if (rulerPoints.length > 1) {
|
||||
segDist = haversineKm(rulerPoints[rulerPoints.length - 2], pt);
|
||||
const segDist = haversineKm(rulerPoints[rulerPoints.length - 2], pt);
|
||||
rulerTotal += segDist;
|
||||
}
|
||||
|
||||
// Маркер с подписью
|
||||
const el = document.createElement('div');
|
||||
el.style.cssText = 'background:#0088ff;border:2px solid #fff;border-radius:50%;width:10px;height:10px;box-shadow:0 0 4px rgba(0,0,0,0.3)';
|
||||
|
||||
// Подпись с накопленным расстоянием
|
||||
const label = rulerPoints.length === 1 ? '0' :
|
||||
const label = rulerPoints.length === 1 ? '0 м' :
|
||||
rulerTotal >= 1 ? rulerTotal.toFixed(1) + ' км' : Math.round(rulerTotal * 1000) + ' м';
|
||||
|
||||
const popup = new maplibregl.Popup({ offset: 12, closeButton: false, closeOnClick: false })
|
||||
.setHTML(`<span style="font-size:12px;font-weight:600;color:#0088ff">${label}</span>`);
|
||||
// Кастомный маркер с подписью и крестиком
|
||||
const el = document.createElement('div');
|
||||
el.style.cssText = 'position:relative;display:flex;flex-direction:column;align-items:center;cursor:default';
|
||||
el.innerHTML = `
|
||||
<div style="display:flex;align-items:center;gap:3px;background:rgba(0,0,0,0.7);color:#fff;font-size:11px;font-weight:600;padding:2px 5px;border-radius:3px;margin-bottom:3px;white-space:nowrap">
|
||||
<span class="ruler-label">${label}</span>
|
||||
<span style="cursor:pointer;opacity:0.7;font-size:10px;line-height:1" onclick="removeRulerPoint(${idx})" title="Удалить точку">✕</span>
|
||||
</div>
|
||||
<div style="background:#0088ff;border:2px solid #fff;border-radius:50%;width:10px;height:10px;box-shadow:0 0 4px rgba(0,0,0,0.3);flex-shrink:0"></div>
|
||||
`;
|
||||
|
||||
const marker = new maplibregl.Marker({ element: el })
|
||||
const marker = new maplibregl.Marker({ element: el, anchor: 'bottom' })
|
||||
.setLngLat([lngLat.lng, lngLat.lat])
|
||||
.setPopup(popup)
|
||||
.addTo(map);
|
||||
marker.togglePopup();
|
||||
rulerMarkers.push(marker);
|
||||
|
||||
updateRulerLine();
|
||||
}
|
||||
|
||||
function removeRulerPoint(idx) {
|
||||
if (idx < 0 || idx >= rulerPoints.length) return;
|
||||
rulerPoints.splice(idx, 1);
|
||||
rulerMarkers.forEach(m => m.remove());
|
||||
rulerMarkers = [];
|
||||
rulerTotal = 0;
|
||||
// Пересоздаём все маркеры
|
||||
const pts = [...rulerPoints];
|
||||
rulerPoints = [];
|
||||
pts.forEach(pt => addRulerPoint({ lng: pt[0], lat: pt[1] }));
|
||||
}
|
||||
|
||||
function initRulerClicks(map) {
|
||||
map.on('click', (e) => {
|
||||
if (!rulerMode) return;
|
||||
|
||||
Reference in New Issue
Block a user