ARTICLE DETAIL

资讯详情

深耕编程入门与网站建设的一线实战洞察。

Pascal Editor吸附系统解析:网格吸附、墙体吸附等4种Snap策略

Pascal Editor吸附系统解析:网格吸附、墙体吸附等4种Snap策略 Pascal Editor吸附系统解析网格吸附、墙体吸附等4种Snap策略【免费下载链接】editorOpen-source 3D architectural editor with a local CLI, MCP tools, and practical workflows for humans and AI agents.项目地址: https://gitcode.com/GitHub_Trending/editor93/editorPascal Editor 是一款开源 3D 建筑编辑器其**吸附系统Snap**是新手最容易忽略、却最影响出图精度的核心能力。本文将拆解它背后的 4 种吸附策略网格吸附、角度吸附、墙体磁吸吸附和对齐线吸附并说明它们如何按操作场景自动切换帮你快速画出一丝不苟的建筑平面。一、什么是吸附为什么它重要在 3D 建筑场景中徒手摆放家具、拉墙往往差之毫厘、谬以千里。Pascal Editor 的吸附系统会在你拖动或绘制时自动把光标贴到最合适的位置上并提供视觉反馈吸附信标、对齐辅助线。整个吸附计算被刻意设计成纯数学函数——不依赖 React、不接触场景树因此可以被单元测试完整覆盖。核心实现分布在两个包里通用吸附数学packages/core/src/services/snap.ts吸附模式调度packages/editor/src/lib/snapping-mode.ts二、4 种 Snap 策略逐个拆解1. 网格吸附Grid Snap把点吸到格子交点上这是最基础的策略任何坐标都量化为网格步长的整数倍保证墙体、地面、家具位置落在看得见的格子上。默认网格步长为0.25 米通用工具或0.5 米墙体工具定义见 snap.ts#L15-L19核心函数snapScalar只有一行逻辑四舍五入到最近的步长倍数见 snap.ts#L24-L27一个巧妙设计步长设为0就代表关闭网格所有消费方都会自动跳过无需额外开关逻辑适用场景画墙、放楼板、贴地砖——任何需要整齐的操作。2. 角度吸附Angle Snap15° 步进锁定方向画斜墙时最怕角度飘。角度吸附会把光标方向锁定到15° 的整数倍π/12也就是常见的 15°/30°/45°/60° 等建筑常用角。snapPointToAngle先把角度吸附再保留原始距离见 snap.ts#L96-L112snapPointAlongAngleRay角度锁定后沿射线把距离也按网格量化端点稳稳落在格点上还有一个角度白名单函数snapAngleToList可以吸附到任意自定义角度集合默认容差 5°适用场景画斜墙、定栏杆方向、布置斜向天窗——需要方向感的操作。3. 墙体吸附Wall Magnetic Snap把端点吸到墙上这是 Pascal Editor 的招牌能力——画第二面墙时光标会磁吸到已有墙上自动闭合房间、自动接墙脚。几何逻辑全部在 wall-snap-geometry.ts 中按优先级从高到低依次尝试 4 类目标优先级吸附目标捕获半径说明①端点endpoint0.7 m最强意图闭合多边形、接墙角②中点midpoint0.5 m精确挂到墙的正中间③交点intersection0.5 m两条墙的理论交叉处④墙体wall body0.35 m吸附到墙身任意位置半径常量定义见 wall-snap-geometry.ts#L36-L54。特别值得学习的细节特殊点吸附从原始光标而非网格预吸附后的点出发避免中间一次网格量化把光标推离墙角导致漏吸曲线墙会被离散采样后参与候选。命中后还会返回targetWallIds来源墙 ID供后续拆分墙体传递构造参数等下游逻辑使用。4. 对齐线吸附Alignment LinesFigma 式辅助线拖动家具时你会看到红/绿色的辅助线——这就是对齐吸附。它借鉴了 Figma 的行为核心解析器在 packages/core/src/services/alignment.ts锚点体系每个对象贡献 9 个标准锚点4 角 4 边中点 中心见bboxAnchors函数alignment.ts#L268-L288每轴最多 1 条线X 轴和 Z 轴各自取最近匹配最多画 2 条辅助线视觉信号干净不杂乱墙面对齐墙体锚点会额外偏移半个墙厚让家具能贴到墙的面而非中心线见 alignment-anchors.ts#L202-L231楼层过滤只会与当前楼层的对象对齐避免和楼下同一位置的墙隔空对齐三、4 种策略如何协同按场景自动切换Pascal Editor 的吸附不是全局开关而是每个操作场景有自己的模式集。用户可以用快捷键在模式间循环切换场景可选模式默认模式设计理由画墙 / 拖墙端点网格 / 线条 / 角度 / 关网格方向重要 → 需要角度锁定摆放 / 移动家具线条 / 网格 / 关线条自由移动只在对齐线处咬住画楼板 / 整墙平移网格 / 线条 / 关网格无方向可言 → 不给角度锁定模式到开关的映射是互斥的——每种模式只启用一种吸附HUD 显示什么就只发生什么见 snapping-mode.ts#L34-L45 和场景配置 snapping-mode.ts#L81-L91。还有一个兜底机制即使选了网格或角度模式端点在 5 cm 范围内依然会轻吸到已有墙上WALL_CONNECT_SNAP_RADIUS 0.05保证房间总能闭合——精细控制与连接可靠性兼得。四、想深入源码从这里看起模块路径看点网格/角度吸附数学snap.ts纯函数、稳定契约吸附模式调度snapping-mode.ts场景化默认值设计墙体磁吸几何wall-snap-geometry.ts优先级与半径设计画墙吸附入口wall-drafting.ts网格/角度/磁吸的装配顺序对齐线解析alignment.tsFigma 式双轴匹配移动约束轴锁网格movement.ts#L51-L68节点级移动约束全局吸附状态use-editor.tsx#L1607-L1627模式→开关的最终裁决五、小结新手如何用好吸附画墙→ 留在默认网格模式需要斜墙时切到角度模式️摆家具→ 用默认线条模式让对齐辅助线帮你贴墙、贴边收尾检查→ 切到网格模式快速量化修正微小偏移Pascal Editor 用 4 种各司其职的 Snap 策略 场景化的默认值把像素级精确变成了无意识获得。理解这套机制后无论是手动操作还是通过本地 CLI、MCP 工具让 AI Agent 参与建模你产出的图纸都会天然整洁。【免费下载链接】editorOpen-source 3D architectural editor with a local CLI, MCP tools, and practical workflows for humans and AI agents.项目地址: https://gitcode.com/GitHub_Trending/editor93/editor创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
返回列表