Complete XYZAC LinuxCNC WASM parity and smooth 3D preview
This commit is contained in:
264
doc-g/generate.html
Normal file
264
doc-g/generate.html
Normal file
@@ -0,0 +1,264 @@
|
||||
<!doctype html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>GMOCCAPY 仿真使用说明</title>
|
||||
<style>
|
||||
:root {
|
||||
--ink: #1e293b;
|
||||
--muted: #64748b;
|
||||
--line: #dbe3ec;
|
||||
--paper: #ffffff;
|
||||
--wash: #f4f7fb;
|
||||
--blue: #155e9a;
|
||||
--blue-soft: #e8f2fb;
|
||||
--red: #d62828;
|
||||
--green: #18864b;
|
||||
--shadow: 0 12px 28px rgba(15, 23, 42, .08);
|
||||
}
|
||||
* { box-sizing: border-box; }
|
||||
html { scroll-behavior: smooth; }
|
||||
body {
|
||||
margin: 0;
|
||||
color: var(--ink);
|
||||
background: var(--wash);
|
||||
font: 16px/1.65 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
|
||||
}
|
||||
a { color: var(--blue); }
|
||||
.hero {
|
||||
padding: 52px max(24px, calc((100vw - 1180px) / 2));
|
||||
color: #fff;
|
||||
background: #102a43;
|
||||
border-bottom: 5px solid #d62828;
|
||||
}
|
||||
.hero h1 { max-width: 760px; margin: 0; font-size: clamp(2rem, 4vw, 3.5rem); line-height: 1.12; }
|
||||
.hero p { max-width: 720px; margin: 18px 0 0; color: #d8e6f2; font-size: 1.08rem; }
|
||||
.layout { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 28px; max-width: 1180px; margin: 30px auto; padding: 0 24px 60px; }
|
||||
.toc { position: sticky; top: 20px; align-self: start; padding: 18px; background: var(--paper); border: 1px solid var(--line); border-radius: 8px; box-shadow: var(--shadow); }
|
||||
.toc strong { display: block; margin-bottom: 10px; }
|
||||
.toc a { display: block; padding: 5px 0; text-decoration: none; font-size: .94rem; }
|
||||
main { min-width: 0; }
|
||||
section { margin-bottom: 32px; padding: 28px; background: var(--paper); border: 1px solid var(--line); border-radius: 8px; box-shadow: var(--shadow); }
|
||||
h2 { margin: 0 0 14px; color: #123b5d; font-size: 1.7rem; line-height: 1.2; }
|
||||
h3 { margin: 24px 0 8px; color: #234e70; font-size: 1.16rem; }
|
||||
p { margin: 10px 0; }
|
||||
.notice { padding: 16px 18px; border-left: 5px solid var(--red); background: #fff5f5; }
|
||||
.success { padding: 16px 18px; border-left: 5px solid var(--green); background: #effaf3; }
|
||||
.steps { display: grid; gap: 12px; margin: 18px 0 0; padding: 0; list-style: none; counter-reset: step; }
|
||||
.steps li { position: relative; padding: 14px 18px 14px 58px; border: 1px solid var(--line); border-radius: 6px; background: #fbfdff; counter-increment: step; }
|
||||
.steps li::before { content: counter(step); position: absolute; left: 17px; top: 13px; display: grid; place-items: center; width: 28px; height: 28px; color: #fff; background: var(--blue); border-radius: 50%; font-weight: 700; }
|
||||
code { padding: 2px 5px; background: #eef2f7; border-radius: 4px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .92em; }
|
||||
pre { overflow: auto; padding: 14px 16px; color: #e5edf5; background: #172b3d; border-radius: 6px; }
|
||||
.figure { margin: 22px 0 4px; }
|
||||
.annotated { position: relative; overflow: hidden; border: 1px solid #bbc8d5; background: #111; border-radius: 6px; }
|
||||
.annotated img { display: block; width: 100%; height: auto; }
|
||||
.annotated svg { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
|
||||
.annotated .arrow { stroke: var(--red); stroke-width: 8; fill: none; stroke-linecap: round; stroke-linejoin: round; }
|
||||
.annotated .arrow-thin { stroke-width: 5; }
|
||||
.annotated .label { fill: #fff; stroke: var(--red); stroke-width: 5; paint-order: stroke; font: 700 30px system-ui, sans-serif; }
|
||||
figcaption { margin-top: 8px; color: var(--muted); font-size: .92rem; }
|
||||
.two-col { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
|
||||
.fact { padding: 16px; border: 1px solid var(--line); border-radius: 6px; background: #fbfdff; }
|
||||
.fact strong { display: block; margin-bottom: 5px; color: #123b5d; }
|
||||
.button-chain { display: grid; gap: 8px; max-width: 760px; margin: 20px 0; }
|
||||
.chain-item { display: grid; grid-template-columns: 34px 1fr; gap: 12px; align-items: center; padding: 12px 14px; border: 2px solid #c8d8e8; border-radius: 6px; background: #f8fbfe; }
|
||||
.chain-item .badge { display: grid; place-items: center; width: 30px; height: 30px; color: #fff; background: var(--red); border-radius: 50%; font-weight: 800; }
|
||||
.chain-item small { display: block; color: var(--muted); }
|
||||
.chain-arrow { color: var(--red); font-size: 1.8rem; font-weight: 800; line-height: .8; text-align: center; }
|
||||
.auto-panel { position: relative; max-width: 760px; margin: 20px 0; padding: 18px; overflow: hidden; border: 2px solid #9fb4c8; border-radius: 6px; background: #e9eef3; }
|
||||
.auto-panel-title { margin-bottom: 12px; color: #123b5d; font-weight: 800; }
|
||||
.auto-buttons { display: grid; grid-template-columns: repeat(6, minmax(82px, 1fr)); gap: 9px; align-items: stretch; }
|
||||
.auto-btn { min-height: 104px; display: grid; place-items: center; align-content: center; gap: 5px; padding: 9px 5px; border: 1px solid #b7c4cf; border-radius: 6px; background: #fff; text-align: center; }
|
||||
.auto-btn img { width: 38px; height: 38px; object-fit: contain; }
|
||||
.auto-btn.target { border: 4px solid var(--red); background: #fff1f1; }
|
||||
.auto-btn code { padding: 1px 3px; font-size: .72rem; }
|
||||
.auto-panel svg { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
|
||||
.auto-panel .arrow { stroke: var(--red); stroke-width: 6; fill: none; stroke-linecap: round; stroke-linejoin: round; }
|
||||
.auto-panel .label { fill: #fff; stroke: var(--red); stroke-width: 4; paint-order: stroke; font: 800 22px system-ui, sans-serif; }
|
||||
@media (max-width: 650px) { .auto-buttons { grid-template-columns: repeat(3, minmax(82px, 1fr)); } }
|
||||
table { width: 100%; border-collapse: collapse; font-size: .94rem; }
|
||||
th, td { padding: 9px 10px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
|
||||
th { color: #123b5d; background: #f0f5fa; }
|
||||
.footer { max-width: 1180px; margin: 0 auto; padding: 0 24px 44px; color: var(--muted); font-size: .9rem; }
|
||||
@media (max-width: 820px) {
|
||||
.layout { display: block; margin-top: 18px; }
|
||||
.toc { position: static; margin-bottom: 18px; }
|
||||
section { padding: 20px; }
|
||||
.two-col { grid-template-columns: 1fr; }
|
||||
.hero { padding: 38px 24px; }
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<header class="hero">
|
||||
<h1>GMOCCAPY 仿真使用说明</h1>
|
||||
<p>从首次启动提示、进入 AUTO、选择 G-code,到确认程序已加载。红色箭头表示需要点击的位置;本手册基于当前工作区的实际 GMOCCAPY 截图和源码分析。</p>
|
||||
</header>
|
||||
|
||||
<div class="layout">
|
||||
<nav class="toc" aria-label="目录">
|
||||
<strong>本页导航</strong>
|
||||
<a href="#quick">快速流程</a>
|
||||
<a href="#popup">关闭首次提示</a>
|
||||
<a href="#auto">进入 AUTO</a>
|
||||
<a href="#select">选择程序</a>
|
||||
<a href="#verify">确认加载</a>
|
||||
<a href="#trouble">常见问题</a>
|
||||
<a href="#evidence">文件与证据</a>
|
||||
</nav>
|
||||
|
||||
<main>
|
||||
<section id="quick">
|
||||
<h2>快速流程</h2>
|
||||
<ol class="steps">
|
||||
<li>启动项目快捷方式:<code>./run-gmoccapy.sh</code>。</li>
|
||||
<li>首次弹窗出现时,点击右侧 <strong>X</strong>;可选中“Don't show this again”。</li>
|
||||
<li>确认机器上电并完成 homing,然后点击右侧第三个模式按钮进入 AUTO。</li>
|
||||
<li>进入 AUTO 后,在 AUTO 按钮组中点击“打开文件”图标,选择 <code>.ngc</code> 文件。</li>
|
||||
<li>点击文件选择页底部的绿色对勾确认,检查顶部文件路径和刀具轨迹。</li>
|
||||
<li>加载不会自动运行;确认安全后再点击 Run,或使用 <code>R</code> 快捷键。</li>
|
||||
</ol>
|
||||
</section>
|
||||
|
||||
<section id="popup">
|
||||
<h2>1. 关闭首次启动提示</h2>
|
||||
<div class="notice"><strong>先处理这个窗口。</strong> 用户提供的“Important change(s)”是模态提示,会挡住 GMOCCAPY 主界面;在它关闭前,底层 AUTO 和加载按钮都无法正常点击。</div>
|
||||
<figure class="figure">
|
||||
<div class="annotated">
|
||||
<img src="gmoccapy-important-changes.png" alt="GMOCCAPY Important changes 首次启动提示">
|
||||
<svg viewBox="0 0 697 837" aria-hidden="true">
|
||||
<defs><marker id="arrow-popup" markerWidth="12" markerHeight="12" refX="10" refY="6" orient="auto"><path d="M0,0 L12,6 L0,12 z" fill="#d62828"/></marker></defs>
|
||||
<path class="arrow" marker-end="url(#arrow-popup)" d="M420 260 C505 285 574 340 637 399"/>
|
||||
<text class="label" x="385" y="240">1 关闭提示</text>
|
||||
</svg>
|
||||
</div>
|
||||
<figcaption>箭头指向右侧 X。也可以勾选底部“Don't show this again”,避免每次启动重复出现。</figcaption>
|
||||
</figure>
|
||||
</section>
|
||||
|
||||
<section id="auto">
|
||||
<h2>2. 进入 AUTO 模式</h2>
|
||||
<p><strong>关键点:</strong>你要找的“加载程序”按钮不在当前 MANUAL/JOG 页面。它只有在切换到 AUTO 后,才会被放入 AUTO 专用按钮组。</p>
|
||||
<figure class="figure">
|
||||
<div class="annotated">
|
||||
<img src="gmoccapy-after-popup-close.png" alt="关闭提示后的 GMOCCAPY 主界面">
|
||||
<svg viewBox="0 0 1960 1500" aria-hidden="true">
|
||||
<defs><marker id="arrow-auto" markerWidth="18" markerHeight="18" refX="15" refY="9" orient="auto"><path d="M0,0 L18,9 L0,18 z" fill="#d62828"/></marker></defs>
|
||||
<path class="arrow" marker-end="url(#arrow-auto)" d="M1415 235 C1530 270 1640 330 1710 390"/>
|
||||
<text class="label" x="1210" y="220">2 点击 AUTO</text>
|
||||
</svg>
|
||||
</div>
|
||||
<figcaption>箭头指向右侧竖向模式按钮中的 AUTO 图标。若该按钮灰色,先处理“急停、上电、homing”状态。</figcaption>
|
||||
</figure>
|
||||
<h3>具体点击顺序</h3>
|
||||
<ol class="steps">
|
||||
<li><strong>先看右侧竖条。</strong>从上到下通常是急停、上电、AUTO、MDI 等图标。点击第三个“彩色小方块/机床箭头”图标,不要点击 MDI 计算器图标。</li>
|
||||
<li><strong>等待页面切换。</strong>右侧或底部按钮区域会从手动点动按钮切换为 AUTO 按钮组。窗口大小、主题和侧面板会改变图标的排列,但按钮的 tooltip 仍是 <code>Load a new program</code>。</li>
|
||||
<li><strong>再点打开文件按钮。</strong>在 AUTO 按钮组中寻找文件夹/打开文件图标。它的源码 ID 是 <code>btn_load</code>,不是文件选择页里的绿色对勾。</li>
|
||||
<li><strong>看到文件网格才算进入选择界面。</strong>点击 <code>btn_load</code> 后,GMOCCAPY 才会打开“选择 G-code 程序”界面;源码函数是 <code>on_btn_load_clicked()</code>,它把按钮页切换到文件选择页。</li>
|
||||
</ol>
|
||||
<div class="button-chain" aria-label="打开 G-code 文件界面的按钮链">
|
||||
<div class="chain-item"><span class="badge">A</span><div><strong>右侧第三个 AUTO 图标</strong><small><code>rbt_auto</code>:先切换按钮组。</small></div></div>
|
||||
<div class="chain-arrow" aria-hidden="true">↓</div>
|
||||
<div class="chain-item"><span class="badge">B</span><div><strong>AUTO 页面中的打开文件图标</strong><small><code>btn_load</code>,tooltip 为 <code>Load a new program</code>;点击它才打开文件选择界面。</small></div></div>
|
||||
<div class="chain-arrow" aria-hidden="true">↓</div>
|
||||
<div class="chain-item"><span class="badge">C</span><div><strong>文件网格和底部绿色对勾</strong><small><code>btn_select</code>:选择文件后确认返回路径。</small></div></div>
|
||||
</div>
|
||||
<h3>在 AUTO 页面里,具体就是这个打开文件图标</h3>
|
||||
<p>下图不是另一个入口,而是从 GMOCCAPY Glade 的 <code>hbtb_auto</code> 按钮组和当前 icon theme 放大的控件图。红框和箭头明确标出 <code>btn_load</code>;鼠标悬停时 tooltip 是 <code>Load a new program</code>。</p>
|
||||
<div class="auto-panel" role="img" aria-label="AUTO 页面按钮组中 btn_load 打开文件图标的源码对应图">
|
||||
<div class="auto-panel-title">AUTO 页面按钮组:hbtb_auto</div>
|
||||
<div class="auto-buttons">
|
||||
<div class="auto-btn target"><img src="gmoccapy-open-file-icon.png" alt="打开文件图标"><strong>打开文件</strong><code>btn_load</code></div>
|
||||
<div class="auto-btn"><span style="font-size: 2rem">↻</span><strong>重载</strong><code>btn_reload</code></div>
|
||||
<div class="auto-btn"><span style="font-size: 2rem">▶</span><strong>运行</strong><code>btn_run</code></div>
|
||||
<div class="auto-btn"><span style="font-size: 2rem">■</span><strong>停止</strong><code>btn_stop</code></div>
|
||||
<div class="auto-btn"><span style="font-size: 2rem">Ⅱ</span><strong>暂停</strong><code>tbtn_pause</code></div>
|
||||
<div class="auto-btn"><span style="font-size: 2rem">→</span><strong>单步</strong><code>btn_step</code></div>
|
||||
</div>
|
||||
<svg viewBox="0 0 760 178" aria-hidden="true">
|
||||
<defs><marker id="arrow-btn-load" markerWidth="16" markerHeight="16" refX="13" refY="8" orient="auto"><path d="M0,0 L16,8 L0,16 z" fill="#d62828"/></marker></defs>
|
||||
<path class="arrow" marker-end="url(#arrow-btn-load)" d="M305 28 C245 38 156 50 67 91"/>
|
||||
<text class="label" x="320" y="30">点击这里:btn_load</text>
|
||||
</svg>
|
||||
</div>
|
||||
<div class="notice"><strong>如果你只看到右侧 AUTO 图标而没有这排按钮:</strong>你还没有完成 AUTO 页面切换,或者 AUTO 被急停/未上电/未 homing 状态门控。先点击上面的 AUTO 入口,等按钮组切换完成,再寻找红框位置。</div>
|
||||
<div class="notice"><strong>不要把两个按钮混淆:</strong><code>btn_load</code> 负责“打开文件选择界面”;文件界面底部的绿色对勾 <code>btn_select</code> 负责“确认当前选中的文件”。</div>
|
||||
<div class="success">当前仿真配置的共享 home switch 曾报告 <code>Cannot home while shared home switch is closed j=2</code>。这会让 AUTO 保持门控;它是仿真 HAL 状态问题,不是加载按钮消失。</div>
|
||||
</section>
|
||||
|
||||
<section id="select">
|
||||
<h2>3. 选择 G-code 程序</h2>
|
||||
<p>只有完成上一节的 <strong>AUTO → 打开文件图标</strong> 两次点击后,才会出现下面这个文件界面。进入文件页后,GMOCCAPY 会按配置中的 <code>PROGRAM_PREFIX = ../../nc_files/</code> 显示程序。当前配置解析到:</p>
|
||||
<pre>/home/mes006/linuxcncWebWASM/linuxcnc/nc_files/</pre>
|
||||
<figure class="figure">
|
||||
<div class="annotated">
|
||||
<img src="gmoccapy-load-file-page.png" alt="GMOCCAPY 文件选择页">
|
||||
<svg viewBox="0 0 1960 1500" aria-hidden="true">
|
||||
<defs><marker id="arrow-file" markerWidth="18" markerHeight="18" refX="15" refY="9" orient="auto"><path d="M0,0 L18,9 L0,18 z" fill="#d62828"/></marker></defs>
|
||||
<path class="arrow arrow-thin" marker-end="url(#arrow-file)" d="M1530 570 C1490 520 1440 475 1355 420"/>
|
||||
<text class="label" x="1500" y="640">3 选择 .ngc</text>
|
||||
<path class="arrow arrow-thin" marker-end="url(#arrow-file)" d="M1290 1260 C1390 1280 1480 1320 1530 1370"/>
|
||||
<text class="label" x="1060" y="1240">4 确认选择</text>
|
||||
</svg>
|
||||
</div>
|
||||
<figcaption>示例中可以看到 <code>3dtest.ngc</code>。底部右侧绿色对勾用于返回选中的路径;黄色弯箭头用于返回上一页。文件网格不会在 MANUAL/JOG 页面直接出现。</figcaption>
|
||||
</figure>
|
||||
<h3>界面出现后的点击顺序</h3>
|
||||
<ol class="steps">
|
||||
<li>在文件网格中单击目标文件,例如 <code>3dtest.ngc</code>;选中项会出现高亮。</li>
|
||||
<li>点击底部右侧绿色对勾(<code>btn_select</code>)。它会返回文件路径并关闭文件选择页。</li>
|
||||
<li>回到主界面后,顶部标题应显示完整路径,预览区应显示刀具轨迹。</li>
|
||||
</ol>
|
||||
</section>
|
||||
|
||||
<section id="verify">
|
||||
<h2>4. 确认程序已经加载</h2>
|
||||
<p>加载成功后,顶部标题不再是 <code>No Program loaded</code>,而会显示完整文件路径;左侧预览区会出现刀具轨迹。加载本身不会启动运动。</p>
|
||||
<figure class="figure">
|
||||
<div class="annotated">
|
||||
<img src="gmoccapy-program-loaded.png" alt="3dtest.ngc 已加载并显示刀具轨迹">
|
||||
<svg viewBox="0 0 1960 1500" aria-hidden="true">
|
||||
<defs><marker id="arrow-verify" markerWidth="18" markerHeight="18" refX="15" refY="9" orient="auto"><path d="M0,0 L18,9 L0,18 z" fill="#d62828"/></marker></defs>
|
||||
<path class="arrow arrow-thin" marker-end="url(#arrow-verify)" d="M1310 95 C1120 80 930 55 730 38"/>
|
||||
<text class="label" x="1320" y="140">5 已加载路径</text>
|
||||
<path class="arrow arrow-thin" marker-end="url(#arrow-verify)" d="M665 850 C545 760 420 650 280 560"/>
|
||||
<text class="label" x="680" y="900">6 刀具轨迹预览</text>
|
||||
</svg>
|
||||
</div>
|
||||
<figcaption>本次测试加载的文件是 <code>3dtest.ngc</code>;LinuxCNC 状态接口返回该路径,解释器保持空闲。</figcaption>
|
||||
</figure>
|
||||
</section>
|
||||
|
||||
<section id="trouble">
|
||||
<h2>常见问题</h2>
|
||||
<div class="two-col">
|
||||
<div class="fact"><strong>看不到加载按钮</strong>按“关闭首次提示 → 右侧第三个 AUTO 图标 → AUTO 按钮组中的打开文件图标”顺序操作。文件网格本身不是入口,它是点击 <code>btn_load</code> 之后才出现的。</div>
|
||||
<div class="fact"><strong>AUTO 图标是灰色</strong>检查急停复位、机器上电和 homing。GMOCCAPY 会在状态不满足时禁用模式切换。</div>
|
||||
<div class="fact"><strong>加载后没有运动</strong>这是正常的。加载只生成程序和预览;要执行必须点击 Run 或按 <code>R</code>。</div>
|
||||
<div class="fact"><strong>启动日志提示 POSIX non-realtime</strong>当前环境没有实时内核。可用于仿真界面和加载检查,但不能作为实时硬件性能证明。</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="evidence">
|
||||
<h2>源码、配置与证据</h2>
|
||||
<table>
|
||||
<thead><tr><th>项目</th><th>位置</th><th>用途</th></tr></thead>
|
||||
<tbody>
|
||||
<tr><td>AUTO 入口</td><td><code>rbt_auto</code> / <code>on_rbt_auto_pressed</code></td><td>右侧第三个模式按钮;先进入 AUTO,加载按钮才可见。</td></tr>
|
||||
<tr><td>AUTO 按钮组</td><td><code>hbtb_auto</code></td><td>GMOCCAPY Glade 中承载打开、重载、运行、停止、暂停和单步按钮。</td></tr>
|
||||
<tr><td>加载按钮</td><td><code>gmoccapy.py:5046</code>、<code>btn_load</code></td><td>切换到文件选择页。</td></tr>
|
||||
<tr><td>文件确认</td><td><code>gmoccapy.py:5116</code>、<code>btn_select</code></td><td>将选中的文件交给 <code>hal_action_open.load_file(path)</code>。</td></tr>
|
||||
<tr><td>程序目录</td><td><code>configs/sim/gmoccapy/gmoccapy.ini</code></td><td><code>PROGRAM_PREFIX = ../../nc_files/</code>。</td></tr>
|
||||
<tr><td>逐文件分析</td><td><a href="gmoccapy-file-inventory.md">gmoccapy-file-inventory.md</a></td><td>1,233 个配置、实现、资源、图标、翻译和文档文件的哈希清单。</td></tr>
|
||||
<tr><td>完整分析</td><td><a href="gmoccapy-analysis.md">gmoccapy-analysis.md</a></td><td>本次提示、界面、加载测试和限制的详细记录。</td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<p>本页是静态 HTML,不依赖网络。复制整个 <code>doc-g</code> 目录后,直接用浏览器打开本文件即可。</p>
|
||||
</section>
|
||||
</main>
|
||||
</div>
|
||||
<div class="footer">GMOCCAPY 仿真使用说明 · 证据和后续文档统一保存在 <code>./doc-g</code></div>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user