fix: resolve EM overview marker and segment overlaps
This commit is contained in:
@@ -62,7 +62,7 @@ main > section[hidden] { display: none !important; }
|
||||
.marker-vehicle .vehicle-outline { fill: rgba(32, 37, 43, .16); stroke: #20252b; stroke-width: 1.5; }
|
||||
.marker-vehicle .vehicle-heading { stroke: #20252b; stroke-width: 1.5; stroke-linecap: round; vector-effect: non-scaling-stroke; }
|
||||
.marker-smooth-start { fill: #2f8f56; stroke: #ffffff; stroke-width: 1.5; }
|
||||
.marker-plan-start { fill: #ffffff; stroke: #2f8f56; stroke-width: 2; }
|
||||
.marker-plan-start { fill: none; stroke: #2f8f56; stroke-width: 2; }
|
||||
.marker-gear-switch { fill: #d87918; stroke: #ffffff; stroke-width: 1.5; }
|
||||
.marker-final-goal { fill: #1769aa; stroke: #ffffff; stroke-width: 1.5; }
|
||||
.world-legend { position: absolute; top: 14px; right: 14px; z-index: 3; display: grid; gap: 6px; min-width: 154px; max-width: min(260px, calc(100% - 28px)); padding: 10px 12px; border: 1px solid rgba(112, 123, 133, .38); border-radius: 6px; background: rgba(255, 255, 255, .88); box-shadow: 0 2px 10px rgba(32, 37, 43, .08); color: #36404a; font-size: 12px; pointer-events: none; backdrop-filter: blur(2px); }
|
||||
|
||||
@@ -146,7 +146,6 @@
|
||||
if (!worldLegend) return;
|
||||
worldLegend.replaceChildren();
|
||||
const staticLines = safeArray(snapshot.staticPolylines);
|
||||
const directionSegments = safeArray(snapshot.directionSegments);
|
||||
const dynamicLines = safeArray(frame.dynamicPolylines);
|
||||
const markers = safeArray(snapshot.staticMarkers).concat(safeArray(frame.dynamicMarkers));
|
||||
const entries = [];
|
||||
@@ -163,20 +162,25 @@
|
||||
const current = dynamicLines.find(line => lineKind(line) !== "active-segment" && lineKind(line) !== "previous" && line.lineStyle !== 1);
|
||||
if (coarse) add("coarse", coarse.legendChinese || "粗路径", "legend-line legend-coarse");
|
||||
if (smooth) add("smooth", smooth.legendChinese || "完整 Local G2 路径", "legend-line legend-smooth");
|
||||
if (active || directionSegments.length)
|
||||
add("segment", active && active.legendChinese || "当前方向段", "legend-line legend-segment");
|
||||
if (active)
|
||||
add("segment", active.legendChinese || "当前方向段", "legend-line legend-segment");
|
||||
if (previous) add("previous", previous.legendChinese || "上一条 EM 轨迹", "legend-line legend-previous");
|
||||
if (current) add("current", current.legendChinese || "当前 EM 轨迹", "legend-line legend-current");
|
||||
if (markers.some(marker => lineKind(marker) === "smooth-start"))
|
||||
add("smooth-start", "平滑路径起点", "legend-marker legend-smooth-start");
|
||||
if (markers.some(marker => lineKind(marker) === "plan-start"))
|
||||
add("plan-start", "EM 规划起点", "legend-marker legend-plan-start");
|
||||
if (markers.some(marker => lineKind(marker) === "vehicle"))
|
||||
add("vehicle", "当前车辆", "legend-marker legend-vehicle");
|
||||
if (markers.some(marker => lineKind(marker) === "gear-switch" || lineKind(marker) === "gear-switch-end"))
|
||||
add("gear", "换向点 / s_end", "legend-marker legend-gear");
|
||||
if (markers.some(marker => lineKind(marker) === "final-goal"))
|
||||
add("goal", "平滑路径终点", "legend-marker legend-goal");
|
||||
const smoothStartMarker = markers.find(marker => lineKind(marker) === "smooth-start");
|
||||
const planStartMarker = markers.find(marker => lineKind(marker) === "plan-start");
|
||||
const vehicleMarker = markers.find(marker => lineKind(marker) === "vehicle");
|
||||
const gearMarker = markers.find(marker => lineKind(marker) === "gear-switch" || lineKind(marker) === "gear-switch-end");
|
||||
const goalMarker = markers.find(marker => lineKind(marker) === "final-goal");
|
||||
if (smoothStartMarker)
|
||||
add("smooth-start", smoothStartMarker.labelChinese || "平滑路径起点", "legend-marker legend-smooth-start");
|
||||
if (planStartMarker)
|
||||
add("plan-start", planStartMarker.labelChinese || "EM 规划起点", "legend-marker legend-plan-start");
|
||||
if (vehicleMarker)
|
||||
add("vehicle", vehicleMarker.labelChinese || "当前车辆", "legend-marker legend-vehicle");
|
||||
if (gearMarker)
|
||||
add("gear", gearMarker.labelChinese || "换向点 / s_end", "legend-marker legend-gear");
|
||||
if (goalMarker)
|
||||
add("goal", goalMarker.labelChinese || "平滑路径终点", "legend-marker legend-goal");
|
||||
entries.forEach(entry => {
|
||||
const item = element("div", "world-legend-item");
|
||||
item.append(element("span", "world-legend-swatch " + entry.swatchClass),
|
||||
@@ -201,15 +205,17 @@
|
||||
if (path) overlay.append(svg("path", { d: path, class: "world-line " + css }));
|
||||
};
|
||||
const staticLines = safeArray(snapshot.staticPolylines);
|
||||
const dynamicLines = safeArray(frame.dynamicPolylines);
|
||||
const hasDynamicActiveSegment = dynamicLines.some(line => lineKind(line) === "active-segment");
|
||||
staticLines.filter(line => lineKind(line) === "global" || lineKind(line) === "coarse")
|
||||
.forEach(line => addLine(line, "world-coarse"));
|
||||
staticLines.filter(line => lineKind(line).includes("local-g2") || lineKind(line).includes("g2"))
|
||||
.forEach(line => addLine(line, "world-local-g2"));
|
||||
staticLines.filter(line => lineKind(line) !== "global" && lineKind(line) !== "coarse" && !lineKind(line).includes("local-g2") && !lineKind(line).includes("g2"))
|
||||
.forEach(line => addLine(line, "world-static"));
|
||||
safeArray(snapshot.directionSegments).forEach(segment => addLine(segment,
|
||||
segment.segmentIndex === frame.activeSegmentIndex ? "world-segment-active" : "world-direction-inactive"));
|
||||
const dynamicLines = safeArray(frame.dynamicPolylines);
|
||||
safeArray(snapshot.directionSegments)
|
||||
.filter(segment => !hasDynamicActiveSegment || segment.segmentIndex !== frame.activeSegmentIndex)
|
||||
.forEach(segment => addLine(segment, "world-direction-inactive"));
|
||||
dynamicLines.filter(line => lineKind(line) === "active-segment")
|
||||
.forEach(line => addLine(line, "world-segment-active"));
|
||||
dynamicLines.filter(line => lineKind(line) === "previous" || line.lineStyle === 1)
|
||||
|
||||
Reference in New Issue
Block a user