fix(D03 긋기): 놓인 노드 +/− 색 보이게 — 선보다 굵은 부호 색 점 + 검은 테 · 고른 선은 노랑 강조 위에 점 다시 · 손잡이 = 빈 네모 (PLAN 625-3 · 요구 535-2)
까닭 — 놓인 점 반지름 3 px · 테 없음 = − 하늘(#29e0ff)이 노선 민트 선(#3df5c4)에 묻힘 · 고른 선은 흰 네모 손잡이와 노랑 강조(8 px)가 점을 덮음. - DrawPaint `paintNodes` 떼어 냄(점 5 px · fillCased) · Edit 가 고른 선만 강조 위에 다시 그림(heightAt 인자 덧) - 시험 test_625_draw 놓인 노드 지킴 하나 덧 Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
@@ -36,6 +36,8 @@ import type { DrawPreview } from "./D03_PlanAnalysis_UI_Draw";
|
||||
export const SNAP_PX = 12;
|
||||
/** 선 위 누름으로 볼 반경(px). */
|
||||
export const LINE_HIT_PX = 8;
|
||||
/** 놓인 꺾임점 점 반지름(px) — 선 테(3 + 4 px)보다 굵게 · 고른 선 손잡이는 이 점을 감싸는 빈 네모. */
|
||||
export const NODE_DOT_PX = 5;
|
||||
/** 구간 길이 라벨을 보일 화면 길이(px). */
|
||||
const LABEL_MIN_PX = 70;
|
||||
|
||||
@@ -213,24 +215,33 @@ export function paintNetwork(
|
||||
);
|
||||
if (map.slopes) segmentLabels(context, map, line.vertices, z);
|
||||
});
|
||||
// 꺾임점 = 들어온 구간 기울기 부호 색(625-2 B4) · 기록과 어긋난 노드(옮김) = 경고 고리(599-2)
|
||||
context.strokeStyle = colors.warn;
|
||||
context.lineWidth = 2;
|
||||
for (const line of network.lines)
|
||||
paintNodes(context, map, network.lines, z);
|
||||
drawPieces(context, map, network);
|
||||
extra();
|
||||
}
|
||||
|
||||
/** 꺾임점 = 들어온 구간 기울기 부호 색(625-2 B4) · 선보다 굵은 점 + 검은 테 = 선 색 · 위성 위에서도 가름(625-3) ·
|
||||
* 기록과 어긋난 노드(옮김) = 경고 고리(599-2) · 고른 선은 고름 강조 위에 다시 그림(`D03_PlanAnalysis_UI_Edit`). */
|
||||
export function paintNodes(
|
||||
context: CanvasRenderingContext2D,
|
||||
map: Pick<ScreenMap, "toScreen">,
|
||||
lines: ReadonlyArray<PlanNetwork["lines"][number]>,
|
||||
z: HeightAt,
|
||||
): void {
|
||||
for (const line of lines)
|
||||
line.vertices.forEach((v, i) => {
|
||||
if (!i) return;
|
||||
const [sx, sy] = map.toScreen(v);
|
||||
context.beginPath();
|
||||
context.arc(sx, sy, 3, 0, Math.PI * 2);
|
||||
context.fillStyle = slopeColor(groundSlopePct(line.vertices[i - 1], v, z));
|
||||
context.fill();
|
||||
context.arc(sx, sy, NODE_DOT_PX, 0, Math.PI * 2);
|
||||
fillCased(context, slopeColor(groundSlopePct(line.vertices[i - 1], v, z)));
|
||||
if (!nodeOff(line, i, z)) return;
|
||||
context.beginPath();
|
||||
context.arc(sx, sy, 7, 0, Math.PI * 2);
|
||||
context.arc(sx, sy, NODE_DOT_PX + 4, 0, Math.PI * 2);
|
||||
context.lineWidth = 2;
|
||||
context.strokeStyle = planColors().warn;
|
||||
context.stroke();
|
||||
});
|
||||
drawPieces(context, map, network);
|
||||
extra();
|
||||
}
|
||||
|
||||
/** 지점 핀 겹(585-1) — 꼭지 = 지점 · 둥근 머리 · 「지점 N」 · 화면 px 고정 크기 · 돌린 지도에서도 섬. */
|
||||
|
||||
Reference in New Issue
Block a user