fix(diagrams): expose circuitikz render target

Move diagram pipeline target controls out of Developer mode so Circuit (Circuitikz) and Circuitikz + SVG preview are discoverable in normal settings. Document the current constrained circuitikz export boundary, multi-format SVG/PNG/PDF review flow, and localized MDX publishing policy across the docs site.
This commit is contained in:
aliyun1121003339 2026-07-10 15:55:59 +08:00
parent 434d4e00db
commit 3c88c05b1e
45 changed files with 2295 additions and 671 deletions

View file

@ -20,6 +20,7 @@ This directory contains repository-level documentation for maintainers and contr
- [Draw.io Export Visual Regression](./maintainer/drawio-export-visual-regression.md)
- [Drawnix Export Spike](./maintainer/drawnix-export-spike.md)
- [circuitikz Figure Generation Roadmap](./maintainer/circuitikz-figure-generation-roadmap.md)
- [circuitikz UI, Export, And Docs Sync Plan](./maintainer/circuitikz-ui-export-and-docs-sync-2026-07-10.md)
- [Chapter Split + TOC Extraction](./chapter-split-toc.md)
- [Release Workflow](./maintainer/release-workflow.md)
- [Release Notes 1.8.2](./releases/1.8.2.md)
@ -40,6 +41,7 @@ This directory contains repository-level documentation for maintainers and contr
- [Diagram Reference Integration And Figure Generation Plan](./brainstorms/2026-07-04-diagram-reference-integration-and-figure-generation-plan.md)
- [circuitikz Figure Generation Roadmap](./maintainer/circuitikz-figure-generation-roadmap.md)
- [circuitikz Export Prototype](./maintainer/circuitikz-export-prototype.md)
- [circuitikz UI, Export, And Docs Sync Plan](./maintainer/circuitikz-ui-export-and-docs-sync-2026-07-10.md)
- [Diagram Platform Phase 2 Requirements](./brainstorms/2026-04-14-diagram-platform-phase-2-requirements.md)
- [Local KB Retrieval Decision And Quality Truth](./brainstorms/2026-06-09-local-kb-retrieval-decision-and-quality-truth.md)
- [Local KB RAG Quality And Execution Truth](./brainstorms/2026-06-09-local-kb-rag-quality-and-execution-truth.md)

View file

@ -20,6 +20,7 @@
- [draw.io 导出视觉回归 Runbook](./maintainer/drawio-export-visual-regression.zh-CN.md)
- [Drawnix 导出 Spike](./maintainer/drawnix-export-spike.zh-CN.md)
- [circuitikz Figure Generation Roadmap](./maintainer/circuitikz-figure-generation-roadmap.zh-CN.md)
- [circuitikz UI、导出与文档同步方案](./maintainer/circuitikz-ui-export-and-docs-sync-2026-07-10.zh-CN.md)
- [章节拆分 + TOC 提取](./chapter-split-toc.zh-CN.md)
- [发布流程](./maintainer/release-workflow.zh-CN.md)
- [1.8.2 发布说明](./releases/1.8.2.zh-CN.md)
@ -38,6 +39,7 @@
- [图形参考项目集成与 Figure 生成扩展方案](./brainstorms/2026-07-04-diagram-reference-integration-and-figure-generation-plan.zh-CN.md)
- [circuitikz Figure Generation Roadmap](./maintainer/circuitikz-figure-generation-roadmap.zh-CN.md)
- [circuitikz 导出原型](./maintainer/circuitikz-export-prototype.zh-CN.md)
- [circuitikz UI、导出与文档同步方案](./maintainer/circuitikz-ui-export-and-docs-sync-2026-07-10.zh-CN.md)
- [Diagram Platform Phase 2 Requirements](./brainstorms/2026-04-14-diagram-platform-phase-2-requirements.zh-CN.md)
- [Local KB Retrieval 方案决策与质量真值](./brainstorms/2026-06-09-local-kb-retrieval-decision-and-quality-truth.zh-CN.md)
- [Local KB RAG 质量与执行链路真值](./brainstorms/2026-06-09-local-kb-rag-quality-and-execution-truth.zh-CN.md)

View file

@ -1,6 +1,6 @@
# Notemd Architecture Overview
> Updated: 2026-05-07
> Updated: 2026-07-10
## System Architecture
@ -36,7 +36,7 @@ flowchart TB
subgraph Output["Output"]
VAULT["Vault Files<br/>(.md, .canvas, .json)"]
PREVIEW["Diagram Preview Modal"]
EXPORT["SVG / PNG Export"]
EXPORT["Source / SVG / PNG / PDF Export"]
end
CMD --> DISPATCH
@ -142,7 +142,7 @@ flowchart LR
end
subgraph Render["Render Plane"]
REGISTRY["RendererRegistry<br/>7 renderers"]
REGISTRY["RendererRegistry<br/>8 renderers"]
SERVICE["RendererService"]
CACHE2["RenderCache"]
end
@ -152,12 +152,15 @@ flowchart LR
CANVAS["JSON Canvas<br/>(canvasMap)"]
VEGA["Vega-Lite<br/>(dataChart)"]
HTML["HTML Fallback"]
FIGURE["Editable HTML/SVG"]
BOARD["Draw.io / Drawnix"]
CIRCUIT["Circuitikz"]
end
subgraph Host["Preview Layer"]
IFRAME["IframeRenderHost"]
MODAL["DiagramPreviewModal"]
EXPORT2["SVG / PNG Export"]
EXPORT2["Source / SVG / PNG / PDF Export"]
end
MD --> PLAN
@ -172,6 +175,9 @@ flowchart LR
REGISTRY --> CANVAS
REGISTRY --> VEGA
REGISTRY --> HTML
REGISTRY --> FIGURE
REGISTRY --> BOARD
REGISTRY --> CIRCUIT
MERMAID --> IFRAME
CANVAS --> IFRAME
VEGA --> IFRAME
@ -189,8 +195,22 @@ flowchart LR
| `classDiagram` | mermaid | MermaidRenderer | modal/iframe | SVG, PNG |
| `erDiagram` | mermaid | MermaidRenderer | modal/iframe | SVG, PNG |
| `stateDiagram` | mermaid | MermaidRenderer | modal/iframe | SVG, PNG |
| `canvasMap` | json-canvas | JsonCanvasRenderer | modal/iframe | SVG, source |
| `dataChart` | vega-lite | VegaLiteRenderer | modal/iframe (sandboxed) | SVG, source |
| `canvasMap` | json-canvas | JsonCanvasRenderer | modal/iframe | source, SVG, PNG, PDF |
| `dataChart` | vega-lite | VegaLiteRenderer | modal/iframe (sandboxed) | source, SVG, PNG, PDF |
| `circuit` | circuitikz | CircuitikzRenderer | SVG companion or source-only preview | `.tex`, SVG, PNG, PDF |
### Explicit Render Targets
The spec-first pipeline can also force a render target independently from the inferred intent for `Generate diagram` and `Preview diagram`. The standard `Summarise as Mermaid diagram` command remains Mermaid-compatible.
| Render target | Artifact boundary | Runtime dependency policy |
|---|---|---|
| `editable-html-svg` | Self-contained HTML with semantic inline SVG | no external editor runtime |
| `drawio` | `.drawio` XML plus SVG/MD review companions | no diagrams.net runtime in the plugin |
| `drawnix` | `.drawnix` JSON subset plus SVG/MD review companions | no Drawnix or Plait runtime in the plugin |
| `circuitikz` | validated `.tex` source plus SVG/MD review companions | no bundled LaTeX or TikZJax runtime |
Circuitikz support is intentionally constrained. The front-end settings now expose `Circuit (Circuitikz)` as a preferred diagram type and `Circuitikz + SVG preview` as a preferred render target without requiring Developer mode, but the renderer still accepts only a validated `DiagramSpec(intent: "circuit", circuitSpec)`. It writes deterministic circuitikz TeX and a reviewable SVG companion; real LaTeX/TikZJax compile evidence remains an optional maintainer smoke check.
## Module Map

View file

@ -1,6 +1,6 @@
# Notemd 系统架构总览
> 更新2026-05-07
> 更新2026-07-10
## 系统架构
@ -36,7 +36,7 @@ flowchart TB
subgraph Output["输出"]
VAULT["Vault 文件<br/>(.md, .canvas, .json)"]
PREVIEW["图表预览弹窗"]
EXPORT["SVG / PNG 导出"]
EXPORT["源文件 / SVG / PNG / PDF 导出"]
end
CMD --> DISPATCH
@ -142,7 +142,7 @@ flowchart LR
end
subgraph Render["渲染层"]
REGISTRY["RendererRegistry<br/>7 个渲染器"]
REGISTRY["RendererRegistry<br/>8 个渲染器"]
SERVICE["RendererService"]
CACHE2["RenderCache"]
end
@ -152,12 +152,15 @@ flowchart LR
CANVAS["JSON Canvas<br/>(画布图)"]
VEGA["Vega-Lite<br/>(数据图表)"]
HTML["HTML 回退"]
FIGURE["可编辑 HTML/SVG"]
BOARD["Draw.io / Drawnix"]
CIRCUIT["Circuitikz"]
end
subgraph Host["预览层"]
IFRAME["IframeRenderHost"]
MODAL["DiagramPreviewModal"]
EXPORT2["SVG / PNG 导出"]
EXPORT2["源文件 / SVG / PNG / PDF 导出"]
end
MD --> PLAN
@ -172,6 +175,9 @@ flowchart LR
REGISTRY --> CANVAS
REGISTRY --> VEGA
REGISTRY --> HTML
REGISTRY --> FIGURE
REGISTRY --> BOARD
REGISTRY --> CIRCUIT
MERMAID --> IFRAME
CANVAS --> IFRAME
VEGA --> IFRAME
@ -189,8 +195,22 @@ flowchart LR
| `classDiagram` | mermaid | MermaidRenderer | 弹窗/iframe | SVG、PNG |
| `erDiagram` | mermaid | MermaidRenderer | 弹窗/iframe | SVG、PNG |
| `stateDiagram` | mermaid | MermaidRenderer | 弹窗/iframe | SVG、PNG |
| `canvasMap` | json-canvas | JsonCanvasRenderer | 弹窗/iframe | SVG、源文件 |
| `dataChart` | vega-lite | VegaLiteRenderer | 弹窗/iframe沙盒 | SVG、源文件 |
| `canvasMap` | json-canvas | JsonCanvasRenderer | 弹窗/iframe | 源文件、SVG、PNG、PDF |
| `dataChart` | vega-lite | VegaLiteRenderer | 弹窗/iframe沙盒 | 源文件、SVG、PNG、PDF |
| `circuit` | circuitikz | CircuitikzRenderer | SVG companion 或 source-only 预览 | `.tex`、SVG、PNG、PDF |
### 显式渲染目标
`Generate diagram``Preview diagram` 而言,规格优先 pipeline 可以在意图推断之外显式指定渲染目标。标准的 `Summarise as Mermaid diagram` 命令仍保持 Mermaid 兼容输出。
| 渲染目标 | Artifact 边界 | Runtime 依赖策略 |
|---|---|---|
| `editable-html-svg` | 带语义 inline SVG 的自包含 HTML | 不依赖外部编辑器 runtime |
| `drawio` | `.drawio` XML 加 SVG/MD review companion | 插件内不嵌入 diagrams.net runtime |
| `drawnix` | `.drawnix` JSON 子集加 SVG/MD review companion | 插件内不嵌入 Drawnix 或 Plait runtime |
| `circuitikz` | 经过验证的 `.tex` 源文件加 SVG/MD review companion | 不捆绑 LaTeX 或 TikZJax runtime |
Circuitikz 支持仍然是受约束的。前端设置现在无需开启 Developer mode 就会显示 `Circuit (Circuitikz)` 首选图表类型与 `Circuitikz + SVG preview` 首选渲染目标,但 renderer 仍只接受经过验证的 `DiagramSpec(intent: "circuit", circuitSpec)`。它会写出确定性的 circuitikz TeX 和可审阅的 SVG companion真实 LaTeX/TikZJax 编译证据仍属于可选的维护者 smoke check。
## 模块地图

View file

@ -0,0 +1,59 @@
---
date: 2026-07-10
topic: circuitikz-ui-export-and-docs-sync
---
# circuitikz UI, Export, And Docs Sync Plan
Language: **English** | [简体中文](./circuitikz-ui-export-and-docs-sync-2026-07-10.zh-CN.md)
This note records the current-main comparison for circuitikz support, the front-end visibility fix, the export boundary, and the website MDX synchronization decision.
## Current Code Evidence
The circuitikz work is already present in the codebase. The missing product behavior was discoverability, not the renderer itself.
| Requirement | Current evidence |
|---|---|
| Front-end circuit option | `Preferred diagram type` includes `Circuit (Circuitikz)` and `Preferred render target` includes `Circuitikz + SVG preview`. These settings are now visible without Developer mode. |
| Constrained generation | `DiagramSpec(intent: "circuit", circuitSpec)` is validated before `CircuitikzRenderer` writes output. Raw free-form TikZ remains out of scope. |
| Source artifact | Circuitikz output is saved as deterministic `.tex`. |
| Preview artifact | The renderer attaches an SVG companion derived from the validated `CircuitSpec`. |
| Multi-format export | Preview/export surfaces can export the companion as SVG, PNG, and PDF; the CLI can also write circuitikz plus SVG/PNG/PDF review evidence from one `DiagramSpec`. |
| Maintainer smoke | `npm run diagram:export-circuitikz` and `npm run diagram:smoke-circuitikz` provide the optional LaTeX/TikZJax evidence boundary without making either runtime mandatory in the plugin. |
## UI Decision
Circuit diagrams are a user-facing diagram mode, so hiding the diagram type and render target behind Developer mode made the implementation look absent. The settings page should expose the diagram pipeline controls to normal users:
- `Enable spec-first Mermaid pipeline`
- `Experimental compatibility mode`
- `Preferred diagram type`
- `Preferred render target`
- `Diagram image export PPI`
Developer mode still owns diagnostics, relaxed input gates, and advanced file-selection controls. The circuitikz labels remain deliberately precise: the product exposes `Circuitikz + SVG preview`, not a promise of in-plugin LaTeX compilation.
## Website And MDX Sync Decision
The many localized `website/i18n/**/features/diagrams.mdx` files should not be treated as pollution by default. The website's publishing policy requires every public documentation locale to mirror every English docs route before deployment.
The review rule is stricter:
- Commit localized MDX only after the English source page is stable.
- Keep `website/docs/features/diagrams.mdx` as the main authored source.
- Use `website/scripts/generate-localized-docs.cjs` for broad regeneration and focused scripts such as `website/scripts/sync-diagrams-locale-delta.cjs` only for reviewed deltas.
- For LM Studio-assisted translation deltas, keep batches bounded to 12 locales or fewer and keep the estimated batch context below the configured 32k model window. Finish and validate one batch before injecting the next batch.
- Do not commit debug-output folders, partial locale files, or temporary model responses.
This means localized MDX is a published artifact, not a build cache. It belongs in the repository when it is reviewed and passes the website contract tests.
## Next Direction
The remaining circuitikz work should focus on visual confidence rather than adding arbitrary syntax breadth:
- Keep `CircuitSpec` constrained to the validated golden families.
- Add OCR-level or screenshot-level checks only after the structural SVG/PNG smoke checks stop producing obvious false positives.
- Keep LaTeX/TikZJax optional and explicit.
- Treat automatic topology-preserving repair as a later phase gated by compile diagnostics, render smoke, and topology signature preservation.
- Keep the docs site aligned with the exact UI wording so users can find `Circuit (Circuitikz)` and understand the SVG/PNG/PDF export boundary.

View file

@ -0,0 +1,59 @@
---
date: 2026-07-10
topic: circuitikz-ui-export-and-docs-sync
---
# circuitikz UI、导出与文档同步方案
语言: [English](./circuitikz-ui-export-and-docs-sync-2026-07-10.md) | **简体中文**
本文记录 circuitikz 支持在当前 main 上的代码对照、前端可见性修正、导出边界,以及网站 MDX 同步决策。
## 当前代码证据
circuitikz 工作已经进入代码库。缺口不是 renderer 本身,而是用户发现路径。
| 需求 | 当前证据 |
|---|---|
| 前端电路图选项 | `Preferred diagram type` 包含 `Circuit (Circuitikz)``Preferred render target` 包含 `Circuitikz + SVG preview`。这些设置现在无需 Developer mode 也可见。 |
| 受约束生成 | `DiagramSpec(intent: "circuit", circuitSpec)` 会先验证,再由 `CircuitikzRenderer` 写出结果。任意自由 TikZ 仍不属于当前范围。 |
| 源文件 artifact | Circuitikz 输出会保存为确定性的 `.tex`。 |
| 预览 artifact | Renderer 会从已验证的 `CircuitSpec` 附加 SVG companion。 |
| 多格式导出 | 预览/导出界面可以把 companion 导出为 SVG、PNG、PDFCLI 也可以从同一个 `DiagramSpec` 写出 circuitikz 以及 SVG/PNG/PDF review evidence。 |
| 维护者 smoke | `npm run diagram:export-circuitikz``npm run diagram:smoke-circuitikz` 提供可选 LaTeX/TikZJax 证据边界,但不会把二者变成插件运行时硬依赖。 |
## UI 决策
电路图是面向用户的图表模式,把图表类型和渲染目标藏在 Developer mode 后面会让已有实现看起来像不存在。因此设置页应向普通用户展示图表 pipeline 控制项:
- `Enable spec-first Mermaid pipeline`
- `Experimental compatibility mode`
- `Preferred diagram type`
- `Preferred render target`
- `Diagram image export PPI`
Developer mode 仍负责诊断、宽松输入开关和高级文件筛选控制。circuitikz 文案继续保持精确:产品暴露的是 `Circuitikz + SVG preview`,不是插件内 LaTeX 编译承诺。
## 网站与 MDX 同步决策
大量 `website/i18n/**/features/diagrams.mdx` 本身不应默认视为污染。网站发布策略要求每个公开文档 locale 在部署前都镜像 English docs 的每条路由。
但 review 规则要更严格:
- 先稳定 `website/docs/features/diagrams.mdx` 英文源页面,再提交本地化 MDX。
- 继续把英文源页面当作主编辑面。
- 大范围再生成使用 `website/scripts/generate-localized-docs.cjs`;已审阅的小增量可使用 `website/scripts/sync-diagrams-locale-delta.cjs` 这类聚焦脚本。
- 若使用 LM Studio 辅助翻译增量,每批最多 12 个 locale并让估算上下文低于 32k 模型窗口;一批完成并验证后,再注入下一批。
- 不提交 debug 输出目录、半同步 locale 文件或临时模型响应。
因此,本地化 MDX 是发布 artifact不是 build cache。只要经过 review 并通过网站契约测试,它们就属于仓库。
## 后续方向
circuitikz 剩余工作应优先提升视觉可信度,而不是扩展任意语法面:
- 继续把 `CircuitSpec` 限定在已验证 golden families。
- 只有在结构性 SVG/PNG smoke 检查稳定后,再推进 OCR 或 screenshot 级检查。
- LaTeX/TikZJax 保持可选、显式配置。
- 自动 topology-preserving repair 作为后续阶段,必须受 compile diagnostics、render smoke 和 topology signature preservation 共同约束。
- 保持文档站点与 UI 文案一致,让用户能找到 `Circuit (Circuitikz)`,并理解 SVG/PNG/PDF 导出边界。

View file

@ -64,6 +64,14 @@ What this changes:
- The correct future target boundary is still `DiagramSpec -> target-specific adapter -> renderer/export artifact`; production code should not route `DiagramSpec` back through Mermaid text just to reuse string-to-board converters.
- The next implementation priority remains boundary hardening before expansion. When new target work resumes, editable HTML/SVG should precede `.drawnix` because it proves layout, text fitting, and Draw.io export claims without importing a heavy whiteboard runtime.
## 2026-07-10 circuitikz UI And Export Truth Sync
The constrained circuitikz path is now a current-main product surface rather than only a maintainer prototype. `CircuitikzRenderer` writes deterministic `.tex` from a validated `DiagramSpec(intent: "circuit", circuitSpec)` and attaches an SVG companion that the preview/export UI can export as SVG, PNG, and PDF. The CLI export path also supports `circuitikz`, `svg`, `png`, and `pdf` review evidence from one `DiagramSpec`.
The important correction is front-end visibility: the settings page should expose the diagram pipeline controls, including `Circuit (Circuitikz)` and `Circuitikz + SVG preview`, without requiring Developer mode. Developer mode remains the home for diagnostics and relaxed input gates, not for normal diagram target discovery.
The detailed current-main comparison and MDX publishing decision are recorded in `docs/maintainer/circuitikz-ui-export-and-docs-sync-2026-07-10.md`.
---
**Goal:** Evolve Notemd from a single Mermaid-text generation path into an extensible diagram platform built around intent detection, structured specs, specialized renderers, and multi-format output inside Obsidian.

View file

@ -64,6 +64,14 @@ Cloudy 与 Drawnix 的参考项目分析已记录在 `docs/brainstorms/2026-07-0
- 后续正确 target 边界仍应保持为 `DiagramSpec -> target-specific adapter -> renderer/export artifact`;生产路径不应为了复用 string-to-board converter`DiagramSpec` 绕回 Mermaid 文本。
- 下一步实现优先级仍然是先做边界硬化,再做扩展。等新 target 工作恢复时,可编辑 HTML/SVG 应先于 `.drawnix`,因为它可以在不引入重型白板 runtime 的前提下先证明 layout、text fitting 与 Draw.io export claim。
## 2026-07-10 circuitikz UI 与导出真值同步
受约束的 circuitikz 路径现在已经是当前 main 上的产品表面,而不只是维护者原型。`CircuitikzRenderer` 会从经过验证的 `DiagramSpec(intent: "circuit", circuitSpec)` 写出确定性 `.tex`,并附加一个 SVG companion预览/导出 UI 可以把该 companion 导出为 SVG、PNG 与 PDF。CLI 导出路径也支持从同一个 `DiagramSpec` 生成 `circuitikz`、`svg`、`png` 与 `pdf` review evidence。
关键校正是前端可见性:设置页应无需 Developer mode 就暴露图表 pipeline 控制项,包括 `Circuit (Circuitikz)``Circuitikz + SVG preview`。Developer mode 仍负责诊断与宽松输入 gate而不负责普通图表目标发现。
详细的当前 main 对照与 MDX 发布决策记录在 `docs/maintainer/circuitikz-ui-export-and-docs-sync-2026-07-10.zh-CN.md`
---
**目标:** 将 Notemd 从“LLM 直接生成 Mermaid 文本并事后修补”的单一路径,升级为“图形意图识别 + 中间规格 + 专门渲染 + 多格式输出”的可扩展图形平台,在 Obsidian 内稳定支持更多图像与图表类型。

View file

@ -599,6 +599,35 @@ describe('provider settings behavior', () => {
};
});
test('shows diagram render target controls without developer mode', async () => {
const plugin = createPlugin();
plugin.settings.enableDeveloperMode = false;
plugin.settings.enableExperimentalDiagramPipeline = true;
plugin.settings.experimentalDiagramCompatibilityMode = 'best-fit';
const tab = new NotemdSettingTab(mockApp as any, plugin as any) as any;
tab.display();
const intentSetting = findSettingByName(tab.containerEl, 'Preferred diagram type');
const targetSetting = findSettingByName(tab.containerEl, 'Preferred render target');
expect(intentSetting).toBeDefined();
expect(targetSetting).toBeDefined();
const intentDropdown = intentSetting?.controls.find(control => control.kind === 'dropdown') as MockDropdownControl | undefined;
const targetDropdown = targetSetting?.controls.find(control => control.kind === 'dropdown') as MockDropdownControl | undefined;
expect(intentDropdown?.options.circuit).toBe('Circuit (Circuitikz)');
expect(targetDropdown?.options.circuitikz).toBe('Circuitikz + SVG preview');
await intentDropdown?.onChangeHandler?.('circuit');
await targetDropdown?.onChangeHandler?.('circuitikz');
expect(plugin.settings.preferredDiagramIntent).toBe('circuit');
expect(plugin.settings.preferredDiagramRenderTarget).toBe('circuitikz');
expect(plugin.saveSettings).toHaveBeenCalledTimes(2);
});
test('keeps advanced settings collapsed after the user closes them and reopens the settings tab', () => {
const plugin = createPlugin();
const provider = plugin.settings.providers.find((entry: any) => entry.name === 'DeepSeek');

View file

@ -2314,6 +2314,94 @@ export class NotemdSettingTab extends PluginSettingTab {
await this.plugin.saveSettings();
}));
const experimentalDiagramI18n = i18n.settings.developer.experimentalDiagramPipeline;
new Setting(containerEl).setName(experimentalDiagramI18n.heading).setHeading();
new Setting(containerEl)
.setName(experimentalDiagramI18n.enableName)
.setDesc(experimentalDiagramI18n.enableDesc)
.addToggle(toggle => toggle
.setValue(this.plugin.settings.enableExperimentalDiagramPipeline)
.onChange(async (value) => {
this.plugin.settings.enableExperimentalDiagramPipeline = value;
await this.plugin.saveSettings();
this.display();
}));
new Setting(containerEl)
.setName(experimentalDiagramI18n.compatibilityName)
.setDesc(experimentalDiagramI18n.compatibilityDesc)
.addDropdown(dropdown => {
dropdown.addOption('legacy-mermaid', experimentalDiagramI18n.compatibilityLegacy);
dropdown.addOption('best-fit', experimentalDiagramI18n.compatibilityBestFit);
dropdown
.setValue(this.plugin.settings.experimentalDiagramCompatibilityMode)
.onChange(async (value: 'legacy-mermaid' | 'best-fit') => {
this.plugin.settings.experimentalDiagramCompatibilityMode = value;
await this.plugin.saveSettings();
});
});
new Setting(containerEl)
.setName(experimentalDiagramI18n.intentName)
.setDesc(experimentalDiagramI18n.intentDesc)
.addDropdown(dropdown => {
dropdown.addOption('auto', experimentalDiagramI18n.intentAuto);
dropdown.addOption('flowchart', experimentalDiagramI18n.intentFlowchart);
dropdown.addOption('sequence', experimentalDiagramI18n.intentSequence);
dropdown.addOption('classDiagram', experimentalDiagramI18n.intentClassDiagram);
dropdown.addOption('erDiagram', experimentalDiagramI18n.intentErDiagram);
dropdown.addOption('stateDiagram', experimentalDiagramI18n.intentStateDiagram);
dropdown.addOption('circuit', experimentalDiagramI18n.intentCircuit);
dropdown.addOption('dataChart', experimentalDiagramI18n.intentDataChart);
dropdown
.setValue(this.plugin.settings.preferredDiagramIntent || 'auto')
.onChange(async (value: string) => {
this.plugin.settings.preferredDiagramIntent = value === 'auto' ? undefined : value;
await this.plugin.saveSettings();
});
});
new Setting(containerEl)
.setName(experimentalDiagramI18n.renderTargetName)
.setDesc(experimentalDiagramI18n.renderTargetDesc)
.addDropdown(dropdown => {
dropdown.addOption('auto', experimentalDiagramI18n.renderTargetAuto);
dropdown.addOption('mermaid', experimentalDiagramI18n.renderTargetMermaid);
dropdown.addOption('json-canvas', experimentalDiagramI18n.renderTargetJsonCanvas);
dropdown.addOption('vega-lite', experimentalDiagramI18n.renderTargetVegaLite);
dropdown.addOption('html', experimentalDiagramI18n.renderTargetHtml);
dropdown.addOption('editable-html-svg', experimentalDiagramI18n.renderTargetEditableHtmlSvg);
dropdown.addOption('drawio', experimentalDiagramI18n.renderTargetDrawio);
dropdown.addOption('drawnix', experimentalDiagramI18n.renderTargetDrawnix);
dropdown.addOption('circuitikz', experimentalDiagramI18n.renderTargetCircuitikz);
dropdown
.setValue(this.plugin.settings.preferredDiagramRenderTarget || 'auto')
.onChange(async (value: string) => {
this.plugin.settings.preferredDiagramRenderTarget = value === 'auto'
? undefined
: value as RenderTarget;
await this.plugin.saveSettings();
});
});
new Setting(containerEl)
.setName(experimentalDiagramI18n.exportPpiName)
.setDesc(experimentalDiagramI18n.exportPpiDesc)
.addText(text => text
.setPlaceholder(String(DEFAULT_SETTINGS.diagramPreviewExportPpi))
.setValue(String(this.plugin.settings.diagramPreviewExportPpi ?? DEFAULT_SETTINGS.diagramPreviewExportPpi))
.onChange(async (rawValue) => {
this.plugin.settings.diagramPreviewExportPpi = this.sanitizePositiveInteger(
rawValue,
DEFAULT_SETTINGS.diagramPreviewExportPpi,
MIN_PREVIEW_EXPORT_PPI,
MAX_PREVIEW_EXPORT_PPI
);
await this.plugin.saveSettings();
}));
new Setting(containerEl)
.setName(i18n.settings.developer.modeName)
.setDesc(i18n.settings.developer.modeDesc)
@ -2350,8 +2438,6 @@ export class NotemdSettingTab extends PluginSettingTab {
}
if (this.plugin.settings.enableDeveloperMode && activeProvider) {
const experimentalDiagramI18n = i18n.settings.developer.experimentalDiagramPipeline;
const diagnosticModeOptions = getProviderDiagnosticCallModeOptions(activeProvider);
const modeSet = new Set(diagnosticModeOptions.map(option => option.value));
let effectiveCallMode = this.plugin.settings.developerDiagnosticCallMode as ProviderDiagnosticCallMode;
@ -2449,92 +2535,6 @@ export class NotemdSettingTab extends PluginSettingTab {
});
});
new Setting(containerEl).setName(experimentalDiagramI18n.heading).setHeading();
new Setting(containerEl)
.setName(experimentalDiagramI18n.enableName)
.setDesc(experimentalDiagramI18n.enableDesc)
.addToggle(toggle => toggle
.setValue(this.plugin.settings.enableExperimentalDiagramPipeline)
.onChange(async (value) => {
this.plugin.settings.enableExperimentalDiagramPipeline = value;
await this.plugin.saveSettings();
this.display();
}));
new Setting(containerEl)
.setName(experimentalDiagramI18n.compatibilityName)
.setDesc(experimentalDiagramI18n.compatibilityDesc)
.addDropdown(dropdown => {
dropdown.addOption('legacy-mermaid', experimentalDiagramI18n.compatibilityLegacy);
dropdown.addOption('best-fit', experimentalDiagramI18n.compatibilityBestFit);
dropdown
.setValue(this.plugin.settings.experimentalDiagramCompatibilityMode)
.onChange(async (value: 'legacy-mermaid' | 'best-fit') => {
this.plugin.settings.experimentalDiagramCompatibilityMode = value;
await this.plugin.saveSettings();
});
});
new Setting(containerEl)
.setName(experimentalDiagramI18n.intentName)
.setDesc(experimentalDiagramI18n.intentDesc)
.addDropdown(dropdown => {
dropdown.addOption('auto', experimentalDiagramI18n.intentAuto);
dropdown.addOption('flowchart', experimentalDiagramI18n.intentFlowchart);
dropdown.addOption('sequence', experimentalDiagramI18n.intentSequence);
dropdown.addOption('classDiagram', experimentalDiagramI18n.intentClassDiagram);
dropdown.addOption('erDiagram', experimentalDiagramI18n.intentErDiagram);
dropdown.addOption('stateDiagram', experimentalDiagramI18n.intentStateDiagram);
dropdown.addOption('circuit', experimentalDiagramI18n.intentCircuit);
dropdown.addOption('dataChart', experimentalDiagramI18n.intentDataChart);
dropdown
.setValue(this.plugin.settings.preferredDiagramIntent || 'auto')
.onChange(async (value: string) => {
this.plugin.settings.preferredDiagramIntent = value === 'auto' ? undefined : value;
await this.plugin.saveSettings();
});
});
new Setting(containerEl)
.setName(experimentalDiagramI18n.renderTargetName)
.setDesc(experimentalDiagramI18n.renderTargetDesc)
.addDropdown(dropdown => {
dropdown.addOption('auto', experimentalDiagramI18n.renderTargetAuto);
dropdown.addOption('mermaid', experimentalDiagramI18n.renderTargetMermaid);
dropdown.addOption('json-canvas', experimentalDiagramI18n.renderTargetJsonCanvas);
dropdown.addOption('vega-lite', experimentalDiagramI18n.renderTargetVegaLite);
dropdown.addOption('html', experimentalDiagramI18n.renderTargetHtml);
dropdown.addOption('editable-html-svg', experimentalDiagramI18n.renderTargetEditableHtmlSvg);
dropdown.addOption('drawio', experimentalDiagramI18n.renderTargetDrawio);
dropdown.addOption('drawnix', experimentalDiagramI18n.renderTargetDrawnix);
dropdown.addOption('circuitikz', experimentalDiagramI18n.renderTargetCircuitikz);
dropdown
.setValue(this.plugin.settings.preferredDiagramRenderTarget || 'auto')
.onChange(async (value: string) => {
this.plugin.settings.preferredDiagramRenderTarget = value === 'auto'
? undefined
: value as RenderTarget;
await this.plugin.saveSettings();
});
});
new Setting(containerEl)
.setName(experimentalDiagramI18n.exportPpiName)
.setDesc(experimentalDiagramI18n.exportPpiDesc)
.addText(text => text
.setPlaceholder(String(DEFAULT_SETTINGS.diagramPreviewExportPpi))
.setValue(String(this.plugin.settings.diagramPreviewExportPpi ?? DEFAULT_SETTINGS.diagramPreviewExportPpi))
.onChange(async (rawValue) => {
this.plugin.settings.diagramPreviewExportPpi = this.sanitizePositiveInteger(
rawValue,
DEFAULT_SETTINGS.diagramPreviewExportPpi,
MIN_PREVIEW_EXPORT_PPI,
MAX_PREVIEW_EXPORT_PPI
);
await this.plugin.saveSettings();
}));
new Setting(containerEl)
.setName(stableApiI18n.longRequestName)
.setDesc(stableApiI18n.longRequestDesc)

View file

@ -82,7 +82,7 @@ The experimental spec-first pipeline now has two independent controls:
| Preferred diagram type | `preferredDiagramIntent` | Guides the semantic shape of the generated `DiagramSpec` |
| Preferred render target | `preferredDiagramRenderTarget` | Chooses the artifact renderer for **Generate diagram** and **Preview diagram** |
Set **Preferred render target** to **Auto** for the planner default, or choose Mermaid, JSON Canvas, Vega-Lite, HTML, Editable HTML/SVG, Draw.io, Drawnix, or Circuitikz explicitly. The override applies only to artifact and preview commands. The standard **Summarise as Mermaid diagram** command remains pinned to Mermaid-compatible output so existing Markdown workflows do not silently switch formats.
Set **Preferred render target** to **Auto** for the planner default, or choose Mermaid, JSON Canvas, Vega-Lite, HTML, Editable HTML/SVG, Draw.io, Drawnix, or Circuitikz explicitly. These controls are regular diagram settings and sidebar controls rather than Developer mode diagnostics. The override applies only to artifact and preview commands. The standard **Summarise as Mermaid diagram** command remains pinned to Mermaid-compatible output so existing Markdown workflows do not silently switch formats.
This separation matters because a `flowchart` intent can now be rendered as Mermaid for Markdown notes, HTML for robust fallback, Editable HTML/SVG for downstream editing, or Draw.io/Drawnix source artifacts with SVG review companions. A `circuit` intent routes to Circuitikz and requires a validated `CircuitSpec`; it is not a request for arbitrary TikZ text.
@ -362,7 +362,7 @@ For a CMOS inverter, the prompt should request an explicit topology plus layout
| General diagrams | Spec-first pipeline implemented for Mermaid, JSON Canvas, Vega-Lite, HTML | Keep expanding semantic verification coverage |
| Editable figures | `editable-html-svg`, Draw.io XML, and Drawnix JSON artifact boundaries implemented | Add richer primitives only after tests prove editability |
| CLI support | `npm run diagram:export-artifact` exports editable HTML/SVG, Draw.io, Drawnix, Circuitikz, and SVG/PNG/PDF review evidence from one validated `DiagramSpec` | Add target-specific smoke fixtures when new targets ship |
| circuitikz | `DiagramSpec(intent: "circuit", circuitSpec) -> CircuitikzRenderer -> circuitikz` exports common-source, CMOS inverter, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1`, and `cmos-nor2` / `cmos-nor2-v1` golden templates, exposes UI intent/render-target options, writes TeX plus SVG/PNG/PDF preview companions, validates topology before output, parses compile logs, can run explicit local renderers plus `--expected-artifact`, and keeps source-only fallback plus preview diagnostics visible through `RenderArtifact.diagnostics` and the preview modal | Add OCR-level label recognition for path-only visual text, precise pixel-level overlap checks, broader SVG path coverage where needed, automatic renderer installation/discovery only if it can remain optional, and automated topology-preserving repair execution |
| circuitikz | `DiagramSpec(intent: "circuit", circuitSpec) -> CircuitikzRenderer -> circuitikz` exports common-source, CMOS inverter, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1`, and `cmos-nor2` / `cmos-nor2-v1` golden templates, exposes UI intent/render-target options without Developer mode, writes TeX plus SVG/PNG/PDF preview companions, validates topology before output, parses compile logs, can run explicit local renderers plus `--expected-artifact`, and keeps source-only fallback plus preview diagnostics visible through `RenderArtifact.diagnostics` and the preview modal | Add OCR-level label recognition for path-only visual text, precise pixel-level overlap checks, broader SVG path coverage where needed, automatic renderer installation/discovery only if it can remain optional, and automated topology-preserving repair execution |
| TikZJax integration | Candidate render host for Obsidian-side display | Keep it optional; do not make TikZJax a hard plugin runtime dependency |
## Configuration
@ -396,7 +396,7 @@ When enabled, Notemd retrieves relevant context snippets from your vault's local
| PDF export | SVG → raster image at configured PPI → single-page PDF |
| Source save | Raw artifact content saved with target-specific extension |
| Source-only preview | Non-inline artifacts with source content shown as code plus diagnostics, without iframe rendering |
| Semantic audit | Mermaid, JSON Canvas, Vega-Lite, editable HTML/SVG, Draw.io, Drawnix, and constrained circuitikz checked by renderer/CLI tests |
| Semantic audit | Mermaid, JSON Canvas, Vega-Lite, editable HTML/SVG, Draw.io, Drawnix, and constrained circuitikz checked by `scripts/diagram-semantic-verification.js` plus renderer/CLI tests |
**Caching**: RenderCache uses deterministic JSON key of `{spec, target, theme}`. In-flight deduplication prevents duplicate renders.

View file

@ -1,7 +1,7 @@
---
id: diagrams
title: "رسومات تخطيطية"
description: "إنشاء Mermaid، JSON Canvas، Vega-Lite، HTML، وملفات رسومية قابلة للتعديل، بالإضافة إلى رسومات تخطيطية مقيدة في المستقبل circuitikz من ملاحظاتك باستخدام بنية مبنية على المواصفات أولاً"
description: "إنشاء رسومات Mermaid، JSON Canvas، Vega-Lite، HTML، وملفات رسومية قابلة للتعديل، بالإضافة إلى ملفات Draw.io، Drawnix، ورسومات circuitikz المقيدة من ملاحظاتك باستخدام بنية تعتمد على المواصفات أولاً"
author:
'@id': 'https://jacobinwwey.github.io/obsidian-NotEMD/#person-jacobinwwey'
keywords: [diagrams, mermaid, vega-lite, canvas, visualization, spec-first, drawio, drawnix, editable svg, circuitikz, TikZJax]
@ -18,7 +18,7 @@ import TLDR from '@site/src/components/TLDR';
# رسومات تخطيطية
<TLDR>
**Notemd يُنشئ الرسومات التخطيطية من ملاحظاتك عبر خط أنابيب يعتمد على المواصفات أولاً.** يُنتج LLM ملف `DiagramSpec` JSON غير مرتبط بمحرك العرض، ثم تقوم محولات مخصصة بتحويله إلى Mermaid، JSON Canvas، Vega-Lite، HTML، أو مخرجات قابلة للتعديل HTML/SVG. يدعم 8 أنواع من النوايا، وسلاسل البديل التلقائية، وعرض تجريبي مباشر مع تصدير SVG/PNG، والتحقق الدلالي، والإنشاء المعزز بالمعرفة المحلية.
**Notemd يقوم بإنشاء الرسومات من ملاحظاتك عبر سلسلة عمليات تعتمد على المواصفات أولاً.** ينتج النموذج اللغوي الكبير ملف JSON من نوع `DiagramSpec` غير مرتبط بأي محرك عرض، ثم تقوم محولات متخصصة بتحويله إلى صيغ Mermaid، JSON Canvas، Vega-Lite، HTML، HTML/SVG قابل للتعديل، Draw.io، Drawnix، أو رسومات circuitikz المقيدة. يدعم التطبيق 9 أنواع من النوايا، وسلاسل انتقال تلقائية كبديل، وعرض تجريبي مباشر مع إمكانية تصدير بصيغ SVG/PNG/PDF، والتحقق الدلالي، بالإضافة إلى عملية إنشاء معززة بالمعرفة المحلية.
</TLDR>
هذا جزء من [Obsidian دليل إدارة المعرفة الذكية](/docs/pillar-ai-knowledge).
@ -54,6 +54,7 @@ graph LR
| `stateDiagram` | Mermaid | HTML | آلات الحالة، نماذج دورة الحياة |
| `canvasMap` | JSON Canvas | Mermaid → HTML | خرائط المفاهيم، رسومات المعرفة |
| `dataChart` | Vega-Lite | Mermaid → HTML | الرسوم البيانية من نوع البار، الخط، المساحة، التشتت، الدائرة، الجداول |
| `circuit` | circuitikz | none | رسومات دوائر مقيدة مستخلصة من حمولات `CircuitSpec` المُصدَّقة |
## اكتشاف النية
@ -67,6 +68,7 @@ Notemd يحدد أفضل نوع رسم بياني من محتوى الملاحظ
| `stateDiagram` | الحالة، التحول، المعلق، الجاري، الفاشل (3 مطابقات أو أكثر) | 0.76 |
| `flowchart` | الخطوات المرقمة (2 خطوات أو أكثر) أو مفردات if/then/else/workflow | 0.74 |
| `canvasMap` | خريطة مفاهيم، رسم بياني للمعرفة، مكاني، مجموعات | 0.72 |
| `circuit` | circuitikz, TikZJax, circuit, schematic, CMOS, NMOS, PMOS, MOSFET, VDD/GND, `vin`/`vout` | 0.78 |
| `mindmap` | الخيار الافتراضي للتعويض | 0.55 |
قم بالتغلب على ذلك باستخدام إعداد **نوع الرسم المفضل**، أو محدد الشريط الجانبي، أو خيار واضح في لوحة الأوامر.
@ -80,10 +82,9 @@ Notemd يحدد أفضل نوع رسم بياني من محتوى الملاحظ
| نوع الرسم التخطيطي المفضل | `preferredDiagramIntent` | يوجه الشكل الدلالي لـ `DiagramSpec` المولد |
| الهدف المفضل للعرض | `preferredDiagramRenderTarget` | يختار مُحوّل الكائنات لـ **إنشاء مخطط** و **عرض مسبق للمخطط** |
قم بتعيين **الهدف المفضل للعرض** إلى **Auto** كإعداد افتراضي للمخطط، أو اختر Mermaid، JSON Canvas، Vega-Lite، HTML، أو HTML/SVG القابلة للتعديل صراحةً. ينطبق هذا التغيير فقط على أوامر الإنشاء والعرض التجريبي. تظل أمر **تلخيص البيانات كرسم بياني Mermaid** القياسي مرتبطةً بالمخرجات المتوافقة مع Mermaid، حتى لا تقوم سلاسل العمل الحالية المستخدمة في Markdown بتغيير التنسيقات دون إشعار.
يُعد هذا الفصل مهمًا لأن نية `flowchart` يمكن الآن تقديمها كـ Mermaid لملاحظات Markdown، أو كـ HTML كخيار احتياطي قوي، أو كـ HTML/SVG قابلة للتعديل للتعديل لاحقًا. يظل Draw.io وDrawnix مجرد مُصدرين للملفات من نوع CLI بدلاً من أن تكونا أهدافًا للتقديم داخل الإضافة.
قم بتحديد **الهدف المفضل للعرض** إلى **Auto** كإعداد افتراضي للمخطط، أو اختر صيغة Mermaid، JSON Canvas، Vega-Lite، HTML، HTML/SVG قابل للتعديل، Draw.io، Drawnix، أو Circuitikz بشكل صريح. ينطبق هذا التعديل فقط على أوامر إنشاء الملفات والعرض التجريبي. تظل الأمر القياسي **Summarise as Mermaid diagram** مرتبطًا بالإخراج المتوافق مع Mermaid حتى لا تتغير أنماط Markdown الحالية دون إشعار.
يُعد هذا الفصل مهمًا لأن نية `flowchart` يمكن الآن عرضها كرسومات Mermaid لملاحظات Markdown، أو كـ HTML كبديل موثوق، أو كـ HTML/SVG قابل للتعديل للتحرير لاحقًا، أو كملفات مصدر Draw.io/Drawnix مع ملفات مراجعة بصيغة SVG. أما نية `circuit` فهي توجه العملية إلى Circuitikz وتتطلب ملف `CircuitSpec` مُصدَّق؛ فهي ليست طلبًا لنصوص TikZ عشوائية.
## الاستخدام
### أنشئ رسمًا تخطيطيًا
@ -101,16 +102,21 @@ Notemd يحدد أفضل نوع رسم بياني من محتوى الملاحظ
| Vega-Lite | `.json` | `{note}_diagram.json` |
| HTML | `.html` | `{note}_diagram.html` |
| قابل للتعديل HTML/SVG | `.html` | `{note}_diagram.html` |
| Draw.io | `.drawio` + `.drawio.svg` + `.drawio.md` | `{note}_diagram.drawio` بالإضافة إلى ملفات المراجعة المصاحبة |
| Drawnix | `.drawnix` + `.drawnix.svg` + `.drawnix.md` | `{note}_diagram.drawnix` بالإضافة إلى ملفات المراجعة المصاحبة |
| Circuitikz | `.tex` + `.tex.svg` + `.tex.md` | `{note}_diagram.tex` بالإضافة إلى ملفات المراجعة المصاحبة |
### عرض مخطط تجريبي
1. تشغيل **"Notemd: عرض مخطط تجريبي"**
2. يظهر نافذة منبثقة تحتوي على المخطط المُعرض
3. تصديره كـ SVG أو PNG باستخدام أزرار شريط الأدوات
3. قم بتصدير الملف كصيغة SVG، PNG، أو PDF باستخدام أزرار شريط الأدوات
يتوفر خيار **فتح العرض التجريبي تلقائياً** في الإعدادات — بعد الإنشاء، تُفتح نافذة العرض التجريبي تلقائياً.
تحتوي نافذة العرض التجريبي أيضاً على لوحة تشخيص الآثار. يمكن لأدوات التحويل والفحوصات الأولية ربط `RenderArtifact.diagnostics`؛ تعرض النافذة ملخصاً تشخيصياً يتضمن أعداد الأخطاء/التحذيرات/المعلومات، ثم درجة الخطورة، نوع التشخيص، الرسالة، ونصائح الإصلاح بجانب العرض. يتم عرض نفس الملخص في سجلات تاريخ العروض التجريبية، مما يسمح بمقارنة محاولات الفحص الأولي circuitikz المتكررة دون فتح كل سجل. بالنسبة للآثار التي تحتوي على محتوى مصدري ولا يمكن تحويلها داخلياً أو عبر مسار الـ iframe HTML، تلجأ النافذة الآن إلى عرض تجريبي يعتمد فقط على المصدر بدلاً من إجبار استخدام iframe فارغ. هذا يوفر لـ circuitikz فحوصات التجميع/التحويل، وفحوصات رموز النص SVG، وفحوصات لقطات الشاشة الفارغة PNG، وتقارير التداخل المستقبلية سطحاً مرئياً UI دون جعل TikZJax أو LaTeX اعتماداً إلزامياً في وقت تشغيل الإضافات أو التظاهر بأن النص المصدري هو عرض بصري مؤكد.
يستخدم تصدير عرض التجريبي بصيغ PNG وPDF دقة النقاط المحددة مسبقًا. القيمة الافتراضية هي 300 نقطة في البوصة، وتُقيَّد القيم التي تزيد عن 600 نقطة في البوصة لتصبح 600. أما صيغة SVG فتظل بحجمها الناظمي. يمكن للملفات المصدرية مثل `.drawio`، `.drawnix`، و`.tex` توفير ملف مرافق باسم `previewSvg` حتى يتمكن Obsidian من عرض الصور القابلة للمراجعة وتصديرها دون تضمين محتويات من diagram.net، Drawnix، LaTeX، أو TikZJax أثناء تشغيل الإضافة.
يحتوي نموذج المعاينة أيضًا على لوحة تشخيص الكائنات. يمكن لأدوات التوليد وفحوصات الاختبار الأولية ربط بيانات `RenderArtifact.diagnostics`؛ حيث تعرض النافذة المنبثقة ملخصًا للتشخيص يوضح أعداد الأخطاء والتحذيرات والمعلومات، ثم درجة الخطورة ونوع التشخيص والرسالة ونصائح إصلاح المشكلة بجانب المعاينة. يتم عرض نفس الملخص في سجلات التاريخ التي تدعم التشخيص، مما يسمح بمقارنة محاولات فحص circuitikz المتكررة دون الحاجة إلى فتح كل سجل على حدة. بالنسبة للملفات التي تحتوي على محتوى أصلي ولكن لا يمكن عرضها داخل النص أو عبر مسار iframe HTML، فإن النافذة المنبثقة الآن تلجأ إلى عرض تجريبي يعتمد فقط على المحتوى الأصلي بدلاً من إجبار استخدام iframe فارغ. وهذا يوفر واجهة مستخدم واضحة لعمليات التجميع/العرض الخاصة بـ circuitikz، وفحوصات رموز النص في SVG، وفحوصات لقطات الشاشة الفارغة في PNG، وتقارير تداخل الرموز القائمة فقط على المسارات، بالإضافة إلى تقارير التداخل المستقبلية، دون جعل TikZJax أو LaTeX متطلبًا إلزاميًا لوقت التشغيل للإضافات، أو الادعاء بأن النص الأصلي هو عرض بصري مؤكد الصحة.
### وضع Mermaid القديم
@ -164,12 +170,12 @@ Notemd يحدد أفضل نوع رسم بياني من محتوى الملاحظ
### حدود التصدير Draw.io و Drawnix
التنفيذ الحالي يحافظ على دعم المحررات من الجهات الخارجية عند حدود الكائنات:
تحافظ التنفيذية الحالية على دعم المحررات من جهات خارجية ضمن حدود الملف الناتج، مع الاحتفاظ في الوقت نفسه بأهداف توليد واضحة:
| الهدف | العقد | اعتمادية وقت التشغيل |
|--------|----------|--------------------|
| Draw.io | `mxfile` غير مضغوط محدد من `SemanticFigureModel` | لا شيء في وقت تشغيل الإضافة أو في CI |
| Drawnix | مجموعة صغيرة من `.drawnix` JSON باستخدام عناصر `geometry` و `arrow-line` | لا شيء في وقت تشغيل الإضافة أو في CI |
| Draw.io | ملف XML `mxfile` غير مضغوط ومحدد المعالم مستخرج من `SemanticFigureModel`، بالإضافة إلى ملفات SVG/PNG/PDF للمراجعة | لا يوجد شيء في وقت تشغيل الإضافة أو في عمليات CI |
| Drawnix | مجموعة صغيرة من بيانات JSON من نوع `.drawnix` تستخدم عناصر `geometry` و `arrow-line`، بالإضافة إلى ملفات SVG/PNG/PDF للمراجعة | لا يوجد شيء في وقت تشغيل الإضافة أو في عمليات CI |
التضحية مقصودة: يمكن لـ Notemd التحقق من العلامات المرئية، والمعرفات المستقرة، وتغطية العناصر الأولية المدعومة دون تضمين Diagrams.net Desktop أو Drawnix أو Plait أو حالة المحرر الخاص بالمتصفح داخل الإضافة.
@ -213,7 +219,11 @@ Notemd يتضمن الآن أول نموذج تجريبي للمستودع ال
npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-inverter.tex
```
يضيف النموذج حدًا منفصلاً `CircuitSpec` ومُصدرًا محددًا لست عائلات مرجعية ذهبية:
يضيف النموذج الأولي حدودًا مقيدة من نوع `CircuitSpec` بالإضافة إلى مُصدر تصدير محدد المعالم لست عائلات مرجعية ذهبية:
في خط أنابيب الرسوم التخطيطية التجريبي، أصبح من الممكن الوصول إلى هذا الخيار الآن أيضًا عبر `intent: "circuit"` وهدف التوليد `circuitikz`. قد يتضمن ملف `DiagramSpec` المُولد معلومات من نوع `circuitSpec` فقط في حالة استخدام النية المتعلقة بالدوائر. يقوم `CircuitikzRenderer` بكتابة مصدر نصي من نوع `.tex` محدد المعالم ويضيف ملف مراجعة من نوع SVG مستخلص من تلك البنية الهندسية للدائرة المُصدقة، مما يتيح عرضًا تجريبيًا في Obsidian بالإضافة إلى تصدير الملفات بصيغ SVG/PNG/PDF. هذا الملف المرافق ليس نتيجة تجميع باستخدام LaTeX/TikZJax؛ فالأدلة الحقيقية لعملية التجميع تظل موجودة في أوامر الاختبار المحددة أدناه.
بالنسبة للقوالب الذهبية المدعومة، تظل خصائص `layoutHints.inputSide` و `layoutHints.outputSide` مجرد أدوات للعرض فقط. يمكنها تغيير مواقع منافذ الإدخال/الإخراج بشكل محدد المعالم، لكنها لا تغير خصائص البنية الهندسية ولا تسمح بإجراء عملية إصلاح لإعادة توصيل الدوائر.
| نوع الدائرة | المرجع الذهبي | ضمان التيار |
|--------------|------------------|-------------------|
@ -224,7 +234,7 @@ npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-in
| `cmos-nand2` | `cmos-nand2-v1` | يتحقق من تفعيل الرفع الموازي لـ PMOS والخفض التسلسلي لـ NMOS، مع مدخلات مزدوجة `va` / `vb` و `vout` قبل كتابة LaTeX |
| `cmos-nor2` | `cmos-nor2-v1` | يتحقق من تفعيل الرفع التسلسلي لـ PMOS والخفض الموازي لـ NMOS، مع مدخلات مزدوجة `va` / `vb` و `vout` قبل كتابة LaTeX |
هذا ليس مولد TikZ عامًا بعد. إنه لا يقوم بتجميع LaTeX، ولا يستدعي TikZJax، ولا يفحص اللقطات، ولا ينفّذ إصلاحات تصحيح الصور التلقائية. تظل تلك الميزات في مراحل لاحقة.
هذا الأداة ليست مولدًا عامًا للرسومات باستخدام TikZ. فهي لا تقبل كود TikZ تعسفيًا، ولا تقوم بتجميع ملفات LaTeX، ولا تستدعي أداة TikZJax، ولا تفحص لقطات الشاشة أثناء وقت تشغيل الإضافة، ولا تنفذ عمليات إصلاح تلقائية للصور. تظل هذه الميزات جزءًا من مراحل لاحقة في العملية.
يمكن لأمر الرسم التخطيطي المسبق أن يعيد فتح ملفات المصدر circuitikz المحفوظة مباشرةً عندما يكون امتداد الملف `.tex` أو `.tikz` ويحتوي المصدر على `\usepackage{circuitikz}` أو `\begin{circuitikz}`. هذا الطريق هو عرض مسبق للمصدر فقط circuitikz: يعرض النافذة المنبثقة المصدر والتشخيصات وأدوات النسخ/الحفظ وبيانات التاريخ، لكنه لا يقوم بتجميع LaTeX أو يستدعي TikZJax أثناء تشغيل الإضافة.
@ -350,8 +360,8 @@ npm run diagram:smoke-circuitikz -- --output-dir docs/export/circuitikz-smoke --
|------|----------------|-----------|
| الرسومات العامة | تم تنفيذ خط أنابيب يعتمد على المواصفات أولاً لـ Mermaid، JSON Canvas، Vega-Lite، HTML | استمر في توسيع نطاق التحقق الدلالي |
| الرسومات القابلة للتعديل | تم تنفيذ حدود الكائنات `editable-html-svg`، Draw.io XML، و Drawnix JSON | أضف عناصر أولية أكثر ثراءً فقط بعد أن تثبت الاختبارات إمكانية التعديل |
| دعم CLI | يقوم `npm run diagram:export-artifact` بتصدير HTML/SVG، Draw.io، و Drawnix القابلة للتعديل من عقدة `DiagramSpec` واحدة | أضف أجهزة دخان مخصصة للأهداف عند شحن الأهداف الجديدة |
| circuitikz | `CircuitSpec -> circuitikz` يصدر النموذج الأولي قوالب ذهبية للمصادر المشتركة ومعكوسات CMOS، `cmos-buffer` / `cmos-buffer-v1`، `cmos-transmission-gate` / `cmos-transmission-gate-v1`، `cmos-nand2` / `cmos-nand2-v1`، و `cmos-nor2` / `cmos-nor2-v1`، بالإضافة إلى مشاريع `layoutHints.inputSide` و `layoutHints.outputSide` لتحديد مواقع مداخل/مخارج محددة دون تغيير التوبولوجيا، ويرفض تغيرات التوبولوجيا أثناء الإصلاح عبر `--topology-reference`، ويصدر تقارير إصلاح تحافظ على التوبولوجيا عبر `--repair-brief-output` والمخطط `notemd.circuitikz.repair-brief.v1`، ويتضمن محتوى نقل منظم `repairPrompt` مع `diagnosticFocus` و `acceptanceCriteria` والدور `topology-preserving-circuitikz-repair`، ويُصحّح المرشحات المحتملة للإصلاح عبر `--repair-brief`، ويُرجع أدلة البوابات عبر المخطط `notemd.circuitikz.repair-acceptance.v1` مع `readyForVisualAcceptance` و `remainingChecks`، ويحتفظ بهذه الأدلة عبر `--repair-acceptance-output`، ويقوم بتحليل سجلات التجميع، ويمكنه تشغيل مُعالجات محلية صريحة بالإضافة إلى `--expected-artifact` و SVG `--expected-svg-text`، ويقوم بفحوصات بيانات الوصولية عبر `aria-label` و `<title>` و `<desc>`، ويستبعد العناصر المخفية/الشفافة SVG، ويقوم بتصنيف `render-svg-text-path-only` / `pathOnlyGlyphUseCount` للعلامات التي تحتوي فقط على مسار، وفحوصات وضع الرموز التي تحتوي فقط على مسار لـ `<use href="#...">`، وتشخيص تداخل الرموز التي تحتوي فقط على مسار عبر `render-svg-path-glyph-overlap`، ومعالجة نقطة التيار للمسارات المغلقة لـ `Z/z`، وحدود دائرية دقيقة لأقصى قيم الدوائر من نوع A/a، وحدود منحنيات Bezier دقيقة لأقصى قيم المنحنيات من نوع C/S/Q/T، وفحوصات حدود SVG المدركة لعرض الخط وتداخل العلامات، وفحوصات هندسية للرسم `polyline` / `polygon`، وهندسة العلامات الموضوعة في مواقع محددة، وهندسة النصوص الموضوعة المدركة لـ `text-anchor`، وهندسة مدركة للتحويلات لحالات SVG المحدودة بالرسم/تداخل النصوص وفحوصات الدخان بين العلامات والرسومات عبر `render-svg-label-overlap`، بالإضافة إلى فحوصات للصور الملتقطة بتنسيق PNG غير فارغة/مقطوعة/ذات خلفية كثيفة، وتشمل ألفا للألوان المُرقّمة، وعينات شفافة بالأبيض والأسود/RGB tRNS، وإرشادات محددة حسب التنسيق `render-png-unsupported` لصور PNG المتداخلة Adam7 وأخطاء عمق البت المُرقّم، عبر `foregroundBounds` و `foregroundDensity` و `render-png-content-clipped` و `render-png-foreground-dense` دون الحاجة إلى تحليل الشلل، ويتضمن أدوات اختبار شاملة للمُعالجين عبر `npm run diagram:smoke-circuitikz`، ويسجل إعدادات المُعالجات المفقودة عبر `rendererAvailability.status: "missing-configuration"` و `compile-executable-invalid`، ويحتوي على تشخيصات معاينة عامة، وأرقام ملخص التشخيصات، وسجلات تاريخية مدركة للتشخيصات، وخيارات بديلة تعتمد فقط على المصدر عبر `RenderArtifact.diagnostics` ونافذة المعاينة. | إضافة تعرف على العلامات على مستوى OCR للنصوص المرئية التي تحتوي فقط على مسارات، وفحوصات دقيقة للتداخل على مستوى البكسل، وتغطية أوسع للمسارات SVG حسب الحاجة، وتثبيت/اكتشاف برنامج التصدير تلقائيًا فقط إذا كان يمكن الاحتفاظ به كخيار اختياري، بالإضافة إلى تنفيذ إصلاحات تلقائية تحافظ على التركيب الهيكلي. |
| دعم CLI | يقوم الأمر `npm run diagram:export-artifact` بتصدير ملفات HTML/SVG قابلة للتعديل، بالإضافة إلى أدلة مراجعة من صيغ Draw.io و Drawnix و Circuitikz و SVG/PNG/PDF، وذلك انطلاقًا من ملف `DiagramSpec` مُصدَّق | يتم إضافة اختبارات أساسية مخصصة لكل هدف عند إصدار أهداف جديدة |
| circuitikz | `DiagramSpec(intent: "circuit", circuitSpec) -> CircuitikzRenderer -> circuitikz` يقوم بتصدير قوالب ذهبية للدوائر مثل common-source و CMOS inverter و `cmos-buffer` / `cmos-buffer-v1` و `cmos-transmission-gate` / `cmos-transmission-gate-v1` و `cmos-nand2` / `cmos-nand2-v1` و `cmos-nor2` / `cmos-nor2-v1`، كما يكشف عن خيارات نية الواجهة والهدف المراد عرضه، ويكتب ملفات TeX مع ملفات معاينة من صيغ SVG/PNG/PDF، ويقوم بالتحقق من التركيب الهيكلي قبل إنتاج المخرجات، ويقوم بتحليل سجلات التجميع، ويمكنه تشغيل محررات محلية محددة مع استخدام الخيار `--expected-artifact`، بالإضافة إلى الاحتفاظ بخيار الاسترجاع القائم فقط على المصدر وعرض تشخيصات المعاينة عبر `RenderArtifact.diagnostics` ونافذة المعاينة | إضافة قدرة على التعرف على العلامات على مستوى OCR للنصوص البصرية التي تحتوي فقط على مسارات، وإجراء فحوصات دقيقة للتداخل على مستوى البكسل، وتوسيع نطاق تغطية مسارات SVG حسب الحاجة، وتنفيذ تثبيت أو اكتشاف المحررات تلقائيًا فقط إذا كان ذلك ممكنًا كخيار اختياري، بالإضافة إلى تنفيذ عمليات إصلاح تلقائية للحفاظ على التركيب الهيكلي |
| تكامل TikZJax | المضيف المقترح لعرض Obsidian-side | اجعلها اختيارية؛ لا تجعل TikZJax متطلبًا إلزاميًا أثناء تشغيل الإضافة. |
## التكوين
@ -361,6 +371,7 @@ npm run diagram:smoke-circuitikz -- --output-dir docs/export/circuitikz-smoke --
| `enableExperimentalDiagramPipeline` | `false` | التبديل بين النمط القائم على المواصفات والنمط التقليدي Mermaid |
| `experimentalDiagramCompatibilityMode` | `'legacy-mermaid'` | `'legacy-mermaid'` = Mermaid فقط؛ `'best-fit'` = الأهداف الأصلية + خيارات الاحتياط |
| `preferredDiagramIntent` | `undefined` (تلقائي) | تجاوز الكشف التلقائي عن النية |
| `preferredDiagramRenderTarget` | `undefined` (تلقائي) | تعديل محرك توليد الملفات، بما في ذلك Draw.io و Drawnix و Circuitikz |
| `summarizeToMermaidLanguage` | `'en'` | اللغة المستهدفة لتسميات الرسوم التخطيطية |
| `summarizeToMermaidProvider` / `Model` | DeepSeek | LLM لكل مهمة لإنشاء الرسوم التخطيطية |
| `autoMermaidFixAfterGenerate` | (من الثوابت) | تشغيل أداة إصلاح الإصدارات القديمة تلقائيًا على نتيجة Mermaid |
@ -380,10 +391,11 @@ npm run diagram:smoke-circuitikz -- --output-dir docs/export/circuitikz-smoke --
| الإجراء | الطريقة |
|--------|--------|
| تصدير SVG | مولد `mermaid.render()` / `vega.View.toSVG()` / SVG للوحة الرسم |
| تصدير بصيغة PNG | SVG → صورة → وحة رسم (نسبة بكسلات الجهاز من 1x إلى 3x) → مصفوفة ArrayBuffer PNG |
| تصدير إلى PNG | SVG → صورة → Canvas / محول راسم النقاط للعرض عند دقة النقاط المحددة → مصفوفة بيانات PNG |
| تصدير إلى PDF | SVG → صورة راسمة عند دقة النقاط المحددة → ملف PDF صف واحد |
| حفظ المصدر | يتم حفظ محتوى القطعة الخام مع امتداد محدد للهدف |
| عرض مسبق للمصدر فقط | القطع غير المدمجة التي تحتوي على محتوى المصدر تُعرض ككود مع تشخيصات، دون عرضها داخل إطار iframe |
| تدقيق دلالي | Mermaid، JSON Canvas، Vega-Lite، و HTML/SVG القابل للتعديل تم التحقق منه بواسطة `scripts/diagram-semantic-verification.js` |
| التدقيق الدلالي | يتم فحص Mermaid و JSON Canvas و Vega-Lite و HTML/SVG القابلة للتعديل و Draw.io و Drawnix و circuitikz المقيد بواسطة `scripts/diagram-semantic-verification.js` بالإضافة إلى اختبارات المحرك والواجهة السطرية |
**التخزين المؤقت**: يستخدم RenderCache مفتاح JSON محددًا لـ `{spec, target, theme}`. يمنع الإزالة المتزامنة إعادة توليد الرسومات المكررة.

File diff suppressed because one or more lines are too long

View file

@ -1,7 +1,7 @@
---
id: diagrams
title: "Diagramy"
description: "Vytváří Mermaid, JSON Canvas, Vega-Lite, HTML, upravitelné grafické artefakty a budoucí omezené circuitikz diagramy z vašich poznámek pomocí architektury založené na specifikaci"
description: "Vytváří diagramy typu Mermaid, JSON Canvas, Vega-Lite, HTML, upravitelné soubory s obrázky, Draw.io, Drawnix a omezené diagramy circuitikz z vašich poznámek pomocí architektury založené na specifikacích."
author:
'@id': 'https://jacobinwwey.github.io/obsidian-NotEMD/#person-jacobinwwey'
keywords: [diagrams, mermaid, vega-lite, canvas, visualization, spec-first, drawio, drawnix, editable svg, circuitikz, TikZJax]
@ -18,7 +18,7 @@ import TLDR from '@site/src/components/TLDR';
# Diagramy
<TLDR>
**Notemd vytváří diagramy z vašich poznámek prostřednictvím pipeline založeného na specifikaci.** LLM vytváří renderer-nezávislý `DiagramSpec` JSON, poté specializované adaptéry jej převádějí na Mermaid, JSON Canvas, Vega-Lite, HTML nebo upravitelný výstup HTML/SVG. Podporuje 8 typů záměrů, automatické řetězce náhrad, živou náhledovou funkci s exportem do SVG/PNG, sémantickou ověřovací funkci a generování rozšířené o místní znalosti.
**Notemd vytváří diagramy z vašich poznámek prostřednictvím procesu založeného na specifikacích.** LLM vytvoří JSON soubor `DiagramSpec`, který je nezávislý na konkrétním rendereru, a následně specializované adaptéry jej převedou na formáty Mermaid, JSON Canvas, Vega-Lite, HTML, upravitelný HTML/SVG, Draw.io, Drawnix nebo omezené diagramy circuitikz. Podporuje 9 typů záměrů, automatické záložní řetězce, živou náhledovou verzi s možností exportu do SVG/PNG/PDF, semantickou kontrolu a generování vylepšené o místní znalosti.
</TLDR>
Toto je součástí [Obsidian Průvodce AI pro správu znalostí](/docs/pillar-ai-knowledge).
@ -54,6 +54,7 @@ graph LR
| `stateDiagram` | Mermaid | HTML | Stroje stavů, modely životního cyklu |
| `canvasMap` | JSON Canvas | Mermaid → HTML | Konceptuální mapy, znalostní grafy |
| `dataChart` | Vega-Lite | Mermaid → HTML | Sloupcové, čarové, plošné, rozptylové, kruhové, tabulkové grafy |
| `circuit` | circuitikz | none | Omezené diagramy obvodů z ověřených datových balíčků `CircuitSpec` |
## Detekce záměru
@ -67,6 +68,7 @@ Notemd odhadne nejlepší typ diagramu na základě obsahu vaší poznámky pomo
| `stateDiagram` | Stav, přechod, čekající, běžící, selhalo (3+ shody) | 0.76 |
| `flowchart` | Číslované kroky (2+) nebo slovník if/then/else/workflow | 0.74 |
| `canvasMap` | Konceptuální mapa, graf znalostí, prostorový, shluk | 0.72 |
| `circuit` | circuitikz, TikZJax, circuit, schematic, CMOS, NMOS, PMOS, MOSFET, VDD/GND, `vin`/`vout` | 0.78 |
| `mindmap` | Výchozí náhradní režim | 0.55 |
Přepsat pomocí nastavení **Preferovaný typ diagramu**, výběru v postranním panelu nebo explicitní volby z palety příkazů.
@ -80,10 +82,9 @@ Experimentální pipeline založený na specifikacích nyní má dva nezávislé
| Preferovaný typ diagramu | `preferredDiagramIntent` | Určuje sémantickou formu generovaného `DiagramSpec` |
| Preferovaný cíl renderování | `preferredDiagramRenderTarget` | Vybírá renderer artefaktu pro **Vytvořit diagram** a **Náhled diagramu** |
Nastavte **Preferovaný cíl renderování** na **Auto** jako výchozí hodnotu pro plánovač, nebo zvolte explicitně Mermaid, JSON Canvas, Vega-Lite, HTML nebo Editable HTML/SVG. Toto přepsání se vztahuje pouze na příkazy týkající se artefaktů a náhledů. Standardní příkaz **Shrnutí do diagramu Mermaid** zůstává vázán na výstup kompatibilní s Mermaid, aby stávající pracovní postupy s Markdownem nezměnily formát bez upozornění.
Toto oddělení je důležité, protože záměr `flowchart` může být nyní renderován jako Mermaid pro poznámky v Markdownu, jako HTML pro spolehlivou náhradu nebo jako Editable HTML/SVG pro další úpravy. Draw.io a Drawnix zůstávají exportéry artefaktů typu CLI místo renderovacích cílů uvnitř pluginu.
Nastavte **Preferred render target** na **Auto** jako výchozí hodnotu pro plánovač, nebo zvolte výslovně Mermaid, JSON Canvas, Vega-Lite, HTML, Editable HTML/SVG, Draw.io, Drawnix nebo Circuitikz. Tato překrytí platí pouze pro příkazy týkající se souborů a náhledu. Standardní příkaz **Summarise as Mermaid diagram** zůstává vázán na výstup kompatibilní s Mermaid, aby stávající pracovní postupy v Markdownu nezměnily formát bez varování.
Toto oddělení je důležité, protože záměr `flowchart` nyní může být vykreslen jako Mermaid pro poznámky v Markdownu, jako HTML pro spolehlivý záložní formát, jako upravitelný HTML/SVG pro další úpravy, nebo jako zdrojové soubory Draw.io/Drawnix doplněné o soubory SVG určené k revizi. Záměr `circuit` směřuje k nástroji Circuitikz a vyžaduje ověřený soubor `CircuitSpec`; nejedná se o požadavek na libovolný text v formátu TikZ.
## Použití
### Vytvořit diagram
@ -101,16 +102,21 @@ Toto oddělení je důležité, protože záměr `flowchart` může být nyní r
| Vega-Lite | `.json` | `{note}_diagram.json` |
| HTML | `.html` | `{note}_diagram.html` |
| Upravitelné HTML/SVG | `.html` | `{note}_diagram.html` |
| Draw.io | `.drawio` + `.drawio.svg` + `.drawio.md` | `{note}_diagram.drawio` spolu s doplňkovými soubory určenými k revizi |
| Drawnix | `.drawnix` + `.drawnix.svg` + `.drawnix.md` | `{note}_diagram.drawnix` spolu s doplňkovými soubory určenými k revizi |
| Circuitikz | `.tex` + `.tex.svg` + `.tex.md` | `{note}_diagram.tex` spolu s doplňkovými soubory určenými k revizi |
### Náhled diagramu
1. Spustit **"Notemd: Náhled diagramu"**
2. Otevře se modální okno s vykresleným diagramem
3. Exportovat jako SVG nebo PNG pomocí tlačítek na panelu nástrojů
3. Exportujte do formátů SVG, PNG nebo PDF pomocí tlačítek na panelu nástrojů.
**Automatické otevření náhledu** je k dispozici v nastaveních — po generování se modální okno s náhledem spustí automaticky.
Modální okno s náhledem má také panel diagnostiky artefaktů. Renderery a kontrolní testy mohou přidat `RenderArtifact.diagnostics`; okno zobrazuje souhrnnou zprávu s počty chyb/warning/info, poté závažnost, typ diagnostiky, zprávu a doporučení k opravě vedle náhledu. Stejný souhrn se zobrazuje v záznamech historie náhledů, takže lze porovnat opakované pokusy circuitikz bez otevírání každého záznamu. U artefaktů, které mají zdrojový obsah, ale nemohou být vykresleny inline nebo prostřednictvím cesty HTML iframe, se nyní modální okno přepne na náhled pouze ze zdroje místo nutnosti prázdného iframe. To umožňuje circuitikz kontrolu kompilace/vykreslování, SVG kontroly textových tokenů, kontroly prázdných snímků PNG a budoucí zprávy o překrytech s viditelným UI povrchem, aniž by se TikZJax nebo LaTeX staly povinnou závislostí během provozu pluginu nebo se předstíralo, že zdrojový text je ověřené vizuální vykreslení.
Při exportu náhledu ve formátech PNG a PDF se použije nakonfigurované rozlišení PPI. Výchozí hodnota je 300 PPI a hodnoty vyšší než 600 PPI jsou omezeny na 600. SVG zůstává ve vektorové velikosti. Zdrojové soubory jako `.drawio`, `.drawnix` a `.tex` mohou poskytnout doplňkový soubor `previewSvg`, aby Obsidian mohl zobrazovat a exportovat obrázky určené k revizi bez nutnosti vkládání obsahu z diagram.net, Drawnix, LaTeX nebo TikZJax během provozu pluginu.
Modálka náhledu také obsahuje panel diagnostiky artefaktů. Renderery a kontrolní testy mohou přidat hodnotu `RenderArtifact.diagnostics`; modálka poté zobrazí souhrn diagnostických údajů včetně počtu chyb, varování a informací, následovaně stupně závažnosti, typu diagnostiky, zprávy a doporučení k nápravě vedle samotného náhledu. Stejný souhrn se zobrazuje také v záznamech historie podporujících diagnostiku, takže lze porovnávat opakované pokusy o spuštění kontrol circuitikz bez nutnosti otevírat každý jednotlivý záznam. U artefaktů, které mají zdrojový obsah, ale nemohou být zobrazeny inline nebo prostřednictvím cesty HTML iframe, nyní modálka místo nutnosti použít prázdný iframe přechází na náhled pouze ze zdrojového kódu. To umožňuje kontrolám jako je kompilace a renderování circuitikz, kontroly textových tokenů v SVG, kontroly prázdných snímků obrazovky v PNG, hlášení o překryvu glyfů pouze na základě cesty a budoucí hlášení o překryvech mít viditelné uživatelské rozhraní, aniž by bylo nutné záviset na TikZJax nebo LaTeX jako na hardwarové pluginové runtime součásti, nebo předstírat, že zdrojový text je již ověřený vizuální výstup.
### Režim staré verze Mermaid
@ -164,12 +170,12 @@ Tento cíl záměrně zatím není výchozí trasou plánovače. Je k dispozici
### Draw.io a Drawnix Hranice exportu
Současná implementace udržuje podporu třetích stran v rámci hranic artefaktu:
Současná implementace udržuje podporu třetích stran v rámci hranic artefaktu, přičemž zároveň poskytuje explicitní cíle pro renderování:
| Cíl | Smlouva | Závislost na běhu |
|--------|----------|--------------------|
| Draw.io | deterministický nekomprimovaný `mxfile` XML z `SemanticFigureModel` | žádné v běhu pluginu ani v CI |
| Drawnix | minimální podmnožina `.drawnix` JSON pomocí prvků `geometry` a `arrow-line` | žádné v běhu pluginu ani v CI |
| Draw.io | deterministický nekomprimovaný XML soubor typu `mxfile` pocházející z `SemanticFigureModel`, spolu se soubory SVG/PNG/PDF určenými k revizi | v běhu pluginu ani v CI nic takového |
| Drawnix | minimální podmnožina JSON souboru `.drawnix` využívající prvky `geometry` a `arrow-line`, spolu se soubory SVG/PNG/PDF určenými k revizi | v běhu pluginu ani v CI nic takového |
Tato kompromisní volba je záměrná: Notemd může ověřit viditelné nápisy, stabilní ID a podporovanou pokrytí primitivů, aniž by do pluginu začlenil diagram.net Desktop, Drawnix, Plait nebo stav editoru určený pouze pro prohlížeč.
@ -213,7 +219,11 @@ Notemd nyní zahrnuje první omezený prototyp repozitáře pro tuto směr. Je z
npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-inverter.tex
```
Prototyp přidává samostatnou hranici `CircuitSpec` a deterministického exportéra pro šest rodin zlatých referencí:
Prototyp přidává omezenou hranici typu `CircuitSpec` a deterministický exportér pro šest základních rodin referenčních schémat:
V experimentálním pipeline pro diagramy lze k tomuto cíli nyní také přistupovat pomocí parametru `intent: "circuit"` a cíle renderování `circuitikz`. Vytvořený soubor typu `DiagramSpec` může obsahovat element `circuitSpec` pouze v případě záměru vytvořit schéma typu circuit. Nástroj `CircuitikzRenderer` vytváří stejný deterministický zdrojový soubor ve formátu `.tex` a připojuje k němu soubor SVG určený k náhledu, který vznikl na základě ověřené topologie obvodu, čímž umožňuje náhled v Obsidianu a export do formátů SVG/PNG/PDF. Tento doplňkový soubor není výsledkem kompilace v LaTeXu/TikZJax; skutečné důkazy o renderování pocházejí stále z níže uvedených explicitních testovacích příkazů.
U podporovaných šablon typu golden zůstávají proměnné `layoutHints.inputSide` a `layoutHints.outputSide` pouze kontrolami určenými k prezentaci. Mohou posunout umístění deterministických vstupních/výstupních portů, ale nemění podpis topologie ani neumožňují opravný proces pro přepojení obvodu.
| Druh obvodu | Zlatá referenční hodnota | Záruka proudu |
|--------------|------------------|-------------------|
@ -224,7 +234,7 @@ Prototyp přidává samostatnou hranici `CircuitSpec` a deterministického expor
| `cmos-nand2` | `cmos-nand2-v1` | ověřuje paralelní PMOS pull-up, sériový NMOS pull-down, dvojí vstupy `va` / `vb` a `vout` před zápisem do LaTeXu |
| `cmos-nor2` | `cmos-nor2-v1` | ověřuje sériový PMOS pull-up, paralelní NMOS pull-down, dvojí vstupy `va` / `vb` a `vout` před zápisem do LaTeXu |
Toto zatím není obecný generátor TikZ. Nepřekládá LaTeX, nevolá TikZJax, nekontroluje snímky obrazovky ani neprovádí automatickou opravu na základě obrázků. Tyto funkce zůstávají pro pozdější verze.
Toto není obecný generátor pro TikZ. Nepřijímá libovolné kódy v formátu TikZ, nekompiluje LaTeX, nevyvolává TikZJax, nekontroluje snímky obrazovky během běhu pluginu a neprovádí automatické opravy na základě obrázkových zpětných vazeb. Tyto funkce patří k pozdějším fázím procesu.
Příkaz Preview diagram umožňuje přímo znovu otevřít uložené artefakty zdroje circuitikz, pokud je přípona souboru `.tex` nebo `.tikz` a zdroj obsahuje `\usepackage{circuitikz}` nebo `\begin{circuitikz}`. Tato cesta je preview pouze ze zdroje circuitikz: modální okno zobrazuje zdroj, diagnostiku, ovládací prvky pro kopírování/ukládání a metadaty historie, ale nepřekládá LaTeX ani nevolá TikZJax během provozu pluginu.
@ -350,8 +360,8 @@ U CMOS inverze by prompt měl požadovat explicitní topologii spolu s omezením
|------|----------------|-----------|
| Obecné diagramy | Implementován pipeline založený na specifikacích pro Mermaid, JSON Canvas, Vega-Lite, HTML | Pokračujte ve rozšiřování pokrytí sémantické kontroly |
| Upravitelné obrázky | Byly implementovány hranice artefaktů `editable-html-svg`, Draw.io XML a Drawnix JSON | Přidávejte bohatší primitivy až poté, co testy prokážou jejich upravitelnost |
| Podpora CLI | `npm run diagram:export-artifact` exportuje upravitelné HTML/SVG, Draw.io a Drawnix z jednoho `DiagramSpec` | Přidat specifické zařízení pro kouřové testy pro nové cíle při jejich doručení |
| circuitikz | `CircuitSpec -> circuitikz` prototyp exportuje společné zdroje, invertor CMOS, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1` a `cmos-nor2` / `cmos-nor2-v1` zlaté šablony, projekty `layoutHints.inputSide` a `layoutHints.outputSide` do deterministického umístění vstupních/výstupních portů bez změny topologie, odmítá drift topologie opravami prostřednictvím `--topology-reference`, vydává zprávy o opravách zachovávajících topologii prostřednictvím `--repair-brief-output` a schématu `notemd.circuitikz.repair-brief.v1`, zahrnuje strukturovaný obsah předání `repairPrompt` s `diagnosticFocus`, `acceptanceCriteria` a rolí `topology-preserving-circuitikz-repair`, ověřuje kandidáty na opravu prostřednictvím `--repair-brief`, vrací důkazy o bránách prostřednictvím schématu `notemd.circuitikz.repair-acceptance.v1` s `readyForVisualAcceptance` a `remainingChecks`, uchovává tyto důkazy prostřednictvím `--repair-acceptance-output`, analyzuje protokoly kompilace, může spouštět výslovné lokální renderery plus `--expected-artifact`, SVG `--expected-svg-text`, kontroly metadat dostupnosti prostřednictvím `aria-label`, `<title>` a `<desc>`, vyloučení skrytých/průhledných prvků SVG, klasifikace `render-svg-text-path-only` / `pathOnlyGlyphUseCount` pro nápisy pouze na cestách, kontroly umístění glyfů pouze na cestách pro `<use href="#...">`, diagnostika překrytí glyfů pouze na cestách prostřednictvím `render-svg-path-glyph-overlap`, zpracování aktuálního bodu uzavřených cest pro `Z/z`, přesné hranice oblouků pro extrémy oblouků A/a, přesné hranice křivek Bezier pro extrémy křivek C/S/Q/T, kontroly překrytí s ohledem na šířku tahu SVG a nápisů, kontroly geometrie kreslení `polyline` / `polygon`, geometrie umístěných nápisů `tspan`, geometrie textu umístěného s ohledem na `text-anchor`, geometrie s ohledem na transformaci pro SVG ohraničené plátno/překrytí textu a kouřové testy nápisů vs. kresby prostřednictvím `render-svg-label-overlap`, a kontroly snímků obrazovky PNG neprázdných/ostříhaných/hustě vyplněných s pozadím, včetně alfy indexované palety barev, průhledných vzorků v šedé/grafické RGB tRNS a specifických pokynů `render-png-unsupported` pro interleaved PNG Adam7 a selhání indexované hloubky bitů, prostřednictvím `foregroundBounds`, `foregroundDensity`, `render-png-content-clipped` a `render-png-foreground-dense` bez analýzy shellu, zahrnuje agregovaná zařízení pro testy udržovatelů prostřednictvím `npm run diagram:smoke-circuitikz`, zaznamenává chybějící konfiguraci rendereru prostřednictvím `rendererAvailability.status: "missing-configuration"` a `compile-executable-invalid`, a má obecné diagnostické nástroje, souhrnný počet diagnostik, záznamy historie s ohledem na diagnostiku a náhradu pouze ze zdroje prostřednictvím `RenderArtifact.diagnostics` a modálního přehledu | Přidat rozpoznávání nápisů na úrovni OCR pro vizuální text pouze na cestách, přesné kontroly překrytí na úrovni pixelů, širší pokrytí cest SVG tam, kde je to potřeba, automatickou instalaci/nalezení rendereru pouze tehdy, pokud může zůstat volitelné, a automatizované provedení oprav zachovávajících topologii |
| Podpora CLI | Příkaz `npm run diagram:export-artifact` exportuje upravitelné soubory HTML/SVG, Draw.io, Drawnix, Circuitikz a také soubory SVG/PNG/PDF jako důkazy pro revizi z jednoho ověřeného souboru `DiagramSpec` | Při vydání nových cílů přidávají se specifické testovací skripty pro daný cíl |
| circuitikz | `DiagramSpec(intent: "circuit", circuitSpec) -> CircuitikzRenderer -> circuitikz` exportuje zlaté šablony pro obvyklé zdroje, invertory CMOS, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1` a `cmos-nor2` / `cmos-nor2-v1`, zpřístupňuje možnosti účelu UI a cíle renderování, vytváří soubory TeX spolu s náhledy ve formátech SVG/PNG/PDF, ověřuje topologii před výstupem, analyzuje protokoly kompilace, umožňuje spuštění výslovných lokálních rendererů pomocí parametru `--expected-artifact` a zároveň udržuje zálohu pouze se zdrojovým kódem a zobrazuje diagnostiku náhledu prostřednictvím `RenderArtifact.diagnostics` a modálního okna s náhledem | Přidání rozpoznávání štítků na úrovni OCR pro vizuální text obsažený pouze v pathech, přesné kontroly překrytí na úrovni pixelů, širší pokrytí SVG pathů tam, kde je to potřeba, automatická instalace nebo vyhledávání rendererů pouze tehdy, pokud mohou zůstat volitelné, a automatizované provádění oprav s zachováním topologie |
| Integrace TikZJax | Kandidátský host pro renderování na straně Obsidian | Udržet to volitelné; neudělejte z TikZJax povinnou závislost během provozu pluginu |
## Konfigurace
@ -361,6 +371,7 @@ U CMOS inverze by prompt měl požadovat explicitní topologii spolu s omezením
| `enableExperimentalDiagramPipeline` | `false` | Přepínat mezi přístupem zaměřeným na specifikace a starším Mermaid |
| `experimentalDiagramCompatibilityMode` | `'legacy-mermaid'` | `'legacy-mermaid'` = Mermaid pouze; `'best-fit'` = nativní cíle + náhrady |
| `preferredDiagramIntent` | `undefined` (automaticky) | Přepsat automatické detekování záměru |
| `preferredDiagramRenderTarget` | `undefined` (automaticky) | Přepsání renderera artefaktů, včetně Draw.io, Drawnix a Circuitikz |
| `summarizeToMermaidLanguage` | `'en'` | Jazyk cíle pro nápisy diagramů |
| `summarizeToMermaidProvider` / `Model` | DeepSeek | LLM na úrovni úlohy pro generování diagramů |
| `autoMermaidFixAfterGenerate` | (z konstant) | Automaticky spustit starší opravovač na výstupu Mermaid |
@ -380,10 +391,11 @@ Když je aktivováno, Notemd načítá relevantní úryvky kontextu z místní b
| Akce | Metoda |
|--------|--------|
| SVG export | `mermaid.render()` / `vega.View.toSVG()` / SVG builder pro Canvas |
| Export do PNG | SVG → Obraz → Canvas (poměr pixelů zařízení 1x-3x) → PNG ArrayBuffer |
| Export do PNG | SVG → Obrázek → Canvas / predvolený rasterizér při nastaveném PPI → PNG ArrayBuffer |
| Export do PDF | SVG → rastrový obrázek při nastaveném PPI → jednostránkový PDF |
| Uložení zdroje | Obsah surového artefaktu je uložen s koncovou extenzí specifickou pro cíl |
| Náhled pouze zdroje | Nelineární artefakty se zdrojovým obsahem jsou zobrazeny jako kód spolu s diagnostikou, bez renderování iframe |
| Sémantická kontrola | Mermaid, JSON Canvas, Vega-Lite a upravitelný HTML/SVG ověřený `scripts/diagram-semantic-verification.js` |
| Semantická kontrola | Mermaid, JSON Canvas, Vega-Lite, upravitelný HTML/SVG, Draw.io, Drawnix a omezený Circuitikz jsou kontrolovány skriptem `scripts/diagram-semantic-verification.js` spolu s testy renderera a CLI |
**Caching**: RenderCache využívá deterministický klíč JSON od `{spec, target, theme}`. Odstranění duplicit během zpracování zabraňuje opakovanému generování.

View file

@ -1,7 +1,7 @@
---
id: diagrams
title: "Diagrammer"
description: "Generer Mermaid, JSON Canvas, Vega-Lite, HTML, redigerbare figurartefakter og fremtidige begrænsete circuitikz-diagrammer fra dine notater med hjælp af en specifikationsførst architecture"
description: "Generer Mermaid, JSON Canvas, Vega-Lite, HTML, redigerbare figurartefakter, Draw.io, Drawnix og begrænsete circuitikz-diagrammer fra dine notater med en arkitektur, der prioriterer specifikationerne"
author:
'@id': 'https://jacobinwwey.github.io/obsidian-NotEMD/#person-jacobinwwey'
keywords: [diagrams, mermaid, vega-lite, canvas, visualization, spec-first, drawio, drawnix, editable svg, circuitikz, TikZJax]
@ -18,7 +18,7 @@ import TLDR from '@site/src/components/TLDR';
# Diagrammer
<TLDR>
**Notemd genererer diagrammer fra dine notater gennem en spec-first pipeline.** LLM producerer en renderer-agnostic `DiagramSpec` JSON, hvilket derefter oversettes til Mermaid, JSON Canvas, Vega-Lite, HTML, eller editabler HTML/SVG-udgange af hjælp af speciale adaptere. Støder 8 type intentioner, automatiske fallback-kedjer, live-preview med eksport til SVG/PNG, semantisk verifikation og generering forstærket med lokal kunnskab.
**Notemd genererer diagrammer fra dine notater gennem en pipeline, der prioriterer specifikationerne.** LLM-en producerer en renderer-agnostic `DiagramSpec`-JSON-fil, som derefter oversettes til Mermaid, JSON Canvas, Vega-Lite, HTML, redigerbar HTML/SVG, Draw.io, Drawnix eller begrænsete circuitikz-output af speciale adapter. Det støder 9 typiske intentioner, automatiske fallback-kedjer, live-preview med eksport til SVG/PNG/PDF, semantisk verifikation og generering med forstærkning af lokale kunnskaber.
</TLDR>
Dette er en del af [Obsidian AI Knowledge Management Guide](/docs/pillar-ai-knowledge).
@ -54,6 +54,7 @@ graph LR
| `stateDiagram` | Mermaid | HTML | Stammaskiner, livscykelmodeller |
| `canvasMap` | JSON Canvas | Mermaid → HTML | Konseptkort, kunnskapsgrupper |
| `dataChart` | Vega-Lite | Mermaid → HTML | Stikker, linjer, arealer, sprølle, pizza, tabeller |
| `circuit` | circuitikz | ingen | Begrænsete circuit-diagrammer fra validerede `CircuitSpec`-data |
## Intent Detection
@ -67,6 +68,7 @@ Notemd inferer den beste diagramtypen fra din beskeds innhold ved bruk av nøkke
| `stateDiagram` | Sted, overgang, i venting, i gang, feil (3+ matcher) | 0.76 |
| `flowchart` | Nummererte trinn (2+) eller if/then/else/workflow-vokabular | 0.74 |
| `canvasMap` | Konceptkort, kunnskapsgraph, rumlig, kluster | 0.72 |
| `circuit` | circuitikz, TikZJax, circuit, schematic, CMOS, NMOS, PMOS, MOSFET, VDD/GND, `vin`/`vout` | 0.78 |
| `mindmap` | Standardtilbakefall | 0.55 |
Øverstille med **Favoritdiagramtyp**-innstillingen, sidemenuvalgretet eller en eksplisitt kommandovalgmulighet.
@ -80,10 +82,9 @@ Den eksperimentelle spec-first-pipeline-en har nå to uavhengige kontroller:
| Favoritdiagramtyp | `preferredDiagramIntent` | Styrer den semantiske formen for den genererte `DiagramSpec` |
| Favoritrenderingsmål | `preferredDiagramRenderTarget` | Vælger artefaktrendereren for **Generer diagram** og **Vis diagram** |
Still **Favoritrenderingsmål** på **Auto** som standard for planeraren, eller velg eksplisitt Mermaid, JSON Canvas, Vega-Lite, HTML eller Editable HTML/SVG. Øverstillingen gäller kun for artefakt- og visningskommandoen. Standardkommandot **Sammanfatt som Mermaid diagram** forblir bundet til Mermaid-kompatible utdata så at eksisterende Markdown-arbeidsfluer ikke stillestillt endrer format.
Dette skilnaden er viktig fordi en `flowchart`-intent kan nå renderes som Mermaid for Markdown-notater, HTML som robust tilbakefall, eller Editable HTML/SVG for videre redigering. Draw.io og Drawnix forblir CLI-artefaktexportere fremfor i-plugin-renderingsmål.
Stil **Preferred render target** til **Auto** for planlæggers standardvalg, eller vælg eksplisit Mermaid, JSON Canvas, Vega-Lite, HTML, Editable HTML/SVG, Draw.io, Drawnix eller Circuitikz. Denne override gælder kun kommandoen for artefakter og preview. Standardkommandot **Summarise as Mermaid diagram** forbliver fastsat til Mermaid-sykker output, så eksisterende Markdown-arbejdsmetoder ikke stillelt skifter format.
Dette afskillelse er vigtigt, fordi en `flowchart`-intention nu kan genereres som Mermaid for Markdown-notater, som HTML som robust fallback, som redigerbar HTML/SVG til videre editing, eller som Draw.io/Drawnix-kildeartefakter med SVG-review-filer. En `circuit`-intention dirigeres til Circuitikz og kræver en valideret `CircuitSpec`; det er ikke en anmodning om vilkårlig TikZ-text.
## Brug
### Generer et diagram
@ -101,16 +102,21 @@ Dette skilnaden er viktig fordi en `flowchart`-intent kan nå renderes som Merma
| Vega-Lite | `.json` | `{note}_diagram.json` |
| HTML | `.html` | `{note}_diagram.html` |
| Redigerbar HTML/SVG | `.html` | `{note}_diagram.html` |
| Draw.io | `.drawio` + `.drawio.svg` + `.drawio.md` | `{note}_diagram.drawio` sammen med review-filer |
| Drawnix | `.drawnix` + `.drawnix.svg` + `.drawnix.md` | `{note}_diagram.drawnix` sammen med review-filer |
| Circuitikz | `.tex` + `.tex.svg` + `.tex.md` | `{note}_diagram.tex` sammen med review-filer |
### Vis prøveversion af diagrammet
1. Kør **"Notemd: Vis prøveversion af diagrammet"**
2. En modal opnes med det renderede diagram
3. Eksportér som SVG eller PNG med hjælp af knapperne på værktøjslinjen
3. Ekspor til SVG, PNG eller PDF med hjælp af knapene på værktøjsbaren
**Automatisk åbning af prøveversion** er tilgængeligt i indstillingerne — efter generering starter prøveversionsmodalen automatisk.
Prøveversionsmodalen har også en panel for diagnostic af artefakter. Renderere og smoke-checks kan tilføje `RenderArtifact.diagnostics`; modalen viser en sammanfattelse af diagnosticer med antal fejl/varninger/informationer, derefter alvorlighed, typ for diagnostic, melding og reparationstilbud ved siden af prøveversionen. Samme sammanfattelse vises i prøveversionshistorikken, så man kan sammenlægge gennemførte circuitikz smoke-prøver uden at åbne hver enkelt post. For artefakter med kildetekst men som ikke kan renderes inline eller gennem HTML iframe-paden, falder modalen nu tilbage til en prøveversion kun med kildetekst istedet for at tvinge en tom iframe. Dette giver circuitikz kompilérings-/renderings-smoke-prøver, SVG tekst-token-checker, PNG-blank-skrænshot-checker og fremtidige overlappesrapporter en synlig UI ydegrind uden at gøre TikZJax eller LaTeX til en hardt plugin-runtime-afhængighed eller simuleere, at kildeteksten er en verificeret visuel rendering.
Ekspor af preview i PNG og PDF bruger den konfigurerede preview PPI. Standardværdien er 300 PPI, og værdier over 600 PPI begrenses til 600. SVG forbliver vektorbaseret. Kildeartefakter som `.drawio`, `.drawnix` og `.tex` kan provide en `previewSvg`-fil, så Obsidian kan vise og eksportere billeder til review, uden at embede diagram.net, Drawnix, LaTeX eller TikZJax i pluginets kørsel.
Vedvirkningsmodalen har desuden en panel for diagnostic af artefakter. Renderere og smoke-tests kan tilføje `RenderArtifact.diagnostics`; modalen viser en sammanfattelse af diagnostikker med antal fejl/varninger/informationer, samt derefter graviteten, typen af diagnostik, meldingen og reparationstilbud ved siden af vedvirkningen. Sama sammanfattelse vises i historieposte, der understøtter diagnostik, så man kan sammenlægge flere forsøg på circuitikz-smoke-tests uden at åbne hver enkelt post. For artefakter, der har kildemateriale men ikke kan vedvirkes indlægt eller gennem HTML-iframe-paden, vender modalen nu til en vedvirkning kun med kildematerialet istedet for at påtvinge en tom iframe. Dette giver circuitikz-compilering/vedvirkning-smoke-tests, SVG-text-token-checker, PNG-blank-skrænshot-checker, rapporter om overlapp af glypher kun baseret på path, samt fremtidige overlapp-rapporter en synlig brugergrænsen, uden at gøre TikZJax eller LaTeX til en nødvendig plugin-runtime-afhængighet eller at simulere, at kildetekst er en verificeret visuel vedvirkning.
### LegACY Mermaid-modus
@ -164,12 +170,12 @@ Dette mål er med vilje ikke den standardmæssige planlægningsroute endnu. Det
### Draw.io og Drawnix Eksportgrænser
Den nuværende implementering holder støtte fra tredjepartsredaktorer ved artefaktgrænsen:
Den nuværende implementeringen holder stødet for tredjeparts-redigeringsverktyg på grænsen til artefaktet, mens den stadig exponerer eksplisite renderingsmål:
| Mål | Kontrakt | Kørtidsafhængighed |
|--------|----------|--------------------|
| Draw.io | deterministisk ukomprimeret `mxfile` XML fra `SemanticFigureModel` | ingen i plugin-kørning eller CI |
| Drawnix | minimal `.drawnix` JSON undermengde med brug af `geometry` og `arrow-line` elementer | ingen i plugin-kørning eller CI |
| Draw.io | deterministisk, ukomprimeret `mxfile`-XML fra `SemanticFigureModel`, plus SVG/PNG/PDF-granskningsfiler | ingen i pluginets kørsel eller CI |
| Drawnix | et minimalt JSON-undermengde af `.drawnix` med elementer som `geometry` og `arrow-line`, plus SVG/PNG/PDF-granskningsfiler | ingen i pluginets kørsel eller CI |
Kompromissen er medveten: Notemd kan verificere synlige labeler, stabile ID'er og støttet primitivoverskydning uden at embede diagrams.net Desktop, Drawnix, Plait eller browser-eksklusive redaktorstat i pluginen.
@ -213,7 +219,11 @@ Notemd inkluderer nu den første begrænsete repository-prototyp for denne retni
npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-inverter.tex
```
Prototypen tilføjer en separat `CircuitSpec`-grænse og en deterministisk eksporter for sex guldreferensfamilier:
Prototypen tilfører en begrænset `CircuitSpec`-grænse samt en deterministisk eksporter for sex guldstandard-familier:
I den eksperimentelle diagramm-pipeline er dette nu også tilgængeligt gennem `intent: "circuit"` og renderingsmål `circuitikz`. Den genererede `DiagramSpec` kan kun embede `circuitSpec` for circuit-intent. `CircuitikzRenderer` skriver samme deterministiske `.tex`-kilde og tilføjer en SVG-forhandsvisning, der er afledt fra den validerede krets-topologi, hvilket muliggør forhandsvisning i Obsidian samt eksport til SVG/PNG/PDF. Denne forhandsvisning er ikke et resultat af en LaTeX/TikZJax-kompilering; den virkelige rendererbevislig information findes stadig i de eksplisite smoke-commander nedenfor.
For de understøttede guldstandard-mallene bliver `layoutHints.inputSide` og `layoutHints.outputSide` kun kontroller til præsentation. De kan flytte den deterministiske placering af ind-/udgangsporten, men de ændrer ikke topologiens signatur eller tillader en reparationsgang for at omkabele kretsen.
| Kretsart | Guldreferens | Strømgaranti |
|--------------|------------------|-------------------|
@ -224,7 +234,7 @@ Prototypen tilføjer en separat `CircuitSpec`-grænse og en deterministisk ekspo
| `cmos-nand2` | `cmos-nand2-v1` | Validerer parallell PMOS pull-up, seriell NMOS pull-down, dobbel indgange `va` / `vb`, og `vout` før skrivning af LaTeX |
| `cmos-nor2` | `cmos-nor2-v1` | Validerer seriell PMOS pull-up, parallell NMOS pull-down, dobbel indgange `va` / `vb`, og `vout` før skrivning af LaTeX |
Dette er endnu ikke en generel TikZ-generator. Den kompilerer ikke LaTeX, kaller ikke TikZJax, undersøger ikke skærmbilder, eller udfører automatisk image-feedback-reparation. Disse funktionaliteter kommer senere.
Dette er ikke en generel TikZ-generator. Den accepterer ikke vilkårlig TikZ-kode, kompilere LaTeX, kalle på TikZJax, undersøge skærmbilder i pluginets kørsel, eller udføre automatiseret reparationsprocess for billeder. Disse funktioner er fortsat planlagt til senere trin.
Kommandoen Preview diagram kan åbne gemte circuitikz-kildeartefakter direkte, når filendelsen er `.tex` eller `.tikz` og kilden indeholder `\usepackage{circuitikz}` eller `\begin{circuitikz}`. Dette er en circuitikz-kilde-eksklusiv preview: modalen viser kilden, diagnostik, kopier/søj-kontroller og historie-metadater, men den kompilerer ikke LaTeX eller kaller ikke TikZJax under plugins kørsel.
@ -350,8 +360,8 @@ For en CMOS inverter skal prompten forespørgse en eksplisit topology plus layou
|------|----------------|-----------|
| Almene diagrammer | Spec-first pipeline implementeret for Mermaid, JSON Canvas, Vega-Lite, HTML | Hold kontinuerlig udvidelse af semantisk verifikationsomfattelse |
| Redigerbare figurer | `editable-html-svg`, Draw.io XML, og Drawnix JSON artefaktgrænser implementeret | Tilføj mere komplekse primitive kun efter at tester har beviset redigerbarhed |
| CLI støtte | `npm run diagram:export-artifact` eksporterer redigerbare HTML/SVG, Draw.io, og Drawnix fra én `DiagramSpec` | Læg til mål-specifikke røkmonturer når nye mål leveres |
| circuitikz | `CircuitSpec -> circuitikz` prototypen eksporterer common-source, CMOS inverter, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1`, og `cmos-nor2` / `cmos-nor2-v1` guldtempler, projekter `layoutHints.inputSide` og `layoutHints.outputSide` til deterministisk ind-/udgangsportplacering uden at ændre topologien, afviser reparationstopologidrift gennem `--topology-reference`, udgiver topologiforbevarende reparationsoplysninger gennem `--repair-brief-output` og schema `notemd.circuitikz.repair-brief.v1`, inkluderer struktureret `repairPrompt` overføringsindhold med `diagnosticFocus`, `acceptanceCriteria`, og rolle `topology-preserving-circuitikz-repair`, validerer reparationskandidater gennem `--repair-brief`, returnerer `repairAcceptance` gatebevis gennem schema `notemd.circuitikz.repair-acceptance.v1` med `readyForVisualAcceptance` og `remainingChecks`, gemmer disse bevis gennem `--repair-acceptance-output`, parserer kompilationslogger, kan køre eksplisite lokale renderere plus `--expected-artifact`, SVG `--expected-svg-text`, kontroller af tilgængelighedsmetadater gennem `aria-label`, `<title>`, og `<desc>`, udskud/transparente SVG elementudslukking, `render-svg-text-path-only` / `pathOnlyGlyphUseCount` klassificering for path-only labeler, kontroller af path-only glyph placering for `<use href="#...">`, diagnostik af path-only glyph overlapp gennem `render-svg-path-glyph-overlap`, hantering af close-path current-point for `Z/z`, præcise bøgergrænser for A/a bøgers ekstrema, præcise Bezier kurvegrænser for C/S/Q/T kurves ekstrema, SVG grænser med bevidsthed om strejkbredde og kontroller af label overlapp, `polyline` / `polygon` kontroller af tegningsgeometri, positioneret `tspan` labelgeometri, `text-anchor`-bevidst positioneret tekstgeometri, geometri med bevidsthed om transform for SVG bounded-canvas/text-overlap og label-vs-tegningsrøk gennem `render-svg-label-overlap`, samt PNG nonblank / clipped / dense-foreground skærmbildrøkmæssige kontroller, inkluderende indexed-color palette alpha, grayscale/RGB tRNS transparente eksempler, og format-specifikke `render-png-unsupported` vejledning for Adam7 interlaced PNGs og indexed bit-depth fejl, gennem `foregroundBounds`, `foregroundDensity`, `render-png-content-clipped`, og `render-png-foreground-dense` uden shell parsing, inkluderer samlede vedligeholders røkmonturer gennem `npm run diagram:smoke-circuitikz`, registrerer manglende rendererkonfiguration gennem `rendererAvailability.status: "missing-configuration"` og `compile-executable-invalid`, samt har generiske preview-diagnostik, diagnostisk sammanfattelse af antal, diagnostik-bevidste historieposte, og source-only fallback gennem `RenderArtifact.diagnostics` og preview-modalen | Læg til OCR-niveau labelgenkendelse for path-only visuel tekst, præcise pixel-niveau overlappskontroller, bredere SVG path-overskydelse hvor det er nødvendigt, automatisk installering/udvikling af renderer kun hvis det kan blive valgfrit, og automatiseret topologiforbevarende reparationsudførelse |
| CLI-støtte | `npm run diagram:export-artifact` eksporterer redigerbare HTML/SVG-, Draw.io-, Drawnix-, Circuitikz- og SVG/PNG/PDF-filer som bevis for granskning fra en valideret `DiagramSpec` | Tilføj målspesifikke smoke fixtures når nye mål lanceres |
| circuitikz | `DiagramSpec(intent: "circuit", circuitSpec) -> CircuitikzRenderer -> circuitikz` eksporterer guldtempler for common-source, CMOS inverter, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1` og `cmos-nor2` / `cmos-nor2-v1`, viser UI-intent og render-target-valgmuligheder, skriver TeX sammen med SVG/PNG/PDF-forhandsvisningsfiler, validerer topologien før udskrift, parserer kompilationslogger, kan køre eksplisite lokale renderer samt `--expected-artifact`, og holder tilbage en fallback med kun kilden samt forhandsvisningsdiagnostik synlig gennem `RenderArtifact.diagnostics` og forhandsvisningsmodalen | Tilføj OCR-niveau labelgenkendelse for visuel tekst, der kun består af pather, præcise pixelnivå-overlappingskontroller, bredere SVG-path-overskydning hvor det er nødvendigt, automatisk installering/udvikling af renderer kun hvis det kan blive valgfrit, samt automatiseret reparationsudførelse for at bevare topologien |
| TikZJax integration | Kandidatrenderingsværksted for Obsidian-side visning | Lad det være valgfrit; gør ikke TikZJax til en hard plugin runtime afhængighed |
## Konfiguration
@ -361,6 +371,7 @@ For en CMOS inverter skal prompten forespørgse en eksplisit topology plus layou
| `enableExperimentalDiagramPipeline` | `false` | Vendel mellem spec-first og legacy Mermaid |
| `experimentalDiagramCompatibilityMode` | `'legacy-mermaid'` | `'legacy-mermaid'` = Mermaid kun; `'best-fit'` = nativ mål + fallbacks |
| `preferredDiagramIntent` | `undefined` (auto) | Overrask automatisk intent detection |
| `preferredDiagramRenderTarget` | `undefined` (auto) | Overskrive artefaktrendereren, herunder Draw.io, Drawnix og Circuitikz |
| `summarizeToMermaidLanguage` | `'en'` | Målsspråk for diagramlabeler |
| `summarizeToMermaidProvider` / `Model` | DeepSeek | Per-opgave LLM for diagramgenerering |
| `autoMermaidFixAfterGenerate` | (fra konstanter) | Kør automatisk legacy fixer på Mermaid output |
@ -380,10 +391,11 @@ Når det er aktiveret, henter Notemd relevante kontekstudsnit fra vaultens lokal
| Aktion | Metode |
|--------|--------|
| SVG export | `mermaid.render()` / `vega.View.toSVG()` / SVG builder for Canvas |
| PNG-eksport | SVG → Image → Canvas (device pixel ratio 1x-3x) → PNG ArrayBuffer |
| Ekspor til PNG | SVG → Bild → Canvas / preview-rasteriseringsverktyg ved konfigureret PPI → PNG ArrayBuffer |
| Ekspor til PDF | SVG → rasterbild ved konfigureret PPI → enkeltsides PDF |
| Sparing af kilde | Rå artefaktindhold gemmes med extension, specifik for målet |
| Forskyvning kun af kilden | Ikke-inline artefakter med kildematerial vises som kod samt diagnosticer, uden iframe-rendering |
| Semantisk audit | Mermaid, JSON Canvas, Vega-Lite, og editabel HTML/SVG kontrolleret af `scripts/diagram-semantic-verification.js` |
| Semantisk audit | Mermaid, JSON Canvas, Vega-Lite, redigerbar HTML/SVG, Draw.io, Drawnix og begrænset Circuitikz kontrolleres af `scripts/diagram-semantic-verification.js` samt renderer/CLI-tester |
**Caching**: RenderCache bruger en deterministisk JSON-klæde fra `{spec, target, theme}`. Afvikling under bearbejdelse forhindrer dupliske renderinger.

View file

@ -1,7 +1,7 @@
---
id: diagrams
title: Diagramme
description: Erstellen Sie aus Ihren Notizen mithilfe einer architekturorientierten Vorgehensweise, die zuerst die Spezifikationen definiert, Mermaid, JSON Canvas, Vega-Lite, HTML editierbare Diagrammdateien sowie zukünftig eingeschränkte circuitikz-Diagramme.
description: "Erstellen Sie mithilfe einer architekturorientierten Herangehensweise, die zuerst die Spezifikationen berücksichtigt, Diagramme im Stil von Mermaid, JSON Canvas, Vega-Lite, HTML, editierbaren Diagrammdateien, Draw.io, Drawnix sowie eingeschränkten circuitikz-Diagrammen aus Ihren Notizen."
author:
'@id': 'https://jacobinwwey.github.io/obsidian-NotEMD/#person-jacobinwwey'
keywords: [diagrams, mermaid, vega-lite, canvas, visualization, spec-first, drawio, drawnix, editable svg, circuitikz, TikZJax]
@ -18,7 +18,7 @@ import TLDR from '@site/src/components/TLDR';
# Diagramme
<TLDR>
**Notemd erzeugt Diagramme aus Ihren Notizen mithilfe eines auf Spezifikationen basierenden Workflows.** Der LLM erstellt ein renderer-unabhängiges `DiagramSpec` JSON, wobei spezielle Adapter es anschließend in Mermaid, JSON Canvas, Vega-Lite, HTML oder in bearbeitbare HTML/SVG-Ausgaben umwandeln. Es werden 8 Intent-Typen unterstützt, automatische Fallback-Ketten, eine Live-Voransicht mit Export in SVG/PNG, semantische Überprüfung sowie eine durch lokales Wissen erweiterte Generierung.
**Notemd erzeugt Diagramme aus Ihren Notizen über einen auf Spezifikationen basierenden Workflow.** Das LLM erstellt ein renderer-unabhängiges `DiagramSpec`-JSON, wobei spezielle Adapter dieses dann in Mermaid, JSON Canvas, Vega-Lite, HTML, editierbare HTML/SVG-, Draw.io-, Drawnix- oder eingeschränkte circuitikz-Ausgaben umwandeln. Es werden 9 verschiedene Intentionstypen unterstützt, es gibt automatische Fallback-Mechanismen, eine Live-Voransicht mit Export in SVG/PNG/PDF, semantische Überprüfung sowie eine Erstellung unter Verwendung lokaler Informationen.
</TLDR>
Dies ist ein Teil des [Obsidian AI-Know-how-Management-Leitfadens](/docs/pillar-ai-knowledge).
@ -54,6 +54,7 @@ graph LR
| `stateDiagram` | Mermaid | HTML | Zustandsmaschinen, Lebenszyklusmodelle |
| `canvasMap` | JSON Canvas | Mermaid → HTML | Konzeptkarten, Wissensgraphen |
| `dataChart` | Vega-Lite | Mermaid → HTML | Stäbe, Linien, Flächen, Punkte, Kreise, Tabellen |
| `circuit` | circuitikz | none | Eingeschränkte circuitikz-Diagramme aus validierten `CircuitSpec`-Daten |
## Intenterkennung
@ -67,6 +68,7 @@ Notemd ermittelt den besten Diagrammtyp anhand des Inhalts Ihrer Notiz mithilfe
| `stateDiagram` | Status, Übergang, ausstehend, laufend, fehlgeschlagen (3+ Treffer) | 0.76 |
| `flowchart` | Nummerierte Schritte (2+) oder If/Then/Else/Workflow-Vokabular | 0.74 |
| `canvasMap` | Konzeptkarte, Wissensgraph, räumlich, Cluster | 0.72 |
| `circuit` | circuitikz, TikZJax, circuit, schematic, CMOS, NMOS, PMOS, MOSFET, VDD/GND, `vin`/`vout` | 0.78 |
| `mindmap` | Standard-Fallback | 0.55 |
Überschreiben Sie dies mit der Einstellung „Vorzugiger Diagrammtyp“, dem Seitenleisten-Selektor oder einer expliziten Option in der Befehlspalette.
@ -75,15 +77,9 @@ Notemd ermittelt den besten Diagrammtyp anhand des Inhalts Ihrer Notiz mithilfe
Der experimentelle spez-zuerst-Pipeline verfügt nun über zwei unabhängige Steuerungen:
| Steuerung | Einstellungen | Effekt |
|---------|---------|--------|
| Vorgezogener Diagrammtyp | `preferredDiagramIntent` | Leitet die semantische Struktur des generierten `DiagramSpec` an |
| Vorgezogenes Renderziel | `preferredDiagramRenderTarget` | Wählt den Artefaktrenderer für „Diagramm erstellen“ und „Diagramm ansehen“ aus |
Setzen Sie den Wert von **Preferred render target** auf **Auto** als Standard für den Planer, oder wählen Sie ausdrücklich Mermaid, JSON Canvas, Vega-Lite, HTML oder Editable HTML/SVG. Die Übernahme gilt nur für die Befehle „Artifact“ und „Preview“. Der standardmäßige Befehl **Summarise as Mermaid diagram** bleibt auf eine mit Mermaid kompatible Ausgabe festgelegt, damit bestehende Markdown-Arbeitsabläufe nicht stillschweigend das Format wechseln.
Diese Trennung ist wichtig, denn eine `flowchart`-Intent kann nun als Mermaid für Markdown-Zeitnotizen, als HTML für einen zuverlässigen Ersatz oder als editierbare HTML/SVG für spätere Bearbeitungen dargestellt werden. Draw.io und Drawnix bleiben weiterhin Exporteure von CLI-Artefakten statt Render-Ziele innerhalb des Plugins.
Setzen Sie den **Preferred render target** auf **Auto**, um den Standardwert für den Planer zu verwenden, oder wählen Sie explizit Mermaid, JSON Canvas, Vega-Lite, HTML, Editable HTML/SVG, Draw.io, Drawnix oder Circuitikz aus. Diese Änderung gilt nur für die Befehle zur Erstellung von Artefakten und zur Voransicht. Der Standardbefehl **Summarise as Mermaid diagram** bleibt auf eine mermaid-kompatible Ausgabe festgelegt, damit bestehende Markdown-Arbeitsabläufe nicht stillschweigend das Format wechseln.
Diese Trennung ist wichtig, da eine `flowchart`-Intention nun als Mermaid für Markdown-Notizen, als HTML als zuverlässiger Fallback, als Editable HTML/SVG zur weiteren Bearbeitung oder als Draw.io/Drawnix-Quelldateien zusammen mit SVG-Dateien zur Überprüfung dargestellt werden kann. Eine `circuit`-Intention leitet auf Circuitikz um und erfordert eine validierte `CircuitSpec`; es handelt sich dabei nicht um eine Anfrage nach beliebigem TikZ-Text.
## Verwendung
### Erstelle ein Diagramm
@ -101,16 +97,21 @@ Diese Trennung ist wichtig, denn eine `flowchart`-Intent kann nun als Mermaid f
| Vega-Lite | `.json` | `{note}_diagram.json` |
| HTML | `.html` | `{note}_diagram.html` |
| Bearbeitbarer HTML/SVG | `.html` | `{note}_diagram.html` |
| Draw.io | `.drawio` + `.drawio.svg` + `.drawio.md` | `{note}_diagram.drawio` zusammen mit den dazugehörigen Überprüfungsdateien |
| Drawnix | `.drawnix` + `.drawnix.svg` + `.drawnix.md` | `{note}_diagram.drawnix` zusammen mit den dazugehörigen Überprüfungsdateien |
| Circuitikz | `.tex` + `.tex.svg` + `.tex.md` | `{note}_diagram.tex` zusammen mit den dazugehörigen Überprüfungsdateien |
### Voransicht eines Diagramms
1. Führen Sie **„Notemd: Vorschau des Diagramms“** aus.
2. Ein Modalfeld öffnet sich mit dem dargestellten Diagramm
3. Exportieren als SVG oder PNG mit den Schaltflächen der Werkzeugleiste
3. Exportieren Sie die Datei als SVG, PNG oder PDF über die Schaltflächen in der Leiste.
Die Funktion „Voransicht automatisch öffnen“ ist in den Einstellungen verfügbar nach der Erstellung wird das Voransichtsfenster automatisch geöffnet.
Das Vorschau-Modul verfügt außerdem über ein Diagnosepanel für Artefakte. Renderer und Smoke-Checks können `RenderArtifact.diagnostics` hinzufügen; das Modul zeigt eine Diagnosesumme mit Zählungen von Fehlern, Warnungen und Informationen an, gefolgt von Schweregrad, Diagnosetyp, Nachricht und Reparaturhinweisen neben der Vorschau. Dieselbe Summe wird auch in den Einträgen der Vorschauhistorie angezeigt, sodass wiederholte circuitikz Smoke-Tests ohne Öffnen jedes Eintrags verglichen werden können. Für Artefakte, die Quelltext enthalten, aber nicht inline oder über den HTML-IFrame-Pfad dargestellt werden können, wechselt das Modul nun auf eine reinen-Quelltext-Vorschau anstelle eines leeren IFrames. Dadurch erhalten circuitikz-Kompilier-/Render-Smoke-Tests, SVG-Text-Token-Prüfungen, PNG-Leer-Screenshot-Prüfungen sowie zukünftige Überschneidungsberichte eine sichtbare UI-Oberfläche, ohne dass TikZJax oder LaTeX zu einer festen Laufzeitabhängigkeit des Plugins werden oder der Quelltext als verifizierte visuelle Darstellung ausgegeben wird.
Beim Export der Voransicht in PNG und PDF wird die konfigurierte Voransichts-PPI verwendet. Der Standardwert beträgt 300 PPI, wobei Werte über 600 PPI auf 600 begrenzt werden. SVG bleibt in seiner vektorbasierten Größe erhalten. Quelldateien wie `.drawio`, `.drawnix` und `.tex` können eine `previewSvg`-Datei bereitstellen, damit Obsidian überprüfbare Bilder anzeigen und exportieren kann, ohne Diagram.net, Drawnix, LaTeX oder TikZJax im Laufzeitumfeld des Plugins einzubetten.
Das Vorschau-Modul verfügt außerdem über ein Diagnose-Panel für Artefakte. Renderer sowie Smoke-Checks können `RenderArtifact.diagnostics` hinzufügen; das Modul zeigt eine Zusammenfassung der Diagnosen mit Zählungen für Fehler, Warnungen und Informationen an, gefolgt von der Schweregradangabe, der Art der Diagnose, der Meldung sowie Ratschlägen zur Behebung direkt neben der Vorschau. Diese gleiche Zusammenfassung wird auch in den diagnostikfähigen Historie-Einträgen angezeigt, sodass wiederholte circuitikz-Smoke-Tests miteinander verglichen werden können, ohne jeden Eintrag einzeln öffnen zu müssen. Für Artefakte, die Quelltext enthalten, aber weder inline noch über den HTML-Iframe-Pfad renderbar sind, wechselt das Modul nun auf eine reinen-Quelltext-Vorschau, anstatt einen leeren Iframe zu erzwingen. Dadurch erhalten circuitikz-Kompilierungs-/Render-Smoke-Tests, SVG-Text-Token-Prüfungen, PNG-Leer-Screenshot-Prüfungen, Berichte über Glyphen-Überlappungen basierend nur auf Pfaden sowie zukünftige Überlappungsberichte eine sichtbare Benutzeroberfläche ohne dass TikZJax oder LaTeX zu einer strikten Laufzeitabhängigkeit des Plugins werden müssen oder der Quelltext als bereits verifizierte visuelle Darstellung behandelt wird.
### Legacy Mermaid Modus
@ -164,12 +165,12 @@ Dieses Ziel ist absichtlich noch nicht die Standard-Planer-Route. Es steht als e
### Draw.io und Drawnix Exportgrenzen
Die aktuelle Implementierung behält die Unterstützung für Drittanbieter-Editor am Artefaktgrenzenbereich bei:
Die aktuelle Implementierung behält die Unterstützung für Drittanbieter-Editor am Rand des Artefakts bei, während dennoch explizite Render-Ziele bereitgestellt werden:
| Ziel | Vertrag | Laufzeitabhängigkeit |
|--------|----------|--------------------|
| Draw.io | deterministisch, unkomprimiert `mxfile` XML von `SemanticFigureModel` | Keines im Plugin-Laufzeitumfeld oder in CI |
| Drawnix | Minimaler `.drawnix` JSON-Untermenge mit Elementen `geometry` und `arrow-line` | Keines im Plugin-Laufzeitumfeld oder in CI |
| Draw.io | deterministische, unkomprimierte `mxfile`-XML-Dateien aus dem `SemanticFigureModel`, ergänzt durch SVG/PNG/PDF-Dateien zur Überprüfung | Keine Funktionen im Plugin-Laufzeitumfeld oder in CI |
| Drawnix | ein minimales JSON-Untermenge von `.drawnix`, das die Elemente `geometry` und `arrow-line` verwendet, ergänzt durch SVG/PNG/PDF-Dateien zur Überprüfung | Keine Funktionen im Plugin-Laufzeitumfeld oder in CI |
Der Kompromiss ist bewusst gewählt: Notemd kann sichtbare Etiketten, stabile IDs sowie unterstützte primitive Abdeckungsarten überprüfen, ohne Diagram.net Desktop, Drawnix, Plait oder den ausschließlich im Browser verfügbaren Editorzustand in den Plugin einzubinden.
@ -213,7 +214,11 @@ Notemd enthält nun das erste eingeschränkte Repository-Prototyp für diese Ric
npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-inverter.tex
```
Das Prototyp fügt eine separate `CircuitSpec`-Grenze sowie einen deterministischen Exporteur für sechs Familien mit goldenen Referenzen hinzu:
Das Prototyp-Modul fügt eine eingeschränkte Grenze nach `CircuitSpec` sowie einen deterministischen Exporteur für sechs Standardreferenzfamilien hinzu:
Im experimentellen Diagramm-Pipeline-System ist dies nun auch über `intent: "circuit"` sowie das Render-Ziel `circuitikz` erreichbar. Die generierte `DiagramSpec`-Datei darf `circuitSpec` nur für den Circuit-Zweck enthalten. Der `CircuitikzRenderer` schreibt dieselbe deterministische `.tex`-Quelle und fügt eine SVG-Voransicht hinzu, die aus der validierten Schaltkreistopologie abgeleitet wird; dadurch wird eine Voransicht in Obsidian sowie eine Exportmöglichkeit in SVG/PNG/PDF ermöglicht. Die Voransicht stellt kein Ergebnis einer LaTeX/TikZJax-Kompilierung dar; tatsächliche Render-Ergebnisse stammen weiterhin von den unten aufgeführten expliziten Smoke-Commands.
Für unterstützte Standardvorlagen bleiben `layoutHints.inputSide` und `layoutHints.outputSide` ausschließlich Steuerelemente für die Darstellung. Sie können die Platzierung der deterministischen Eingangs-/Ausgangsports verschieben, ändern jedoch nicht die Topologiesignatur und erlauben keinen Reparaturvorgang zur Umverkabelung des Schaltkreises.
| Art des Schaltkreises | Goldene Referenz | Aktuelle Garantie |
|--------------|------------------|-------------------|
@ -224,7 +229,7 @@ Das Prototyp fügt eine separate `CircuitSpec`-Grenze sowie einen deterministisc
| `cmos-nand2` | `cmos-nand2-v1` | Überprüft vor dem Schreiben in LaTeX den parallelen PMOS-Pull-up, den seriellen NMOS-Pull-down, die doppelten Eingänge `va` / `vb` sowie `vout` |
| `cmos-nor2` | `cmos-nor2-v1` | Überprüft die Serie PMOS-Pull-Up, parallele NMOS-Pull-Down, doppelte Eingänge `va` / `vb` sowie `vout` vor dem Schreiben von LaTeX |
Dies ist noch kein allgemeiner TikZ-Generator. Er kompiliert keinen LaTeX, ruft TikZJax nicht auf, inspiziert keine Screenshots und führt keine automatisierte Reparatur von Bildfeedback durch. Das sind noch zukünftige Schritte.
Dies ist kein allgemeiner TikZ-Generator. Er akzeptiert keine beliebigen TikZ-Dateien, kompiliert keinen LaTeX, ruft keinen TikZJax auf, inspiziert keine Screenshots im Plugin-Laufzeitumfeld und führt keine automatisierten Reparaturvorgänge auf Basis von Bildfeedback durch. Solche Funktionen sind weiterhin für spätere Phasen vorgesehen.
Der Befehl „Preview Diagramm“ kann gespeicherte circuitikz Quelldateien direkt wieder öffnen, wenn die Dateierweiterung `.tex` oder `.tikz` ist und der Quellcode `\usepackage{circuitikz}` oder `\begin{circuitikz}` enthält. Dieser Weg ist eine circuitikz rein-Quellen-Voransicht: Das Modalfenster zeigt den Quellcode, Diagnosen, Kontrollen zum Kopieren/Speichern sowie Metadaten zur Historie an, kompiliert aber keinen LaTeX und ruft auch nicht TikZJax während der Laufzeit des Plugins auf.
@ -350,8 +355,8 @@ Für einen CMOS-Inverter sollte die Anfrage eine explizite Topologie sowie Layou
|------|----------------|-----------|
| Allgemeine Diagramme | Pipeline mit Fokus auf Spezifikationen implementiert für Mermaid, JSON Canvas, Vega-Lite, HTML | Setzen Sie die Erweiterung der Abdeckung der semantischen Überprüfung fort. |
| Bearbeitbare Abbildungen | `editable-html-svg`, Draw.io XML sowie Drawnix JSON Artefaktgrenzen implementiert | Fügen Sie reichhaltigere Primitiven nur hinzu, nachdem Tests die Bearbeitbarkeit nachgewiesen haben. |
| CLI Unterstützung | `npm run diagram:export-artifact` exportiert bearbeitbare HTML/SVG-, Draw.io- und Drawnix-Dateien aus einem `DiagramSpec` | Fügen Sie ziel spezifische Rauchanlagen hinzu, wenn neue Ziele ausgeliefert werden |
| circuitikz | `CircuitSpec -> circuitikz` exportiert Prototypen mit gemeinsamer Quelle, CMOS-Invertern, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1` sowie `cmos-nor2` / `cmos-nor2-v1` als Goldenvorlagen, projiziert `layoutHints.inputSide` und `layoutHints.outputSide` in eine deterministische Platzierung der Eingangs-/Ausgangsports ohne Änderung der Topologie, verhindert durch `--topology-reference` eine Veränderung der Reparaturtopologie, gibt durch `--repair-brief-output` sowie das Schema `notemd.circuitikz.repair-brief.v1` topologierelevante Reparaturanleitungen aus, enthält strukturierte `repairPrompt`-Übergabedaten mit `diagnosticFocus`, `acceptanceCriteria` und der Rolle `topology-preserving-circuitikz-repair`, validiert Reparaturkandidaten über `--repair-brief`, liefert durch das Schema `notemd.circuitikz.repair-acceptance.v1` zusammen mit `readyForVisualAcceptance` und `remainingChecks` Beweise für Tore, speichert diese Beweise über `--repair-acceptance-output`, analysiert Kompilierungsprotokolle, kann explizite lokale Renderer sowie `--expected-artifact`, SVG `--expected-svg-text` verwenden, prüft durch `aria-label`, `<title>` und `<desc>` Barrierefreiheitsmetadaten, erlaubt die Ausklammerung von versteckten/transparenten SVG-Elementen, führt eine Klassifizierung nach `render-svg-text-path-only` / `pathOnlyGlyphUseCount` für ausschließlich Pfad-basierte Beschriftungen durch, überprüft die Platzierung von ausschließlich Pfad-basierten Glyphen für `<use href="#...">`, diagnostiziert Überlappungen solcher Glyphen über `render-svg-path-glyph-overlap`, handhabt den aktuellen Punkt bei geschlossenen Pfaden für `Z/z`, gibt genaue Grenzen für A/a-Arkenspitzen an, liefert genaue Grenzen für Bezier-Kurvenspitzen der Typen C/S/Q/T, prüft berücksichtigungsfähige Strichstärken sowie Beschriftungsüberlappungen, überprüft die Zeichnungsgeometrie nach `polyline` / `polygon`, verwendet positionierte `tspan`-Beschriftungsgeometrien, berücksichtigt `text-anchor` bei positioniertem Text, verwendet transformierbare Geometrien für SVG-Fälle mit begrenztem Canvas/Textüberlappungen sowie zur Überprüfung von Beschriftungen gegenüber Zeichnungen über `render-svg-label-overlap`, sowie Prüfungen für PNG-Bilder ohne Leereintrag/abgeschnitten/hoher Hintergrund, einschließlich Alpha-Werten einer indexierten Farbpalette, transparenten Graustufen-/RGB-Beispielen sowie formatbezogener `render-png-unsupported`-Anleitungen für verschachtelte Adam7-PNGs und Fehler bei der Indexierung der Bittiefe, über `foregroundBounds`, `foregroundDensity`, `render-png-content-clipped` und `render-png-foreground-dense` ohne Shell-Parsing, enthält aggregierte Wartungsprüfungen über `npm run diagram:smoke-circuitikz`, protokolliert fehlende Rendererkonfigurationen über `rendererAvailability.status: "missing-configuration"` und `compile-executable-invalid`, verfügt außerdem über allgemeine Vorschau-Diagnosen, Zählungen zu Diagnosesen zusammenfassend, diagnostikorientierte Historieeinträge sowie einen Fallback nur aus der Quelle über `RenderArtifact.diagnostics` und das Vorschau-Modul | Fügen Sie eine OCR-basierte Erkennung von Beschriftungen für rein visuellen Text auf Pfaden hinzu, präzise Überlappungsprüfungen auf Pixelebene, eine erweiterte SVG-Pfadabdeckung dort, wo sie benötigt wird, eine automatische Installation/Entdeckung des Renderers nur dann, wenn dies weiterhin optional bleiben kann, sowie eine automatisierte Ausführung von Reparaturvorgängen unter Beibehaltung der Topologie. |
| CLI-Unterstützung | `npm run diagram:export-artifact` exportiert bearbeitbare HTML/SVG-, Draw.io-, Drawnix-, Circuitikz-Dateien sowie SVG/PNG/PDF-Dateien als Nachweise für die Überprüfung aus einer validierten `DiagramSpec` | Beim Veröffentlichen neuer Ziele werden zielbezogene Smoke-Fixtures hinzugefügt |
| circuitikz | `DiagramSpec(intent: "circuit", circuitSpec) -> CircuitikzRenderer -> circuitikz` exportiert Standard-Quellpläne, CMOS-Inverter, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1` sowie `cmos-nor2` / `cmos-nor2-v1` als Gold-Template-Dateien, stellt UI-Intent- und Render-Ziel-Einstellungen bereit, erstellt TeX-Dateien zusammen mit SVG/PNG/PDF-Voransichten, prüft die Topologie vor der Ausgabe, analysiert Kompilierungsprotokolle, kann explizite lokale Renderer verwenden sowie den Parameter `--expected-artifact` anwenden und bietet außerdem einen fallback auf reinen Quellcode sowie Diagnosen zu den Voransichten über `RenderArtifact.diagnostics` und das Voransichts-Modul an | Hinzufügen einer OCR-basierten Erkennung von Beschriftungen für rein visuellen Text auf Pfaden, präziser Überlappungsprüfungen auf Pixelebene, erweiterter Abdeckung von SVG-Pfaden bei Bedarf, automatischer Installation/Entdeckung von Renderern nur dann, wenn diese weiterhin optional bleiben können, sowie automatisierter Ausführung von Reparaturvorgängen zur Erhaltung der Topologie |
| TikZJax Integration | Kandidat für den Render-Host zur Anzeige auf der Obsidian-Seite | Lassen Sie es optional machen Sie TikZJax nicht zu einer zwingenden Laufzeitabhängigkeit des Plugins. |
## Konfiguration
@ -361,6 +366,7 @@ Für einen CMOS-Inverter sollte die Anfrage eine explizite Topologie sowie Layou
| `enableExperimentalDiagramPipeline` | `false` | Wechseln zwischen Spezifikationsvorzeichen und Legacy-Modus Mermaid |
| `experimentalDiagramCompatibilityMode` | `'legacy-mermaid'` | `'legacy-mermaid'` = Mermaid nur; `'best-fit'` = native Ziele + Fallbacks |
| `preferredDiagramIntent` | `undefined` (automatisch) | Automatische Intent-Erkennung überschreiben |
| `preferredDiagramRenderTarget` | `undefined` (automatisch) | Überschreiben des Artefaktrenderers, einschließlich Draw.io, Drawnix und Circuitikz |
| `summarizeToMermaidLanguage` | `'en'` | Zielsprache für Diagrammbeschriftungen |
| `summarizeToMermaidProvider` / `Model` | DeepSeek | Pro Aufgabe LLM zur Erstellung von Diagrammen |
| `autoMermaidFixAfterGenerate` | (von Konstanten) | Automatischer Ausführung des Legacy-Fixers auf der Ausgabe von Mermaid |
@ -380,10 +386,11 @@ Wenn es aktiviert ist, holt Notemd relevante Kontextausschnitte aus der lokalen
| Aktion | Methode |
|--------|--------|
| SVG exportieren | `mermaid.render()` / `vega.View.toSVG()` / SVG Builder für Canvas |
| PNG-Export | SVG → Bild → Leinwand (Geräte-Pixel-Verhältnis 1x-3x) → PNG ArrayBuffer |
| PNG-Export | SVG → Bild → Canvas / Rasterisierer bei der konfigurierten PPI → PNG-ArrayBuffer |
| PDF-Export | SVG → Rasterbild bei der konfigurierten PPI → einseitiges PDF |
| Quelle speichern | Inhalt des Rohartefakts wurde mit der für das Ziel spezifischen Erweiterung gespeichert |
| Voransicht nur aus Quelle | Nicht-in-line Artefakte mit als Code angezeigtem Quellinhalt sowie Diagnosen, ohne iframe-Rendering |
| Semantische Prüfung | Mermaid, JSON Canvas, Vega-Lite sowie das bearbeitbare HTML/SVG werden von `scripts/diagram-semantic-verification.js` überprüft |
| Semantische Überprüfung | Mermaid, JSON Canvas, Vega-Lite, editierbares HTML/SVG, Draw.io, Drawnix sowie eingeschränkter Circuitikz werden von `scripts/diagram-semantic-verification.js` sowie Renderer-/CLI-Tests überprüft |
**Caching**: RenderCache verwendet den deterministischen JSON-Schlüssel von `{spec, target, theme}`. Die Deduplizierung während der Verarbeitung verhindert doppelte Darstellungen.

File diff suppressed because one or more lines are too long

View file

@ -1,7 +1,7 @@
---
id: diagrams
title: Diagramas
description: Genere Mermaid, JSON Canvas, Vega-Lite, HTML, artefactos de figuras editables, y diagramas circuitikz futuros con restricciones a partir de sus notas utilizando una arquitectura basada en especificaciones.
description: "Genera diagramas Mermaid, JSON Canvas, Vega-Lite, HTML, artefactos de figuras editables, Draw.io, Drawnix y diagramas circuitikz restringidos a partir de tus notas mediante una arquitectura basada en especificaciones primero"
author:
'@id': 'https://jacobinwwey.github.io/obsidian-NotEMD/#person-jacobinwwey'
keywords: [diagrams, mermaid, vega-lite, canvas, visualization, spec-first, drawio, drawnix, editable svg, circuitikz, TikZJax]
@ -18,7 +18,7 @@ import TLDR from '@site/src/components/TLDR';
# Diagramas
<TLDR>
**Notemd genera diagramas a partir de tus notas mediante un proceso basado en especificaciones primero.** El LLM crea un `DiagramSpec` JSON independiente del renderizador, y luego adaptadores especializados lo convierten en formato Mermaid, JSON Canvas, Vega-Lite, HTML, o en salida editable en formato HTML/SVG. Soporta 8 tipos de intención, cadenas de fallback automáticas, vista previa en tiempo real con exportación a SVG/PNG, verificación semántica y generación mejorada con conocimiento local.
**Notemd genera diagramas a partir de tus notas a través de un proceso basado en especificaciones primero.** El LLM produce un JSON `DiagramSpec` independiente del renderizador, y luego adaptadores especializados lo convierten en salida en formato Mermaid, JSON Canvas, Vega-Lite, HTML, HTML/SVG editables, Draw.io, Drawnix o circuitikz restringido. Soporta 9 tipos de intención, cadenas de fallback automáticas, vista previa en tiempo real con exportación a SVG/PNG/PDF, verificación semántica y generación mejorada con conocimiento local.
</TLDR>
Esto forma parte de la [Obsidian Guía de Gestión del Conocimiento de IA](/docs/pillar-ai-knowledge).
@ -54,6 +54,7 @@ graph LR
| `stateDiagram` | Mermaid | HTML | Máquinas de estado, modelos de ciclo de vida |
| `canvasMap` | JSON Canvas | Mermaid → HTML | Mapas conceptuales, grafos de conocimiento |
| `dataChart` | Vega-Lite | Mermaid → HTML | Barra, línea, área, dispersión, circular, tablas |
| `circuit` | circuitikz | none | Diagramas circuiticos restringidos a partir de cargas de datos `CircuitSpec` validadas |
## Detección de intención
@ -67,6 +68,7 @@ Notemd infiere el mejor tipo de diagrama a partir del contenido de tu nota utili
| `stateDiagram` | Estado, transición, pendiente, en ejecución, fallido (3+ coincidencias) | 0.76 |
| `flowchart` | Pasos numerados (2+) o vocabulario de if/then/else/flujo de trabajo | 0.74 |
| `canvasMap` | Mapa conceptual, grafo de conocimiento, espacial, clúster | 0.72 |
| `circuit` | circuitikz, TikZJax, circuit, schematic, CMOS, NMOS, PMOS, MOSFET, VDD/GND, `vin`/`vout` | 0.78 |
| `mindmap` | Solución de respaldo por defecto | 0.55 |
Sobrescribir con la configuración **Tipo de diagrama preferido**, el selector de barra lateral o una opción explícita de la paleta de comandos.
@ -75,15 +77,9 @@ Sobrescribir con la configuración **Tipo de diagrama preferido**, el selector d
El pipeline experimental basado en especificaciones ahora cuenta con dos controles independientes:
| Control | Configuración | Efecto |
|---------|---------|--------|
| Tipo de diagrama preferido | `preferredDiagramIntent` | Guía la forma semántica del `DiagramSpec` generado |
| Objetivo de renderizado preferido | `preferredDiagramRenderTarget` | Elige el renderizador de artefactos para **Generar diagrama** y **Vista previa del diagrama** |
Establezca **Preferred render target** en **Auto** como valor predeterminado para el planificador, o elija explícitamente Mermaid, JSON Canvas, Vega-Lite, HTML, o Editable HTML/SVG. La sobrescritura solo se aplica a los comandos de artefacto y vista previa. El comando estándar **Summarise as Mermaid diagram** permanece vinculado a una salida compatible con Mermaid para que los flujos de trabajo existentes basados en Markdown no cambien de formato de forma silenciosa.
Esta separación es importante porque una intención `flowchart` ahora puede ser renderizada como Mermaid para notas de Markdown, HTML como solución de respaldo sólida, o como HTML/SVG editables para edición posterior. Draw.io y Drawnix siguen siendo exportadores de artefactos CLI en lugar de destinos de renderizado dentro del plugin.
Establece **Preferred render target** en **Auto** como valor predeterminado del planificador, o elige explícitamente Mermaid, JSON Canvas, Vega-Lite, HTML, Editable HTML/SVG, Draw.io, Drawnix o Circuitikz. Esta opción solo se aplica a los comandos de artefacto y vista previa. El comando estándar **Summarise as Mermaid diagram** sigue orientado a la salida compatible con Mermaid para que los flujos de trabajo existentes basados en Markdown no cambien de formato de forma silenciosa.
Esta separación es importante porque ahora una intención `flowchart` puede renderizarse como Mermaid para notas en Markdown, como HTML como fallback fiable, como HTML/SVG editables para edición posterior, o como artefactos de origen Draw.io/Drawnix acompañados de imágenes SVG para revisión. Una intención `circuit` redirige a Circuitikz y requiere un `CircuitSpec` validado; no se trata de una solicitud de texto TikZ arbitrario.
## Uso
### Generar un diagrama
@ -101,16 +97,21 @@ Esta separación es importante porque una intención `flowchart` ahora puede ser
| Vega-Lite | `.json` | `{note}_diagram.json` |
| HTML | `.html` | `{note}_diagram.html` |
| Editable HTML/SVG | `.html` | `{note}_diagram.html` |
| Draw.io | `.drawio` + `.drawio.svg` + `.drawio.md` | `{note}_diagram.drawio` junto con archivos complementarios de revisión |
| Drawnix | `.drawnix` + `.drawnix.svg` + `.drawnix.md` | `{note}_diagram.drawnix` junto con archivos complementarios de revisión |
| Circuitikz | `.tex` + `.tex.svg` + `.tex.md` | `{note}_diagram.tex` junto con archivos complementarios de revisión |
### Vista previa de un diagrama
1. Ejecuta **"Notemd: Vista previa del diagrama"**
2. Se abre un modal con el diagrama renderizado
3. Exportar como SVG o PNG usando los botones de la barra de herramientas
3. Exporta como SVG, PNG o PDF utilizando los botones de la barra de herramientas
La opción **Auto-open preview** está disponible en la configuración: después de la generación, el modal de vista previa se abre automáticamente.
El modal de vista previa también cuenta con un panel de diagnóstico de artefactos. Los generadores y las pruebas de funcionamiento pueden adjuntar `RenderArtifact.diagnostics`; el modal muestra un resumen de diagnóstico con los conteos de errores/advertencias/informaciones, seguido de la gravedad, el tipo de diagnóstico, el mensaje y sugerencias de reparación junto a la vista previa. El mismo resumen se muestra en las entradas del historial de vistas previas, por lo que se pueden comparar intentos repetidos de circuitikz sin tener que abrir cada entrada. Para los artefactos que tienen contenido de origen pero no pueden renderizarse de forma incrustada ni a través de la ruta del iframe HTML, el modal ahora recurre a una vista previa solo con el código fuente en lugar de forzar un iframe vacío. Esto permite realizar pruebas de compilación/renderizado circuitikz, verificaciones de tokens de texto SVG, pruebas de capturas de pantalla en blanco en formato PNG y futuros informes de solapamientos sobre una superficie visible UI, sin convertir a TikZJax o a LaTeX en una dependencia obligatoria en tiempo de ejecución del plugin ni fingir que el texto de origen es un renderizado visual verificado.
La exportación de vista previa en formato PNG y PDF utiliza el PPI de vista previa configurado. El valor predeterminado es 300 PPI, y los valores superiores a 600 PPI se limitan a 600. SVG mantiene su tamaño vectorial. Los artefactos de origen como `.drawio`, `.drawnix` y `.tex` pueden incluir un archivo complementario `previewSvg` para que Obsidian pueda mostrar y exportar imágenes revisables sin incrustar diagram.net, Drawnix, LaTeX ni TikZJax durante la ejecución del plugin.
El modal de vista previa también cuenta con un panel de diagnósticos de artefactos. Los generadores y las pruebas de funcionamiento pueden adjuntar `RenderArtifact.diagnostics`; el modal muestra un resumen de los diagnósticos con los conteos de errores/advertencias/informaciones, seguido de la gravedad, el tipo de diagnóstico, el mensaje y sugerencias para solucionarlo, todo junto a la vista previa. Ese mismo resumen se muestra en las entradas del historial que tienen soporte para diagnósticos, por lo que es posible comparar intentos repetidos de pruebas de funcionamiento con circuitikz sin tener que abrir cada entrada por separado. En el caso de los artefactos que cuentan con contenido de origen pero no pueden renderizarse de forma inline ni a través de la ruta del iframe HTML, el modal ahora recurre a una vista previa que muestra únicamente el contenido de origen en lugar de forzar el uso de un iframe vacío. Esto permite que las pruebas de compilación/renderizado de circuitikz, las verificaciones de tokens de texto SVG, las pruebas de captura de pantalla en blanco PNG, los informes de solapamiento de glifos basados únicamente en rutas y los futuros informes de solapamiento tengan una interfaz de usuario visible, sin convertir a TikZJax o LaTeX en una dependencia obligatoria en tiempo de ejecución ni hacer que se considere que el texto de origen ya es un renderizado visual verificado.
### Modo Legacy Mermaid
@ -164,12 +165,12 @@ Este destino aún no es intencionalmente la ruta predeterminada del planificador
### Límites de exportación de Draw.io y Drawnix
La implementación actual mantiene el soporte para editores de terceros en los límites del artefacto:
La implementación actual mantiene el soporte para editores de terceros en los límites del artefacto, al tiempo que sigue exponiendo destinos de renderizado explícitos:
| Objetivo | Contrato | Dependencia en tiempo de ejecución |
|--------|----------|--------------------|
| Draw.io | `mxfile` XML determinístico sin comprimir desde `SemanticFigureModel` | Ninguno en el tiempo de ejecución del plugin ni en CI |
| Drawnix | subconjunto mínimo `.drawnix` JSON que utiliza elementos `geometry` y `arrow-line` | Ninguno en el tiempo de ejecución del plugin ni en CI |
| Draw.io | XML `mxfile` descomprimido y determinista proveniente de `SemanticFigureModel`, además de archivos de revisión en formatos SVG/PNG/PDF | No hay nada en el tiempo de ejecución del plugin ni en CI |
| Drawnix | Un subconjunto mínimo de JSON `.drawnix` que utiliza los elementos `geometry` y `arrow-line`, además de archivos de revisión en formatos SVG/PNG/PDF | No hay nada en el tiempo de ejecución del plugin ni en CI |
El compromiso es intencional: Notemd puede verificar etiquetas visibles, identificadores estables y cobertura de primitivas soportadas sin incluir en el complemento a Diagrams.net Desktop, Drawnix, Plait ni el estado del editor exclusivo para navegadores.
@ -213,7 +214,11 @@ Notemd ahora incluye el primer prototipo de repositorio restringido para esta di
npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-inverter.tex
```
El prototipo agrega un límite separado `CircuitSpec` y un exportador determinista para seis familias de referencia dorada:
El prototipo añade un límite restringido por `CircuitSpec` y un exportador determinista para seis familias de referencia estándar:
En la pipeline experimental de diagramas, ahora también es posible acceder a esto mediante `intent: "circuit"` y el destino de renderizado `circuitikz`. El `DiagramSpec` generado solo puede incluir `circuitSpec` cuando el intento sea de tipo circuito. `CircuitikzRenderer` escribe la misma fuente `.tex` determinista y adjunta un archivo de vista previa en SVG derivado de esa topología de circuito validada, lo que permite la vista previa en Obsidian además de la exportación en formatos SVG/PNG/PDF. Dicho archivo de vista previa no es el resultado de una compilación con LaTeX/TikZJax; las pruebas reales del renderizador siguen correspondiendo a los comandos específicos de prueba que se indican a continuación.
Para las plantillas estándar compatibles, `layoutHints.inputSide` y `layoutHints.outputSide` siguen siendo controles exclusivamente para la presentación. Permiten mover la ubicación determinista de los puertos de entrada/salida, pero no modifican la firma de la topología ni permiten realizar una pasada de reparación para redirigir el circuito.
| Tipo de circuito | Referencia dorada | Garantía actual |
|--------------|------------------|-------------------|
@ -224,7 +229,7 @@ El prototipo agrega un límite separado `CircuitSpec` y un exportador determinis
| `cmos-nand2` | `cmos-nand2-v1` | Valida el tirón ascendente en paralelo con PMOS, el tirón descendente en serie con NMOS, las entradas duales `va` / `vb` y `vout` antes de escribir LaTeX |
| `cmos-nor2` | `cmos-nor2-v1` | Valida la resistencia de elevación en serie PMOS, la resistencia de bajada en paralelo NMOS, las entradas duales `va` / `vb` y `vout` antes de escribir LaTeX |
Esto aún no es un generador general de TikZ. No compila LaTeX, no llama a TikZJax, no inspecciona capturas de pantalla ni ejecuta reparaciones automáticas basadas en retroalimentación de imágenes. Esos son pasos que se implementarán más adelante.
Esto no es un generador general de TikZ. No acepta código TikZ arbitrario, no compila LaTeX, no llama a TikZJax, no inspecciona capturas de pantalla durante el tiempo de ejecución del plugin, ni ejecuta procesos automáticos de reparación basados en imágenes. Esas funcionalidades forman parte de etapas posteriores.
El comando Diagrama de vista previa puede volver a abrir los artefactos de código circuitikz guardados directamente cuando la extensión del archivo es `.tex` o `.tikz` y el código contiene `\usepackage{circuitikz}` o `\begin{circuitikz}`. Esa ruta es una vista previa exclusiva del código circuitikz: la ventana modal muestra el código fuente, los diagnósticos, los controles de copiar/guardar y los metadatos de historial, pero no compila LaTeX ni llama a TikZJax durante el tiempo de ejecución del complemento.
@ -350,8 +355,8 @@ Para un inversor CMOS, la instrucción debe solicitar una topología explícita
|------|----------------|-----------|
| Diagramas generales | Pipeline basado en especificaciones implementado para Mermaid, JSON Canvas, Vega-Lite, HTML | Seguir ampliando la cobertura de verificación semántica |
| Figuras editables | Se han implementado los límites de artefacto `editable-html-svg`, Draw.io XML y Drawnix JSON | Añada primitivas más avanzadas solo después de que las pruebas demuestren su editabilidad |
| Soporte de CLI | `npm run diagram:export-artifact` exporta HTML/SVG, Draw.io y Drawnix editables desde un `DiagramSpec` | Añadir accesorios de humo específicos para cada objetivo cuando se envíen nuevos objetivos |
| circuitikz | `CircuitSpec -> circuitikz` exporta prototipos de fuente común, inversor CMOS, plantillas doradas `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1` y `cmos-nor2` / `cmos-nor2-v1`, proyectos `layoutHints.inputSide` y `layoutHints.outputSide` para una colocación determinista de puertos de entrada/salida sin cambiar la topología, rechaza las desviaciones en la topología de reparación mediante `--topology-reference`, emite informes de reparación que preservan la topología a través de `--repair-brief-output` y el esquema `notemd.circuitikz.repair-brief.v1`, incluye contenido estructurado de transferencia `repairPrompt` con `diagnosticFocus`, `acceptanceCriteria` y el rol `topology-preserving-circuitikz-repair`, valida los candidatos de reparación a través de `--repair-brief`, devuelve evidencia de las puertas a través del esquema `notemd.circuitikz.repair-acceptance.v1` con `readyForVisualAcceptance` y `remainingChecks`, mantiene esa evidencia mediante `--repair-acceptance-output`, analiza los registros de compilación, puede ejecutar renderizadores locales explícitos además de `--expected-artifact`, SVG `--expected-svg-text`, verifica metadatos de accesibilidad a través de `aria-label`, `<title>` y `<desc>`, exclusión de elementos SVG ocultos/transparentes, clasificación `render-svg-text-path-only` / `pathOnlyGlyphUseCount` para etiquetas solo de ruta, verificaciones de colocación de glifos solo de ruta para `<use href="#...">`, diagnósticos de solapamiento de glifos solo de ruta a través de `render-svg-path-glyph-overlap`, manejo del punto actual en rutas cerradas para `Z/z`, límites exactos de arcos para extremos de arco A/a, límites exactos de curvas Bezier para extremos de curvas C/S/Q/T, verificaciones de límites SVG sensibles al ancho de trazo y solapamiento de etiquetas, verificaciones de geometría de dibujo `polyline` / `polygon`, geometría de etiquetas posicionadas `tspan`, geometría de texto posicionado sensible a `text-anchor`, geometría sensible a transformaciones para SVG casos de canvas delimitado/superposición de texto y pruebas de humo de etiqueta frente a dibujo a través de `render-svg-label-overlap`, además de pruebas de capturas de pantalla PNG sin fondo/vincadas/con primer plano denso, incluyendo alfa de paleta de colores indexados, muestras transparentes en escala de grises/RGB tRNS y guías `render-png-unsupported` específicas del formato para PNGs entrelazados Adam7 y fallos en profundidad de bits indexada, a través de `foregroundBounds`, `foregroundDensity`, `render-png-content-clipped` y `render-png-foreground-dense` sin análisis de shell, incluye pruebas de humo agregadas para mantenedores a través de `npm run diagram:smoke-circuitikz`, registra configuraciones de renderizador faltantes a través de `rendererAvailability.status: "missing-configuration"` y `compile-executable-invalid`, y cuenta con diagnósticos generales de vista previa, conteos de resúmenes de diagnósticos, entradas de historial sensibles a diagnósticos y solución de fallback solo con código fuente a través de `RenderArtifact.diagnostics` y el modal de vista previa | Agregar reconocimiento de etiquetas a nivel OCR para texto visual que solo contiene rutas, comprobaciones precisas de superposición a nivel de píxel, una cobertura más amplia de SVG rutas cuando sea necesario, instalación/descubrimiento automático del renderizador solo si puede seguir siendo opcional, y ejecución automática de reparaciones que preserven la topología |
| Soporte CLI | `npm run diagram:export-artifact` exporta evidencias editables en HTML/SVG, Draw.io, Drawnix, Circuitikz, así como archivos SVG/PNG/PDF para revisión, a partir de un `DiagramSpec` validado | Se añaden pruebas básicas específicas para cada destino cuando se lanzan nuevos destinos |
| circuitikz | `DiagramSpec(intent: "circuit", circuitSpec) -> CircuitikzRenderer -> circuitikz` exporta plantillas estándar para fuentes comunes, inversores CMOS, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1`, y `cmos-nor2` / `cmos-nor2-v1`; muestra las opciones de intención de la interfaz de usuario y de destino de renderizado, escribe código TeX junto con vistas previas en SVG/PNG/PDF, valida la topología antes de generar el resultado, analiza los registros de compilación, permite ejecutar renderizadores locales explícitos mediante `--expected-artifact`, y mantiene una opción de fallback basada únicamente en el código fuente además de diagnósticos de las vistas previas visibles a través de `RenderArtifact.diagnostics` y el modal de vista previa | Se añadirá reconocimiento de etiquetas al nivel de OCR para texto visual que solo contiene rutas, comprobaciones de superposición precisas a nivel de píxel, una cobertura más amplia de rutas SVG cuando sea necesario, instalación y detección automáticas de renderizadores solo si es posible mantenerlas como opcionales, y ejecución automática de reparaciones que preservan la topología |
| Integración de TikZJax | Seleccionar servidor de renderizado para la pantalla del lado Obsidian | Déjalo opcional; no haga que TikZJax sea una dependencia obligatoria en tiempo de ejecución del plugin |
## Configuración
@ -361,6 +366,7 @@ Para un inversor CMOS, la instrucción debe solicitar una topología explícita
| `enableExperimentalDiagramPipeline` | `false` | Alternar entre el enfoque basado en especificaciones y el enfoque heredado Mermaid |
| `experimentalDiagramCompatibilityMode` | `'legacy-mermaid'` | `'legacy-mermaid'` = Mermaid únicamente; `'best-fit'` = destinos nativos + alternativas |
| `preferredDiagramIntent` | `undefined` (automático) | Sobrescribir la detección automática de intención |
| `preferredDiagramRenderTarget` | `undefined` (automático) | Sobrescribir el renderizador de artefactos, incluyendo Draw.io, Drawnix y Circuitikz |
| `summarizeToMermaidLanguage` | `'en'` | Idioma de destino para las etiquetas del diagrama |
| `summarizeToMermaidProvider` / `Model` | DeepSeek | LLM por tarea para la generación de diagramas |
| `autoMermaidFixAfterGenerate` | (de constantes) | Ejecutar automáticamente el corrector heredado en la salida de Mermaid |
@ -380,10 +386,11 @@ Cuando está activado, Notemd obtiene fragmentos de contexto relevantes de la ba
| Acción | Método |
|--------|--------|
| SVG exportar | Construtor para Canvas: `mermaid.render()` / `vega.View.toSVG()` / SVG |
| Exportación a PNG | SVG → Imagen → Lienzo (relación de píxeles del dispositivo 1x-3x) → ArrayBuffer PNG |
| Exportación a PNG | SVG → Imagen → Canvas / rasterizador de vista previa a la resolución por pulgadas configurada → ArrayBuffer PNG |
| Exportación a PDF | SVG → imagen rasterizada a la resolución por pulgadas configurada → PDF de una sola página |
| Guardar fuente | Contenido del artefacto en bruto guardado con extensión específica del destino |
| Vista previa solo de origen | Artefactos no en línea con el contenido de origen mostrado como código además de diagnósticos, sin renderizado de iframe |
| Auditoría semántica | Mermaid, JSON Canvas, Vega-Lite, y HTML/SVG editables verificados por `scripts/diagram-semantic-verification.js` |
| Auditoría semántica | Se verifican Mermaid, JSON Canvas, Vega-Lite, HTML/SVG editables, Draw.io, Drawnix y circuitikz con restricciones mediante `scripts/diagram-semantic-verification.js` además de pruebas del renderizador y la CLI |
**Caché**: RenderCache utiliza una clave determinística JSON de `{spec, target, theme}`. La deduplicación en tiempo real evita renders duplicados.

View file

@ -1,7 +1,7 @@
---
id: diagrams
title: "نمودارها"
description: "تولید Mermaid، JSON Canvas، Vega-Lite، HTML، آثار تصویری قابل ویرایش، و نمودارهای محدود شده در آینده circuitikz از یادداشت‌های شما با استفاده از معماری مبتنی بر مشخصات اولیه"
description: "استفاده از معماری مبتنی بر مشخصات اولیه، تولید نمودارهای Mermaid، JSON Canvas، Vega-Lite، HTML، آرتیفکت‌های تصویری قابل ویرایش، Draw.io، Drawnix و نمودارهای circuitikz محدود‌شده از یادداشت‌های شما"
author:
'@id': 'https://jacobinwwey.github.io/obsidian-NotEMD/#person-jacobinwwey'
keywords: [diagrams, mermaid, vega-lite, canvas, visualization, spec-first, drawio, drawnix, editable svg, circuitikz, TikZJax]
@ -18,7 +18,7 @@ import TLDR from '@site/src/components/TLDR';
# نمودارها
<TLDR>
**Notemd نمودارها را از یادداشت‌های شما از طریق یک خط تولید مبتنی بر مشخصات اولیه تولید می‌کند.** LLM یک `DiagramSpec` JSON مستقل از رندرر تولید می‌کند، سپس آداپتورهای ویژه آن را به Mermaid، JSON Canvas، Vega-Lite، HTML یا خروجی قابل ویرایش HTML/SVG تبدیل می‌کنند. این سیستم از ۸ نوع قصد، زنجیره‌های جایگزینی خودکار، نمایش زنده همراه با صادرات به SVG/PNG، بررسی معنایی، و تولید تقویت‌شده با دانش محلی پشتیبانی می‌کند.
**Notemd از طریق یک فرآیند مبتنی بر مشخصات، نمودارها را از یادداشت‌های شما تولید می‌کند.** مدل LLM یک فایل JSON با نام `DiagramSpec` که مستقل از نرم‌افزار رندرر است، تولید می‌کند؛ سپس ابزارهای ویژه آن را به فرمت‌های Mermaid، JSON Canvas، Vega-Lite، HTML، HTML/SVG قابل ویرایش، Draw.io، Drawnix یا نمودارهای circuitikz محدود‌شده تبدیل می‌کنند. این سیستم از ۹ نوع هدف پشتیبانی می‌کند، زنجیره‌های جایگزینی خودکار دارد، امکان مشاهده زنده و صادرات به فرمت‌های SVG/PNG/PDF را فراهم می‌کند، بررسی معنایی را انجام می‌دهد و تولید محتوا را با استفاده از دانش محلی تقویت می‌کند.
</TLDR>
این بخشی از [Obsidian راهنمای مدیریت دانش هوش مصنوعی](/docs/pillar-ai-knowledge) است.
@ -54,6 +54,7 @@ graph LR
| `stateDiagram` | Mermaid | HTML | ماشین‌های حالت، مدل‌های چرخه عمر |
| `canvasMap` | JSON Canvas | Mermaid → HTML | نقشه‌های مفهومی، گراف‌های دانش |
| `dataChart` | Vega-Lite | Mermaid → HTML | نمودارهای میله‌ای، خطی، ناحیه‌ای، پراکنده، کیکی، جداول |
| `circuit` | circuitikz | none | نمودارهای مدار محدود‌شده از بارهای `CircuitSpec` تأییدشده |
## تشخیص قصد
@ -67,6 +68,7 @@ Notemd با استفاده از امتیازدهی کلمات کلیدی، به
| `stateDiagram` | حالت، انتقال، در حال انتظار، در حال اجرا، شکست‌خورده (۳ مورد یا بیشتر) | 0.76 |
| `flowchart` | مراحل شماره‌گذاری‌شده (۲ مورد یا بیشتر) یا واژگان if/then/else/workflow | 0.74 |
| `canvasMap` | نقشه مفهومی، گراف دانش، فضایی، خوشه‌بندی | 0.72 |
| `circuit` | circuitikz, TikZJax, circuit, schematic, CMOS, NMOS, PMOS, MOSFET, VDD/GND, `vin`/`vout` | 0.78 |
| `mindmap` | پیش‌فرض جایگزین | 0.55 |
با تنظیم **نوع نمودار مورد علاقه**، انتخاب‌کننده سمت چپ یا گزینه صریح پالت دستورات، آن را بازنویسی کنید.
@ -80,10 +82,9 @@ Notemd با استفاده از امتیازدهی کلمات کلیدی، به
| نوع نمودار مورد علاقه | `preferredDiagramIntent` | شکل معنایی `DiagramSpec` تولید شده را هدایت می‌کند |
| هدف رندر مورد علاقه | `preferredDiagramRenderTarget` | رندرکننده آرتیفکت برای **تولید نمودار** و **پیش‌نمایش نمودار** را انتخاب می‌کند |
برای پیش‌فرض برنامه‌ریز، **هدف رندر مورد علاقه** را روی **خودکار** تنظیم کنید یا به طور صریح Mermaid، JSON Canvas، Vega-Lite، HTML یا HTML/SVG قابل ویرایش را انتخاب کنید. این بازنویسی فقط برای دستورات آرتیفکت و پیش‌نمایش اعمال می‌شود. دستور استاندارد **خلاصه کردن به نمودار Mermaid** همچنان به خروجی سازگار با Mermaid متصل می‌ماند تا فرآیندهای Markdown موجود به طور خاموش فرمت را تغییر ندهند.
این جداسازی اهمیت دارد زیرا یک قصد `flowchart` اکنون می‌تواند برای یادداشت‌های Markdown به صورت Mermaid، برای پیش‌فرض محکم به صورت HTML، یا برای ویرایش‌های بعدی به صورت HTML/SVG قابل رندر شدن باشد. Draw.io و Drawnix همچنان صادرکننده‌های آرتیفکت CLI هستند و نه هدف‌های رندر درون پلاگین.
برای تنظیم پیش‌فرض برنامه برنامه‌ریز، مقدار **Preferred render target** را روی **Auto** در نظر بگیرید؛ یا به طور صریح از گزینه‌های Mermaid، JSON Canvas، Vega-Lite، HTML، Editable HTML/SVG، Draw.io، Drawnix یا Circuitikz استفاده کنید. این تغییرات تنها بر روی دستورات مربوط به آرتیفکت‌ها و نمایش زنده اعمال می‌شوند. دستور استاندارد **Summarise as Mermaid diagram** همچنان فقط برای خروجی‌های سازگار با Mermaid در نظر گرفته شده تا فرآیندهای Markdown موجود به طور پنهان فرمت را تغییر ندهند.
این تفکیک اهمیت زیادی دارد زیرا اکنون می‌توان یک هدف نوع `flowchart` را برای یادداشت‌های Markdown به صورت Mermaid، برای جایگزینی قوی‌تر به HTML، برای ویرایش بعدی به HTML/SVG قابل ویرایش، یا به عنوان آرتیفکت منبع Draw.io/Drawnix همراه با نسخه بررسی‌شده SVG رندر کرد. هدف نوع `circuit` به Circuitikz ارجاع داده می‌شود و نیازمند یک فایل `CircuitSpec` تأییدشده است؛ این درخواست، متن دلخواه TikZ نیست.
## کاربرد
### تولید یک نمودار
@ -101,16 +102,21 @@ Notemd با استفاده از امتیازدهی کلمات کلیدی، به
| Vega-Lite | `.json` | `{note}_diagram.json` |
| HTML | `.html` | `{note}_diagram.html` |
| قابل ویرایش HTML/SVG | `.html` | `{note}_diagram.html` |
| Draw.io | `.drawio` + `.drawio.svg` + `.drawio.md` | `{note}_diagram.drawio` به همراه فایل‌های مربوط به بررسی |
| Drawnix | `.drawnix` + `.drawnix.svg` + `.drawnix.md` | `{note}_diagram.drawnix` به همراه فایل‌های مربوط به بررسی |
| Circuitikz | `.tex` + `.tex.svg` + `.tex.md` | `{note}_diagram.tex` به همراه فایل‌های مربوط به بررسی |
### مشاهده طرح
1. اجرای **"Notemd: مشاهده طرح"**
2. یک پنجره کشویی با طرح نمایش داده‌شده باز می‌شود
3. صادرات به صورت SVG یا PNG با استفاده از دکمه‌های نوار ابزار
۳. از طریق دکمه‌های نوار ابزار، فایل را به صورت SVG، PNG یا PDF صادر کنید
گزینه **باز شدن خودکار مشاهده** در تنظیمات موجود است — پس از تولید، پنجره مشاهده به‌طور خودکار باز می‌شود.
پنجره مشاهده همچنین دارای پنل تشخیص نقص‌ها است. ابزارهای رندر و بررسی‌های سیگار می‌توانند `RenderArtifact.diagnostics` را اضافه کنند؛ پنجره خلاصه‌ای از تشخیصات را با تعداد خطا/هشدار/اطلاعات، سپس میزان شدت، نوع تشخیص، پیام و توصیه‌های تعمیر در کنار مشاهده نشان می‌دهد. همین خلاصه در ورودی‌های تاریخچه مشاهده نیز نمایش داده می‌شود، بنابراین می‌توان تلاش‌های مکرر circuitikz را بدون باز کردن هر ورودی مقایسه کرد. برای نقص‌هایی که محتوای منبع دارند اما نمی‌توانند به‌صورت درون‌خطی یا از طریق مسیر iframe HTML رندر شوند، پنجره اکنون به جای اجبار به استفاده از یک iframe خالی، به مشاهده فقط منبع روی می‌آورد. این کار به بررسی‌های کامپایل/رندر circuitikz، بررسی‌های توکن متنی SVG، بررسی‌های سکرینشات خالی PNG و گزارش‌های تداخل آینده، یک سطح قابل مشاهده UI می‌دهد، بدون اینکه TikZJax یا LaTeX را به یک وابستگی زمان اجرای پلاگین سخت تبدیل کند یا محتوای منبع را به‌عنوان یک رندر بصری تأییدشده در نظر بگیرد.
صادرات نمایش پیش‌نمایش برای فرمت‌های PNG و PDF از PPI پیش‌نمایش تنظیم‌شده استفاده می‌کند. مقدار پیش‌فرض ۳۰۰ PPI است و مقادیر بالاتر از ۶۰۰ PPI به ۶۰۰ محدود می‌شوند. فرمت SVG همچنان با اندازه برداری باقی می‌ماند. فایل‌های منبع مانند `.drawio`، `.drawnix` و `.tex` می‌توانند یک فایل همراه به نام `previewSvg` ارائه دهند تا Obsidian بتواند تصاویر قابل بررسی را نمایش داده و صادر کند، بدون اینکه در زمان اجرای پلاگین، فایل‌های diagram.net، Drawnix، LaTeX یا TikZJax را درون آن قرار دهد.
پنجره پیش‌نمایش نیز دارای یک پنل تشخیص اشکال محصول است. ابزارهای رندرینگ و بررسی‌های مقدماتی می‌توانند مقدار `RenderArtifact.diagnostics` را اضافه کنند؛ این پنجره یک خلاصه تشخیصی نشان می‌دهد که شامل تعداد خطاها، هشدارها و اطلاعیه‌ها، سپس میزان شدت، نوع تشخیص، پیام و توصیه‌های اصلاحی در کنار پیش‌نمایش است. همین خلاصه در ثبت‌های تاریخچه که از قابلیت تشخیص اشکال پشتیبانی می‌کنند نیز نمایش داده می‌شود، بنابراین می‌توان تلاش‌های مکرر برای بررسی circuitikz را بدون باز کردن هر ثبت به تنهایی مقایسه کرد. برای اشکالی که دارای محتوای منبع هستند اما نمی‌توانند به صورت درون‌متنی یا از طریق مسیر iframe HTML رندر شوند، این پنجره اکنون به جای ایجاد یک iframe خالی، به یک پیش‌نمایش صرفاً مبتنی بر منبع روی می‌آورد. این کار به بررسی‌های کامپایل/رندر circuitikz، بررسی‌های توکن‌های متنی SVG، بررسی‌های سکرینشات خالی PNG، گزارش‌های همپوشانی گلیف‌ها فقط بر اساس مسیر، و گزارش‌های همپوشانی آینده، یک رابط کاربری قابل مشاهده می‌دهد، بدون اینکه نیاز به استفاده از TikZJax یا LaTeX به عنوان یک وابستگی زمان اجرا الزامی ایجاد شود یا اینکه متن منبع به عنوان یک رندر بصری تأیید‌شده در نظر گرفته شود.
### حالت Mermaid قدیمی
@ -164,12 +170,12 @@ Notemd با استفاده از امتیازدهی کلمات کلیدی، به
### Draw.io و Drawnix مرزهای صادرات
پیاده‌سازی فعلی حمایت از ویرایشگرهای شخص ثالث را در مرز آرتیفکت نگه می‌دارد:
پیاده‌سازی فعلی، حمایت از ویرایشگرهای شخص ثالث را در مرز آرتیفکت نگه می‌دارد و در عین حال اهداف رندر صریحی را در دسترس قرار می‌دهد:
| هدف | قرارداد | وابستگی زمان اجرا |
|--------|----------|--------------------|
| Draw.io | `mxfile` XML بدون فشرده‌سازی تعیین‌شونده از `SemanticFigureModel` | هیچ‌کدام در زمان اجرای پلاگین یا CI وجود ندارد |
| Drawnix | مجموعه کوچکی از `.drawnix` JSON با استفاده از عناصر `geometry` و `arrow-line` | هیچ‌کدام در زمان اجرای پلاگین یا CI وجود ندارد |
| Draw.io | فایل XML `mxfile` بی‌فشرده و قطعی از `SemanticFigureModel`، همراه با فایل‌های بررسی SVG/PNG/PDF | هیچ چیزی در زمان اجرای پلاگین یا CI وجود ندارد |
| Drawnix | زیرمجموعه حداقلی JSON فرمت `.drawnix` که از عناصر `geometry` و `arrow-line` استفاده می‌کند، همراه با فایل‌های بررسی SVG/PNG/PDF | هیچ چیزی در زمان اجرای پلاگین یا CI وجود ندارد |
این تعادل عمدی است: Notemd می‌تواند برچسب‌های قابل مشاهده، شناسه‌های پایدار و پوشش ابتدایی‌های پشتیبانی‌شده را بدون گنجاندن Diagram.net Desktop، Drawnix، Plait یا حالت ویرایشگر فقط در مرورگر در پلاگین بررسی کند.
@ -213,7 +219,11 @@ Notemd اکنون شامل اولین پروتوتایپ مخزن محدودشد
npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-inverter.tex
```
این پروتوتایپ یک مرز جداگانه `CircuitSpec` و یک صادرکننده تعیین‌شده برای شش خانواده مرجع طلایی اضافه می‌کند:
این پروتوتایپ، یک مرز محدودشده `CircuitSpec` و یک صادرکننده قطعی برای شش خانواده مرجع طلایی اضافه می‌کند:
در پایپ‌لاین نمودارهای تجربی، اکنون می‌توان به آن از طریق `intent: "circuit"` و هدف رندر `circuitikz` نیز دسترسی پیدا کرد. فایل `DiagramSpec` تولیدشده تنها برای قصد مربوط به مدار‌ها می‌تواند شامل `circuitSpec` باشد. `CircuitikzRenderer` همان منبع `.tex` قطعی را می‌نویسد و یک فایل نمایش SVG که از آن ساختار مدار تأییدشده استخراج شده، را ضمیمه می‌کند؛ این امر امکان نمایش در Obsidian و صادرات به فرمت‌های SVG/PNG/PDF را فراهم می‌سازد. این فایل همراه، نتیجه کامپایل LaTeX/TikZJax نیست؛ شواهد واقعی رندر همچنان مربوط به دستورات آزمایشی صریح ذکرشده در پایین است.
برای الگوهای مرجع پشتیبانی‌شده، `layoutHints.inputSide` و `layoutHints.outputSide` همچنان تنها کنترل‌های مربوط به نمایش هستند. آن‌ها می‌توانند محل قرارگیری پورت‌های ورودی/خروجی را به صورت قطعی جابجا کنند، اما امضای ساختاری مدار را تغییر نمی‌دهند و اجازه انجام یک مرحله تعمیر برای بازسازی مدار را نمی‌دهند.
| نوع مدار | مرجع طلایی | گارانتی فعلی |
|--------------|------------------|-------------------|
@ -224,7 +234,7 @@ npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-in
| `cmos-nand2` | `cmos-nand2-v1` | قبل از نوشتن LaTeX، پیکربندی‌های pull-up موازی PMOS، pull-down سری NMOS، ورودی‌های دوگانه `va` / `vb` و `vout` را بررسی می‌کند. |
| `cmos-nor2` | `cmos-nor2-v1` | قبل از نوشتن LaTeX، سری‌های PMOS برای کشیدن به بالا، NMOS برای کشیدن به پایین به صورت موازی، ورودی‌های دوگانه `va` / `vb` و `vout` را بررسی می‌کند. |
این هنوز یک تولیدکننده کلی TikZ نیست. این ابزار لاتکس را کامپایل نمی‌کند، به TikZJax فراخوانی نمی‌کند، تصاویر صفحه نمایش را بررسی نمی‌کند و تعمیر خودکار تصاویر بر اساس بازخورد را انجام نمی‌دهد. این کارها در مراحل بعدی انجام خواهند شد.
این یک تولیدکننده TikZ عمومی نیست. این ابزار TikZ دلخواه را قبول نمی‌کند، LaTeX را کامپایل نمی‌کند، TikZJax را فراخوانی نمی‌کند، تصاویر را در زمان اجرای پلاگین بررسی نمی‌کند و هیچ تعمیر خودکار مبتنی بر بازخورد تصویری انجام نمی‌دهد. این کارها همچنان در مراحل بعدی انجام خواهند شد.
دستور نمودار پیش‌نمایش می‌تواند به‌طور مستقیم آرتیفکت‌های منبع ذخیره‌شده circuitikz را دوباره باز کند، هنگامی که پسوند فایل `.tex` یا `.tikz` باشد و منبع حاوی `\usepackage{circuitikz}` یا `\begin{circuitikz}` باشد. این روش نوعی پیش‌نمایش صرفاً مبتنی بر منبع circuitikz است: پنجره نمایشی، منبع، اطلاعات تشخیصی، کنترل‌های کپی/ذخیره و اطلاعات فراداده‌های تاریخچه را نشان می‌دهد، اما لاتکس را کامپایل نمی‌کند و در زمان اجرای پلاگین از TikZJax استفاده نمی‌کند.
@ -350,8 +360,8 @@ npm run diagram:smoke-circuitikz -- --output-dir docs/export/circuitikz-smoke --
|------|----------------|-----------|
| نمودارهای کلی | خط لوله مبتنی بر مشخصات برای Mermaid, JSON Canvas, Vega-Lite, HTML پیاده‌سازی شده است | پوشش بررسی معنایی را همچنان گسترش دهید |
| شکل‌های قابل ویرایش | مرزهای آرتیفکت `editable-html-svg`, Draw.io XML و Drawnix JSON پیاده‌سازی شده‌اند | تنها پس از اثبات قابلیت ویرایش توسط آزمون‌ها، ابتدا از اصول غنی‌تر استفاده کنید |
| پشتیبانی CLI | `npm run diagram:export-artifact` فایل‌های قابل ویرایش HTML/SVG, Draw.io و Drawnix را از یک `DiagramSpec` صادر می‌کند | افزودن تجهیزات دودساز مخصوص هدف هنگام ارسال هدف‌های جدید |
| circuitikz | `CircuitSpec -> circuitikz` پروتوتایپ صادرات منابع مشترک، معکوس‌کننده CMOS، `cmos-buffer` / `cmos-buffer-v1`، `cmos-transmission-gate` / `cmos-transmission-gate-v1`، `cmos-nand2` / `cmos-nand2-v1` و `cmos-nor2` / `cmos-nor2-v1` الگوهای طلایی، پروژه‌های `layoutHints.inputSide` و `layoutHints.outputSide` را به‌صورت قطعی در محل‌های ورودی/خروجی قرار می‌دهد بدون تغییر ساختار شبکه، از تغییرات ناخواسته ساختار شبکه از طریق `--topology-reference` جلوگیری می‌کند، گزارش‌های تعمیر حفظ‌کننده ساختار شبکه را از طریق `--repair-brief-output` و الگو `notemd.circuitikz.repair-brief.v1` ارسال می‌کند، شامل محتوای ساختاریافته `repairPrompt` برای انتقال همراه با `diagnosticFocus`، `acceptanceCriteria` و نقش `topology-preserving-circuitikz-repair` است، گزینه‌های تعمیر را از طریق `--repair-brief` بررسی می‌کند، شواهد درباره دروازه‌ها را از طریق الگو `notemd.circuitikz.repair-acceptance.v1` همراه با `readyForVisualAcceptance` و `remainingChecks` برمی‌گرداند، آن شواهد را از طریق `--repair-acceptance-output` ذخیره می‌کند، لاگ‌های کامپایل را تجزیه می‌کند، می‌تواند رندررهای محلی صریح را به‌همراه `--expected-artifact`، SVG `--expected-svg-text` اجرا کند، بررسی فراداده‌های قابل دسترسی از طریق `aria-label`، `<title>` و `<desc>`، حذف عناصر پنهان/شفاف SVG، طبقه‌بندی `render-svg-text-path-only` / `pathOnlyGlyphUseCount` برای برچسب‌های فقط مسیر، بررسی قرارگیری گلیف‌های فقط مسیر برای `<use href="#...">`، تشخیص تداخل گلیف‌های فقط مسیر از طریق `render-svg-path-glyph-overlap`، مدیریت نقطه جریان برای مسیرهای بسته برای `Z/z`، مرزهای دقیق قوس A/a برای انتهای قوس، مرزهای دقیق منحنی‌های Bezier برای انتهای منحنی‌های C/S/Q/T، بررسی مرزهای SVG مبتنی بر ضخامت خط و تداخل برچسب‌ها، بررسی‌های هندسی رسم `polyline` / `polygon`، هندسه برچسب‌های موقعیت‌یافته `tspan`، هندسه متن موقعیت‌یافته آگاه از `text-anchor`، هندسه آگاه از تبدیل برای SVG در محدوده کانواس/تداخل متن و دودساز برچسب در برابر رسم از طریق `render-svg-label-overlap`، و بررسی‌های سکرینشات PNG غیرخالی/بریده/پیش‌زمینه متراکم، شامل پالت رنگی با آلفا، نمونه‌های شفاف تراز سیاه و سفید/RGB tRNS، و راهنمایی‌های خاص فرمت برای PNGهای Adam7 متقاطع و خطاهای عمق بیتی شماره‌گذاری‌شده، از طریق `foregroundBounds`، `foregroundDensity`، `render-png-content-clipped` و `render-png-foreground-dense` بدون تجزیه شل، شامل تجهیزات دودساز نگهدارنده کلی از طریق `npm run diagram:smoke-circuitikz`، ثبت پیکربندی رندررهای ناپدید شده از طریق `rendererAvailability.status: "missing-configuration"` و `compile-executable-invalid`، و دارای تشخیصات پیش‌نمایش عمومی، شمارش خلاصه تشخیصات، ورودی‌های تاریخچه آگاه از تشخیصات، و راهکار جایگزین فقط مبتنی بر منبع از طریق `RenderArtifact.diagnostics` و پنل پیش‌نمایش | افزودن تشخیص برچسب در سطح OCR برای متن بصری فقط مسیر، بررسی دقیق تداخل در سطح پیکسل، پوشش گسترده‌تر SVG مسیر در صورت نیاز، نصب/یافتن خودکار رندرر تنها زمانی که بتواند اختیاری باقی بماند، و اجرای خودکار تعمیر حفظ‌کننده ساختار شبکه |
| پشتیبانی CLI | دستور `npm run diagram:export-artifact` شواهد قابل ویرایش HTML/SVG، Draw.io، Drawnix، Circuitikz و همچنین فایل‌های مرور SVG/PNG/PDF را بر اساس یک `DiagramSpec` تأیید‌شده صادر می‌کند | هنگام عرضه اهداف جدید، فیکست‌های smoke مخصوص آن اهداف را اضافه کنید |
| circuitikz | `DiagramSpec(intent: "circuit", circuitSpec) -> CircuitikzRenderer -> circuitikz` الگوهای طلایی مربوط به منابع مشترک، invertor CMOS، `cmos-buffer` / `cmos-buffer-v1`، `cmos-transmission-gate` / `cmos-transmission-gate-v1`، `cmos-nand2` / `cmos-nand2-v1` و `cmos-nor2` / `cmos-nor2-v1` را صادر می‌کند؛ گزینه‌های قصد کاربری/هدف نمایش را نمایش می‌دهد، فایل‌های TeX همراه با پیش‌نمایش SVG/PNG/PDF را می‌نویسد، قبل از خروجی ساختار شبکه را بررسی می‌کند، لاگ‌های کامپایل را تحلیل می‌کند، می‌تواند رندررهای محلی مشخص شده را به همراه پارامتر `--expected-artifact` اجرا کند و یک راه حل جایگزین فقط بر اساس منبع را حفظ کرده و تشخیصات مربوط به پیش‌نمایش را از طریق `RenderArtifact.diagnostics` و پنجره پیش‌نمایش نمایش می‌دهد | افزودن تشخیص برچسب‌ها در سطح OCR برای متن‌های تصویری فقط شامل مسیر، بررسی‌های دقیق همپوشانی در سطح پیکسل، پوشش گسترده‌تر مسیرهای SVG در صورت نیاز، نصب/یافتن خودکار رندررها تنها در صورتی که بتوان آن‌ها را اختیاری نگه داشت، و اجرای خودکار تعمیرات حفظ‌کننده ساختار شبکه |
| اینتگراسیون TikZJax | میزبان رندر کاندید برای نمایش در سمت Obsidian | آن را اختیاری نگه دارید؛ TikZJax را به یک وابستگی زمان اجرای پلاگین اجباری تبدیل نکنید |
## پیکربندی
@ -361,6 +371,7 @@ npm run diagram:smoke-circuitikz -- --output-dir docs/export/circuitikz-smoke --
| `enableExperimentalDiagramPipeline` | `false` | تغییر بین الگوی اولویت‌دار و الگوی قدیمی Mermaid |
| `experimentalDiagramCompatibilityMode` | `'legacy-mermaid'` | `'legacy-mermaid'` فقط برابر با Mermaid است؛ `'best-fit'` برابر با هدف‌های بومی + راهکارهای جایگزین است |
| `preferredDiagramIntent` | `undefined` (خودکار) | بازنویسی خودکار تشخیص قصد |
| `preferredDiagramRenderTarget` | `undefined` (خودکار) | جایگزینی رندرر آرتیفکت، شامل Draw.io، Drawnix و Circuitikz |
| `summarizeToMermaidLanguage` | `'en'` | زبان هدف برای برچسب‌های نمودار |
| `summarizeToMermaidProvider` / `Model` | DeepSeek | LLM برای هر وظیفه برای تولید نمودار |
| `autoMermaidFixAfterGenerate` | (از ثابت‌ها) | اجرای خودکار ابزار تعمیر قدیمی بر روی خروجی Mermaid |
@ -380,10 +391,11 @@ npm run diagram:smoke-circuitikz -- --output-dir docs/export/circuitikz-smoke --
| عملیات | روش |
|--------|--------|
| صادرات با SVG | سازنده `mermaid.render()` / `vega.View.toSVG()` / SVG برای Canvas |
| صادرات به PNG | SVG → تصویر → Canvas (نسبت پیکسل دستگاه ۱x-۳x) → ArrayBuffer PNG |
| صادرات به فرمت PNG | SVG → تصویر → Canvas / رسترایزر نمایشی با PPI تنظیم‌شده → آرایه داده‌های PNG |
| صادرات به فرمت PDF | SVG → تصویر رستری با PPI تنظیم‌شده → PDF تک‌صفحه‌ای |
| ذخیره منبع | محتوای آثار خام با پسوند مخصوص هدف ذخیره می‌شود |
| پیش‌نمایش فقط منبع | آثار غیرinline همراه با محتوای منبع به صورت کد و همراه با تشخیصات نمایش داده می‌شوند، بدون رندرینگ iframe |
| بازرسی معنایی | Mermaid، JSON Canvas، Vega-Lite و HTML/SVG قابل ویرایش که توسط `scripts/diagram-semantic-verification.js` بررسی می‌شود |
| بازرسی معنایی | استفاده از Mermaid، JSON Canvas، Vega-Lite، HTML/SVG قابل ویرایش، Draw.io، Drawnix و circuitikz با محدودیت‌ها توسط فایل `scripts/diagram-semantic-verification.js` همراه با تست‌های رندرر/CLI بررسی می‌شوند |
**کش‌سازی**: RenderCache از کلید مشخص JSON مربوط به `{spec, target, theme}` استفاده می‌کند. حذف تکرار در حین پردازش، پردازش‌های مکرر را جلوگیری می‌کند.

View file

@ -1,7 +1,7 @@
---
id: diagrams
title: "Diagrammit"
description: "Luo Mermaid-, JSON Canvas-, Vega-Lite-, HTML-ja muokattavat kuvat sekä tulevaisuudessa rajoitettuja circuitikz-diagrammeja sinun märkintöistä käyttäen spec-first-arkkitehtuuria"
description: "Luo Mermaid-, JSON Canvas-, Vega-Lite-, HTML-, muokattavia kuvatoimintoja, Draw.io-, Drawnix- ja rajoitettuja circuitikz-diagrammea sinun merkintöistä käyttäen spec-first -arkitehtuuria"
author:
'@id': 'https://jacobinwwey.github.io/obsidian-NotEMD/#person-jacobinwwey'
keywords: [diagrams, mermaid, vega-lite, canvas, visualization, spec-first, drawio, drawnix, editable svg, circuitikz, TikZJax]
@ -18,7 +18,7 @@ import TLDR from '@site/src/components/TLDR';
# Diagrammit
<TLDR>
**Notemd luoo diagrammit sinun märkintöistä spec-first-pipelinein kautta.** LLM tuottaa renderer-agnostisen `DiagramSpec` JSON, jota sitten erilliset adapterit muuntavat Mermaid-, JSON Canvas-, Vega-Lite-, HTML- tai muokattaviksi HTML/SVG-luottolukujenä. Tuo tukea 8 tarkoituustyyppille, automaattisiin varausketjuihin, live-preview-ohjelmiin SVG/PNG-luottolukujen ekspordilla, semantiseen verifikoihin sekä lokalisoidun tiedon perusteella laadituun luomiseen.
**Notemd luoo diagrammeja sinun merkintöistä spec-first -prosessin kautta.** LLM tuottaa renderer-erillisen `DiagramSpec`-JSON-koodin, jota sitten erikoisadapterit muuntavat Mermaid-, JSON Canvas-, Vega-Lite-, HTML-, muokattaviksi HTML/SVG-, Draw.io-, Drawnix- tai rajoitettujen circuitikz-luottolukujenä. Tuo tukea 9 tarkoituustyyppiä, automaattisia varauksellisia ketjuja, live-previewia SVG/PNG/PDF-ekspordin kanssa, semantistista verkkointia sekä lokalisoidun tiedon perusteella laadittua generointia.
</TLDR>
Tämä kuuluu [Obsidian AI-tietojen hallintasuunnitelmaan](/docs/pillar-ai-knowledge).
@ -54,6 +54,7 @@ graph LR
| `stateDiagram` | Mermaid | HTML | Oloskemmat, elinkaupalliset mallit |
| `canvasMap` | JSON Canvas | Mermaid → HTML | Aikakartat, tietojen graafit |
| `dataChart` | Vega-Lite | Mermaid → HTML | Säve-, rea-, alue-, hajutus-, pirukka- ja tabelmallit |
| `circuit` | circuitikz | ei | Rajoitettut circuitikz-diagramme valvottuista `CircuitSpec`-lukujista |
## Tarkoituksen tunnistaminen
@ -67,6 +68,7 @@ Notemd arvioi sinun merkinnän sisältöä käyttäen avainasanojen arvoituksia
| `stateDiagram` | Olosuhteet, siirto, poistoehto, käynnissä, epäonnistunut (3+ sopimukset) | 0.76 |
| `flowchart` | Numeroituja vaiheita (2+) tai if/then/else/töövoima-sanovalikoima | 0.74 |
| `canvasMap` | Kontseptikartta, tietojen grafiikki, sijaintipohainen, klusteri | 0.72 |
| `circuit` | circuitikz, TikZJax, circuit, schematic, CMOS, NMOS, PMOS, MOSFET, VDD/GND, `vin`/`vout` | 0.78 |
| `mindmap` | Vaikkaista vaihtoehto | 0.55 |
Päästä üle **Ehdotettu diagrammityypi**-asetuksella, vasemariban valintaydinnolla tai selkeän käskupalvelun valikolla.
@ -80,10 +82,9 @@ Eksperimentaali spec-first-pipelineillä on nyt kaksi erillistä kontrollointa:
| Ehdotettu diagrammityypi | `preferredDiagramIntent` | Ohjaa genereeritun `DiagramSpec` semantista muotoa |
| Ehdotettu render-targetti | `preferredDiagramRenderTarget` | Valitsee artefaktin renderoinnin välineen **Generate diagram**- ja **Preview diagram**-toimintoille |
Määri **Ehdotettu render-targetti** arvoksi **Auto** suunnittelijan vaihtoehtoina, tai valitse selkeästi Mermaid, JSON Canvas, Vega-Lite, HTML tai Editable HTML/SVG. Ülekirjautuminen soveltuu vain artefakti- ja näytökäskyn toimintoille. Standardinen **Summarise as Mermaid diagram**-käsky jääb kiinnitettuun Mermaid-sovelluville väljöön, jotta olemasolevat Markdown-töyhkeudet ei vaihtoehtoisesti muutetaan muotoja.
Tämä erottelu on tärkeää, koska `flowchart`-tarkoitus voi nyt renderoida Mermaid Markdown-merkkikirjoituksille, HTML vahvalle vaikkaistuvalle vaihtoehtoiseen muotoon tai Editable HTML/SVG seuraavalle muokkaamiseen. Draw.io ja Drawnix jäävät CLI-artefakttien eksportijiksi, eikä pluginin sisällä oleviin render-targetteihin.
Aseta **Preferred render target** arvoon **Auto**, jotta se toimii suunnittelijan vaihtoehtona, tai valitse suoraan Mermaid, JSON Canvas, Vega-Lite, HTML, Editable HTML/SVG, Draw.io, Drawnix tai Circuitikz. Tämä päällepano soveltuu vain artikkelinluomis- ja preview-komentoille. Standardinen **Summarise as Mermaid diagram**-komento jää mermaid-tuettavaan välittöön, jotta olemassaolevat Markdown-työprosessit eivät vaihtoehtoisesti muuttu suoraa muotoa.
Tämä erottelu on tärkeää, koska `flowchart`-tarkoituksen voi nyt renderoida Mermaid-formaattina Markdown-merkintöille, HTML-formaattina vahvaa varaukselua varten, muokattaviksi HTML/SVG-formaattina seuravaan muokkaamiseen tai Draw.io/Drawnix-lähteetekstinain SVG-arviointituloksina. `circuit`-tarkoituus suunnitetaan Circuitikz:ään ja vaatii valvottua `CircuitSpec`; se ei ole pyyntö suvaliseen TikZ-textiin.
## Käyttö
### Generate a Diagram
@ -101,16 +102,21 @@ Tämä erottelu on tärkeää, koska `flowchart`-tarkoitus voi nyt renderoida Me
| Vega-Lite | `.json` | `{note}_diagram.json` |
| HTML | `.html` | `{note}_diagram.html` |
| Muokattavat HTML/SVG | `.html` | `{note}_diagram.html` |
| Draw.io | `.drawio` + `.drawio.svg` + `.drawio.md` | `{note}_diagram.drawio` sekä sen arviointitulokset |
| Drawnix | `.drawnix` + `.drawnix.svg` + `.drawnix.md` | `{note}_diagram.drawnix` sekä sen arviointitulokset |
| Circuitikz | `.tex` + `.tex.svg` + `.tex.md` | `{note}_diagram.tex` sekä sen arviointitulokset |
### Diagrammin ennittäkset
1. Käytä **"Notemd: Edellistäkset diagrammaa"**
2. Modaalikokemus avautuu renderoidun diagrammin kanssa
3. Ekspordi SVG-ena tai PNG:en käyttäen työkalupalkkien painikkeita
3. Ekspordi SVG-, PNG- tai PDF-formaattina käyttäen työkalupalkkien painikkeita
**Automaattinen näyttöavainnin avautuminen** on saatavilla asetuksissa luomisen jälkeen näyttöavainnin modaalikokemus avautuu automaattisesti.
Edellistäkatselu-modaalikokemus sisältää myös artefakttien diagnostiikan-paneelin. Renderoinnin ohjelmistot ja suitsutestit voivat liittää `RenderArtifact.diagnostics`; modaalikokemus näyttää diagnostiikan yhteenvetoon, jossa on virheiden/hoihtoehtojen/tietojen määrät, sen jälkeen tärkeysaste, diagnostiikan tyyppi, sanoitus ja parannusvinkit edellistäkatselun kohdalla. Saman yhteenveton näet myös edellistäkatselun historian kirjoissa, mikä mahdollistaa kerran toisen circuitikz suitsutestin vertailun ilman kaiken kirjan avamista. Artefakttien puhul, jotka sisältävät lähtetekstia mutta ei voi renderoida suoraan tai HTML iframe-matkan kautta, modaalikokemus käyttää nyt vain lähtetekstin edellistäkatselua sijaan siitä, että sunnitaan tyhjä iframe. Tämä annaa circuitikz kompiloituksen/renderoinnin suitsutestille, SVG tekstitokenin tarkistuksille, PNG-tyhjän skennauksen tarkistuksille sekä tuleviin yhtepaluvierokkeuksiin näkyvän UI pinnan ilman siitä, että TikZJax tai LaTeX muuttuisi vaativaksi plugin-runktimen riippuvuudeksi tai ilmetellään, että lähteteksti on verifioitu visuaalinen renderointi.
PNG- ja PDF-preview-ekspordissa käytetään konfiguroitua preview PPI:aa. Perusarvo on 300 PPI, ja arvot yli 600 PPI piirritään 600:ksi. SVG-pyykät pysyvät vektorimuodossa. Lähteetekstit kuten `.drawio`, `.drawnix` ja `.tex` voivat tarjoaa `previewSvg`-tuloksen, jotta Obsidian voi näyttää ja ekspordia arvioidavia kuvia ilman diagram.net-, Drawnix-, LaTeX- tai TikZJax-sisältöjen sijoitusta pluginin toimintaan.
Eeläytöluokkalla on myös arteikkeiden diagnostiikan-paneeli. Renderoinnin ohjelmistot ja suitsutestit voivat liittää `RenderArtifact.diagnostics`; luokka näyttää diagnostiikan yhteenveton, jossa on virheiden/hoihtoehtojen/tietojen määrät, sen jälkeen tärkeysaste, diagnostiikan tyyppi, sanoitus sekä parannusvinkit eeläytön kohdalla. Sama yhteenveto näytetään myös diagnostiikan tukea tarjoavissa historiallisissa kirjoituksissa, mikä mahdollistaa kerran toisensa jälkeen tehtyjen circuitikz suitsutestien vertailun ilman kaiken kirjoituksen avamista. Arteikkeille, jotkilla on lähteeteksti mutta jotka eivät voi renderoida sisällä tai HTML-iframe-menetelmän kautta, luokka käyttää nyt vain lähteetekstin eeläytöä sijaan täysin tyhjän iframe:n käyttöä. Tämä annaa circuitikz-tilastointiprosesseille, SVG-textitoken-tarkistuksille, PNG-tyhjän ekranikuva-tarkistuksille, vain matkanpaikkojen perusteilla tehtäville yleisille raportteille sekä tuleviin raportteille näkyvän käyttöliittymän, ilman että TikZJax tai LaTeX tulisi pakolliseksi plugin-runktiman riippuvuudeksi tai ilman että lähteeteksti pidetään vahvistetuksi visuaalisena renderoinnuksena.
### Legacy Mermaid-režimi
@ -164,12 +170,12 @@ Tämä tavoite ei ole todistettavasti vaihtoehtoisen suunnittelun reitti vielä.
### Draw.io ja Drawnix eksporttoliittymät
Prahtinen toteutus säilyttää kolmannen osapuolen editorin tukea artefaktin rajalla:
Päivitetty toteutus säilyttää kolmannen osapuolen suorittimen tukea artefaktin rajoissa, samalla kun se jatkaa selkeiden renderointitavoitteiden paljastamista:
| Tavoite | Sopimus | Käytössä olevat riippuvuudet |
|--------|----------|--------------------|
| Draw.io | deterministinen, pakottamaton `mxfile` XML `SemanticFigureModel`-lta | ei pluginin käyttöajassa eikä CI:ssä |
| Drawnix | minimaalinen `.drawnix` JSON-alamosa, joka käyttää `geometry` ja `arrow-line`-elementtejä | ei pluginin käyttöajassa eikä CI:ssä |
| Draw.io | deterministinen, pakottamattompi `mxfile`-XML-tiedosto `SemanticFigureModel`-lta, sekä SVG/PNG/PDF-arviointitulokset | ei mitään pluginin toimintaa eikä CI:ssä |
| Drawnix | minimistinen `.drawnix`-JSON-alamosa, joka käyttää `geometry`- ja `arrow-line`-elementtejä, sekä SVG/PNG/PDF-arviointitulokset | ei mitään pluginin toimintaa eikä CI:ssä |
Tasapaino on tahtevasti valittu: Notemd voi vahvistaa näkyviä siltiä, stabiileja ID:itä ja tuettua primitiivien kattavuutta ilman diagram.net Desktop-, Drawnix-, Plait- tai ainult selaimen editorin tilan sisällyttämistä pluginiin.
@ -213,7 +219,11 @@ Notemd sisältää nyt ensimmäisen rajoitettun repositoorion prototyyppin täss
npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-inverter.tex
```
Prototyyppi lisää erillisen `CircuitSpec`rajan ja deterministisen eksportoinnin kuudeen kuldiseen viitekehdoon kuuluville perheille:
Prototyyppi lisää rajoitettuun `CircuitSpec`-rajoitteeseen sekä deterministisen eksportoinnin kuudeen kultaisen referenssiperheeseen:
Eksperimentaalisessa diagrammin tuotantopisteessä on tämä nyt myös saatavilla `intent: "circuit"`-mallin ja renderointitavoitteen `circuitikz` kautta. Luodut `DiagramSpec`-tiedostot voivat sisältää `circuitSpec`-tietoja vain circuit-intentin tilanteissa. `CircuitikzRenderer` kirjoittaa saman deterministisen `.tex`-lähteetekstin ja liittää sihi SVG-arkkitehtuurin perusteella luodun arviointituloksen, mikä mahdollistaa Obsidianin arviointin sekä SVG/PNG/PDF-exportin. Tämä arviointitulokset ei ole LaTeX/TikZJax-kompilaation tuloksia; todelliset renderoinnin tukijät ovat edelleen alla olevissa selkeissä komentoissa.
Suportoiduissa kultaisissa mallissa `layoutHints.inputSide` ja `layoutHints.outputSide` jäävät vain esittelytarkoituksellisiin kontrolloihin. Ne voivat siirtää deterministisen sisään-/uloskirjautumisportin sijainnin, mutta ne eivät muuttaa arkkitehtuurin merkintää eikä mahdollista parannusprosessia, jolla voit uudelleen suunnittela circuitin.
| Välinvaihto tyyppi | Kuldinen viite | Virtan varmistus |
|--------------|------------------|-------------------|
@ -224,7 +234,7 @@ Prototyyppi lisää erillisen `CircuitSpec`rajan ja deterministisen eksportoi
| `cmos-nand2` | `cmos-nand2-v1` | Valvostaa parallellisen PMOS-tahteen, järjestäyksen NMOS-tahteen, kahden sisäänkirjautumisen `va` / `vb` sekä `vout` ennen LaTeX-lukemista |
| `cmos-nor2` | `cmos-nor2-v1` | Valvostaa sarjan PMOS-pull-up-, parallellisen NMOS-pull-down-, kahden sisäänkirjautumisen `va` / `vb`- ja `vout`-toiminnan ennen LaTeX-lukemista |
Tämä ei ole vielä yleinen TikZ-luomistin verkko. Se ei kompiloita LaTeXia, kutsua TikZJax, tarkista ekraanikuvausia eikä käynnistä automaattista kuvatilastusparannusta. Ne ovat edelleen tulevien vaiheiden osa.
Tämä ei ole yleinen TikZ-generaatiotiimi. Se ei vastaa suvalisia TikZ-koodia, kompiloita LaTeXia, käyttää TikZJaxia, tarkistaa skennauksia pluginin toimintaa aikana eikä käynnistä automatisoidua kuvatulostusparannusta. Ne toimenpiteet ovat edelleen tulevissa vaiheissa.
Preview-diagrammi-komento voi uudelleen avata salattuja circuitikz lähteetekstejä suoraan, kun tiedoston laajennus on `.tex` tai `.tikz` ja lähteessä on `\usepackage{circuitikz}` tai `\begin{circuitikz}`. Tämä menetelmä on circuitikz vain lähteestä perustuva näyttö: modaalikenttä näyttää lähteetekstin, diagnostiikan, kopioi-/salaa-ohjeiden sekä historian meta-tietoja, mutta se ei kompiloita LaTeXia eikä kutsua TikZJax pluginin toimintaa aikana.
@ -350,8 +360,8 @@ CMOS-inverterin tapauksessa promptin tulisi pyytää selkeää topologian sekä
|------|----------------|-----------|
| Yleiset diagrammit | Spec-first-pipeline on käytössä Mermaid, JSON Canvas, Vega-Lite, HTML:lle | Jatka semantisen verifikoinnin kattavuuden laajentamista |
| Muokattavat kuvat | `editable-html-svg`, Draw.io XML ja Drawnix JSON artefaktien rajat on rakennettu | Lisäydy suurempia primitiivejä vain kun testit osoittavat muokattavuutta |
| CLI-tuke | `npm run diagram:export-artifact` eksportoi muokattavat HTML/SVG, Draw.io ja Drawnix yhdestä `DiagramSpec`:stä | Lisäytyvät tarkoitukselle suunniteltu suitsutuskomponentit uusien tarkoituksien toimituksessa |
| circuitikz | `CircuitSpec -> circuitikz` prototyyppi eksportoi yleiset lähteet, CMOS-inverterin, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1` sekä `cmos-nor2` / `cmos-nor2-v1` kultaiset mallit, projektit `layoutHints.inputSide` ja `layoutHints.outputSide` deterministiseen sisään-/ulospordiporttien paikannukseen ilman topologian muuttamista, hylkää parannustopologian vuorovaikutuksen `--topology-reference` kautta, lähettää topologian säilyttävät parannusraportit `--repair-brief-output` ja schema `notemd.circuitikz.repair-brief.v1` kautta, sisältää strukturoituja `repairPrompt` siirtoaineita `diagnosticFocus`, `acceptanceCriteria` sekä roolin `topology-preserving-circuitikz-repair` kautta, valvostaa parannuskandidaateja `--repair-brief` kautta, lähettää `repairAcceptance` porttien tukijohdat schema `notemd.circuitikz.repair-acceptance.v1` kautta `readyForVisualAcceptance` ja `remainingChecks` kautta, säilyttää ne tukijohdat `--repair-acceptance-output` kautta, analysoi kompilauslogit, voi käyttää erillisiä lokalisoiduja renderointilaitteita plus `--expected-artifact`, SVG `--expected-svg-text`, pääsykehityksen meta-tietojen kontrollit `aria-label`, `<title>` sekä `<desc>` kautta, peittetyjen/tansparenttien SVG elementtien poistaminen, `render-svg-text-path-only` / `pathOnlyGlyphUseCount` klassifiointi vain radan merkintöille, radan merkintöjen glyfien paikannuskontrollit `<use href="#...">` kautta, radan merkintöjen glyfien yhteyden diagnostiikat `render-svg-path-glyph-overlap` kautta, suoravan radan virtauspunktin hallinta `Z/z` kautta, täysi kaareen rajoitteet A/a kaareiden äärimille, täysi Bezier-käveiden rajoitteet C/S/Q/T käveiden äärimille, värvipaksuun perustuvat SVG rajoitteet ja merkintöjen yhteyden kontrollit, `polyline` / `polygon` maalintogeometrian kontrollit, sijoitettu `tspan` merkintögeometria, `text-anchor`-tietoiset sijoitettut tekstigeometriat, transformaatio-tietoiset geometriat SVG piirrittyyn taustalle/textin yhteyden sekä merkintöjen vs maalinton suitsutuskontrolloihin `render-svg-label-overlap` kautta, sekä PNG:n ei-tyhjä / kärjitty / tihe-foreground -skennaus suitsutuskontrollit, sisältäen indeksoidun värvipaletan alfan, hallitusvärin/RGB tRNS transparent -esimerkkejä sekä muodokohdastaatuvia `render-png-unsupported` ohjeita Adam7 interlaced PNG:ille ja indeksoiduun bit-pituuden virheille, `foregroundBounds`, `foregroundDensity`, `render-png-content-clipped` sekä `render-png-foreground-dense` kautta ilman shell-analyysiä, sisältää yhteenvetollisia hoitajan suitsutuskomponentteja `npm run diagram:smoke-circuitikz` kautta, tallentaa puuttuvat renderointilaitteiden konfiguroinnin `rendererAvailability.status: "missing-configuration"` ja `compile-executable-invalid` kautta, sekä sisältää yleisiä esittelydiagnostiikoita, diagnostiikan yhteenvetotuloksia, diagnostiikan tietoisia historiallisia kirjoituksia sekä lähtötekstin ainoastaan varauksen `RenderArtifact.diagnostics` sekä esittelymodaalin kautta | Lisäytyy OCR-tasolla merkintöiden tunnistaminen vain radan visuaalisille tekstille, tarkat pikselitasolla yhteydenkontrollit, laajempi SVG radan katto tarpeen mukaan, automaattinen renderointilaitteen asentaminen/tunnistaminen vain siinä tapauksessa, kun se voi jää valintaan, sekä automaattinen topologian säilyttävän parannusprosessin käyttö |
| CLI-tukea | `npm run diagram:export-artifact` eksportoi muokattavat HTML/SVG-, Draw.io-, Drawnix-, Circuitikz- ja SVG/PNG/PDF-arviointitodot yhdestä valvottuasta `DiagramSpec`-tulostuksesta | Uusien tavoitteiden tulostuksessa lisätään tavoitteelle specificoituja test-konfiguraatioita |
| circuitikz | `DiagramSpec(intent: "circuit", circuitSpec) -> CircuitikzRenderer -> circuitikz` eksportoi yleiset lähteet, CMOS-inverterit, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1` ja `cmos-nor2` / `cmos-nor2-v1` kultatemplaatit, paljastaa UI-tarkoitukset/tulostus-tavoitteet, kirjoittaa TeX-tekstin sekä SVG/PNG/PDF-ennusteet, valvoo topologian ennen tulostusta, analysoi kompiloinkirjoja, voi käyttää erillisiä lokalisoiduja renderointilaitteita sekä `--expected-artifact`-parametria, ja säilyttää vain lähteekoodin varapalautteen sekä ennusteiden diagnostikan `RenderArtifact.diagnostics`-kanavan ja ennuste-modaalina | Lisätään OCR-tasolla siltien tunnistus vain radat sisältävälle visuaaliselle tekstille, tarkat pikselitasolla yhteyksentekijän kontrollit, laajempi SVG-radatunnuksien kattavuus tarpeen mukaan, automaattinen renderointilaitteiden asentaminen/tunnistaminen vain siinä tapauksessa, kun ne voivat jää valintaan, sekä automaattinen topologian säilyttävä parannusprosessi |
| TikZJax yhdistelmä | Kandidaattinen renderointihostaus Obsidian-puolen näytökselle | Säilyttäkää se valintaan; älä tee TikZJax pakolliseksi plugin-runktimen riippuvuudeksi |
## Konfigurointi
@ -361,6 +371,7 @@ CMOS-inverterin tapauksessa promptin tulisi pyytää selkeää topologian sekä
| `enableExperimentalDiagramPipeline` | `false` | Vaihtoehto spec-first ja vanhaa Mermaid välillä |
| `experimentalDiagramCompatibilityMode` | `'legacy-mermaid'` | `'legacy-mermaid'` = Mermaid vain; `'best-fit'` = perus tarkoitukset + varaukset |
| `preferredDiagramIntent` | `undefined` (auto) | Ylöntaa automaattinen tarkoituksen tunnistus |
| `preferredDiagramRenderTarget` | `undefined` (auto) | Arteffaktin renderoinnin asettaminen uudelleen, mukaan lukien Draw.io, Drawnix ja Circuitikz |
| `summarizeToMermaidLanguage` | `'en'` | Diagrammin merkintöjen tarkoituskieli |
| `summarizeToMermaidProvider` / `Model` | DeepSeek | Tehtävän mukaainen LLM diagrammin luomiseen |
| `autoMermaidFixAfterGenerate` | (konstanttien väliltä) | Auto-käytä vanha parannuslaitteet Mermaid tuloksilla |
@ -380,10 +391,11 @@ Aktivoituessa Notemd ottaa käyttöön relevante kontekstikatkaukset sinun vault
| Toimenpide | Metodit |
|--------|--------|
| SVG export | `mermaid.render()` / `vega.View.toSVG()` / SVG builder for Canvas |
| PNGeksportointi | SVG → Image → Canvas (device pixel ratio 1x-3x) → PNG ArrayBuffer |
| PNG-luottaminen | SVG → Kuvaa → Canvas tai etukatselu-rasterointi määritetyllä PPI:llä → PNG ArrayBuffer |
| PDF-luottaminen | SVG → rasterikuvaa määritetyllä PPI:llä → yhden sivun PDF |
| Lähteetiedon salaus | Raaka artefaktin sisältö salataan tavoitteekohdan mukaisella laajennuksella |
| Ainoastaan lähteetiedon eeläkkaus | Eiinline artefaktit, joissa näytetään lähteetiedon sisältö koodina sekä diagnostiikkaa, ilman iframetulkintaa |
| Semantinen audit | Mermaid, JSON Canvas, Vega-Lite ja muokattavaa HTML/SVG, jota kontrolloi `scripts/diagram-semantic-verification.js` |
| Semantinen auditointi | Mermaid, JSON Canvas, Vega-Lite, muokattavat HTML/SVG, Draw.io, Drawnix sekä rajoitettu Circuitikz perustuvat tiedostoon `scripts/diagram-semantic-verification.js` sekä renderoinnin/CLI-testeihin |
**Caching**: RenderCache käyttää `{spec, target, theme}` deterministista JSON-avaintia. Matkan aikana toimiva duplikaatiointi estää kaksinkertaiset renderoinnut.

View file

@ -1,7 +1,7 @@
---
id: diagrams
title: Diagrammes
description: Générer Mermaid, JSON Canvas, Vega-Lite, HTML, des artefacts de figures modifiables, ainsi que des diagrammes circuitikz futurs restreints, à partir de vos notes en utilisant une architecture basée sur des spécifications en premier lieu
description: "Générer des diagrammes Mermaid, JSON Canvas, Vega-Lite, HTML, des artefacts dimages modifiables, Draw.io, Drawnix ainsi que des diagrammes circuitikz restreints à partir de vos notes, en utilisant une architecture axée sur les spécifications."
author:
'@id': 'https://jacobinwwey.github.io/obsidian-NotEMD/#person-jacobinwwey'
keywords: [diagrams, mermaid, vega-lite, canvas, visualization, spec-first, drawio, drawnix, editable svg, circuitikz, TikZJax]
@ -18,7 +18,7 @@ import TLDR from '@site/src/components/TLDR';
# Diagrammes
<TLDR>
**Notemd génère des diagrammes à partir de vos notes grâce à un processus basé sur des spécifications en premier lieu.** Le LLM crée un `DiagramSpec` JSON indépendant du rendeur, que des adaptateurs spécialisés transforment ensuite en formats Mermaid, JSON Canvas, Vega-Lite, HTML, ou en fichiers modifiables au format HTML/SVG. Il prend en charge 8 types dintention, des chaînes de fallback automatiques, une prévisualisation en temps réel avec export en SVG/PNG, une vérification sémantique, ainsi quune génération enrichie par des connaissances locales.
**Notemd génère des diagrammes à partir de vos notes grâce à un pipeline basé sur des spécifications.** LLLM produit un fichier JSON `DiagramSpec` indépendant du moteur de rendu, puis des adaptateurs dédiés le traduisent en formats Mermaid, JSON Canvas, Vega-Lite, HTML, HTML/SVG modifiables, Draw.io, Drawnix ou diagrammes circuitikz restreints. Il prend en charge 9 types dintention, des chaînes de fallback automatiques, une prévisualisation en temps réel avec export en SVG/PNG/PDF, une vérification sémantique et une génération enrichie par des connaissances locales.
</TLDR>
Ceci fait partie du [Obsidian Guide de gestion des connaissances IA](/docs/pillar-ai-knowledge).
@ -54,6 +54,7 @@ graph LR
| `stateDiagram` | Mermaid | HTML | Machines à états, modèles de cycle de vie |
| `canvasMap` | JSON Canvas | Mermaid → HTML | Cartes conceptuelles, graphes de connaissances |
| `dataChart` | Vega-Lite | Mermaid → HTML | Barre, ligne, zone, dispersion, cercle, tableaux |
| `circuit` | circuitikz | none | Diagrammes circuitikz restreints à partir de charges utiles `CircuitSpec` validées |
## Détection dintention
@ -67,6 +68,7 @@ Notemd détermine le meilleur type de diagramme à partir du contenu de votre no
| `stateDiagram` | État, transition, en attente, en cours, échec (3+ correspondances) | 0.76 |
| `flowchart` | Étapes numérotées (2+) ou vocabulaire if/then/else/workflow | 0.74 |
| `canvasMap` | Carte conceptuelle, graphe de connaissances, spatial, cluster | 0.72 |
| `circuit` | circuitikz, TikZJax, circuit, schematic, CMOS, NMOS, PMOS, MOSFET, VDD/GND, `vin`/`vout` | 0.78 |
| `mindmap` | Solution de secours par défaut | 0.55 |
Surmonter cela en utilisant la configuration **Preferred diagram type**, le sélecteur de barre latérale, ou une option explicite de palette de commandes.
@ -75,15 +77,9 @@ Surmonter cela en utilisant la configuration **Preferred diagram type**, le sél
Le pipeline expérimental basé sur les spécifications dispose désormais de deux contrôles indépendants :
| Contrôle | Configuration | Appliquer |
|---------|---------|--------|
| Type de diagramme préféré | `preferredDiagramIntent` | Guide la forme sémantique du `DiagramSpec` généré |
| Cible de rendu préférée | `preferredDiagramRenderTarget` | Choisit le rendeur dartefact pour **Générer le diagramme** et **Aperçu du diagramme** |
Définissez **Preferred render target** sur **Auto** comme valeur par défaut pour le planificateur, ou choisissez explicitement Mermaid, JSON Canvas, Vega-Lite, HTML, ou Editable HTML/SVG. Cette modification ne sapplique quaux commandes dartefact et davant-première. La commande standard **Summarise as Mermaid diagram** reste liée à une sortie compatible avec Mermaid afin que les workflows Markdown existants ne changent pas silencieusement de format.
Cette séparation est importante car une intention `flowchart` peut désormais être affichée sous forme de Mermaid pour les notes Markdown, de HTML pour un mécanisme de fallback fiable, ou sous forme déléments éditables HTML/SVG pour une modification ultérieure. Draw.io et Drawnix restent des exportateurs dartefacts CLI plutôt que des cibles daffichage au sein du plugin.
Définissez **Preferred render target** sur **Auto** pour la valeur par défaut du planificateur, ou choisissez explicitement Mermaid, JSON Canvas, Vega-Lite, HTML, Editable HTML/SVG, Draw.io, Drawnix ou Circuitikz. Cette modification ne sapplique quaux commandes dartefact et de prévisualisation. La commande standard **Summarise as Mermaid diagram** reste configurée pour un format compatible Mermaid afin que les workflows Markdown existants ne changent pas silencieusement de format.
Cette séparation est importante car une intention `flowchart` peut désormais être rendue en Mermaid pour les notes Markdown, en HTML pour un fallback fiable, en Editable HTML/SVG pour une édition ultérieure, ou sous forme dartefacts sources Draw.io/Drawnix accompagnés dimages SVG à examiner. Une intention `circuit` redirige vers Circuitikz et exige une charge utile `CircuitSpec` validée ; il ne sagit pas dune demande de texte TikZ arbitraire.
## Utilisation
### Générer un diagramme
@ -101,16 +97,21 @@ Cette séparation est importante car une intention `flowchart` peut désormais
| Vega-Lite | `.json` | `{note}_diagram.json` |
| HTML | `.html` | `{note}_diagram.html` |
| Éditable HTML/SVG | `.html` | `{note}_diagram.html` |
| Draw.io | `.drawio` + `.drawio.svg` + `.drawio.md` | `{note}_diagram.drawio` ainsi que des fichiers daccompagnement pour la revue |
| Drawnix | `.drawnix` + `.drawnix.svg` + `.drawnix.md` | `{note}_diagram.drawnix` ainsi que des fichiers daccompagnement pour la revue |
| Circuitikz | `.tex` + `.tex.svg` + `.tex.md` | `{note}_diagram.tex` ainsi que des fichiers daccompagnement pour la revue |
### Aperçu dun diagramme
1. Exécutez **"Notemd: Aperçu du diagramme"**
2. Une boîte modale souvre avec le diagramme affiché
3. Exporter en SVG ou en PNG à laide des boutons de la barre doutils
3. Exportez en SVG, PNG ou PDF à laide des boutons de la barre doutils
L**ouverture automatique de la prévisualisation** est disponible dans les paramètres : après génération, le mode prévisualisation souvre automatiquement.
Le modal de prévisualisation dispose également dun panneau de diagnostic des artefacts. Les générateurs et les tests de fonctionnement peuvent associer `RenderArtifact.diagnostics` ; le modal affiche un résumé diagnostique avec le nombre derreurs, davertissements et dinformations, suivi du niveau de gravité, du type de diagnostic, du message et de conseils de correction à côté de la prévisualisation. Le même résumé est affiché dans les entrées de lhistorique des prévisualisations, ce qui permet de comparer des tentatives répétées de test circuitikz sans avoir à ouvrir chaque entrée. Pour les artefacts qui possèdent du contenu source mais ne peuvent pas être affichés en ligne ou via le chemin iframe HTML, le modal passe désormais à une prévisualisation uniquement basée sur le source au lieu dimposer un iframe vide. Cela permet aux tests de compilation/génération circuitikz, aux vérifications des tokens de texte SVG, aux vérifications des captures décran PNG vides et aux rapports de chevauchement futurs davoir une surface visible UI, sans faire de TikZJax ou de LaTeX une dépendance obligatoire en temps de exécution du plugin ni en prétendant que le texte source est une représentation visuelle vérifiée.
Lexport en prévisualisation en PNG et PDF utilise le PPI de prévisualisation configuré. La valeur par défaut est de 300 PPI, et les valeurs supérieures à 600 PPI sont limitées à 600. Les fichiers SVG conservent leur taille vectorielle. Les artefacts sources tels que `.drawio`, `.drawnix` et `.tex` peuvent fournir un fichier `previewSvg` daccompagnement, permettant à Obsidian dafficher et dexporter des images révisables sans intégrer circuitikz.net, Drawnix, LaTeX ou TikZJax lors du fonctionnement du plugin.
Le volet daperçu dispose également dun panneau de diagnostics des artefacts. Les générateurs daffichage et les tests de fonctionnement peuvent ajouter la clé `RenderArtifact.diagnostics` ; le volet affiche ensuite un résumé des diagnostics indiquant le nombre derreurs, davertissements et dinformations, ainsi que leur gravité, le type de diagnostic, le message correspondant et des conseils de correction à côté de laperçu. Ce même résumé est affiché dans les entrées dhistorique prenant en compte les diagnostics, ce qui permet de comparer plusieurs tentatives de test de fonctionnement avec circuitikz sans avoir à ouvrir chaque entrée individuellement. Pour les artefacts qui possèdent du contenu source mais ne peuvent pas être affichés en ligne ou via le chemin iframe HTML, le volet passe désormais par un aperçu basé uniquement sur le contenu source, au lieu dimposer un iframe vide. Cela offre aux tests de compilation/génération de circuitikz, aux vérifications des tokens de texte SVG, aux vérifications décran capturé PNG vierge, aux rapports de chevauchement de glyphes basés uniquement sur les chemins, ainsi quaux futurs rapports de chevauchement, une interface utilisateur visible, sans imposer TikZJax ou LaTeX comme dépendance obligatoire en temps de exécution du plugin, ni prétendre que le texte source est déjà une représentation visuelle vérifiée.
### Mode Legacy Mermaid
@ -164,12 +165,12 @@ Cible qui nest pas intentionnellement la route par défaut du planificateur p
### Draw.io et Drawnix Exporter les limites
La mise en œuvre actuelle maintient le support des éditeurs tiers à la frontière de lartefact :
La mise en œuvre actuelle maintient le support des éditeurs tiers à la frontière de lartefact tout en exposant des cibles de rendu explicites :
| Cible | Contrat | Dépendance en temps de exécution |
|--------|----------|--------------------|
| Draw.io | déterministe non compressé `mxfile` XML depuis `SemanticFigureModel` | Aucun problème en temps de exécution du plugin ou dans CI |
| Drawnix | sous-ensemble minimal `.drawnix` JSON utilisant les éléments `geometry` et `arrow-line` | Aucun problème en temps de exécution du plugin ou dans CI |
| Draw.io | XML `mxfile` déterministe et non compressé issu de `SemanticFigureModel`, ainsi que des fichiers de visualisation SVG/PNG/PDF | Aucun élément dans le temps dexécution du plugin ni lors du CI |
| Drawnix | Sous-ensemble minimal de JSON `.drawnix` utilisant les éléments `geometry` et `arrow-line`, ainsi que des fichiers de visualisation SVG/PNG/PDF | Aucun élément dans le temps dexécution du plugin ni lors du CI |
Le compromis est délibéré : Notemd peut vérifier les étiquettes visibles, les identifiants stables et la couverture des primitives prises en charge sans intégrer Diagrams.net Desktop, Drawnix, Plait ou létat de léditeur uniquement basé sur le navigateur dans le plugin.
@ -213,7 +214,11 @@ Notemd inclut désormais le premier prototype de répertoire contraint pour cett
npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-inverter.tex
```
Le prototype ajoute une frontière `CircuitSpec` distincte ainsi quun exporteur déterministe pour six familles de références dor :
Le prototype ajoute une frontière `CircuitSpec` contrainte ainsi quun exporteur déterministe pour six familles de référence standard :
Dans le pipeline de diagrammes expérimental, il est désormais également accessible via `intent: "circuit"` et la cible de rendu `circuitikz`. Le `DiagramSpec` généré ne peut intégrer un `circuitSpec` que pour une intention de type circuit. `CircuitikzRenderer` écrit la même source `.tex` déterministe et ajoute un fichier de prévisualisation SVG dérivé de cette topologie de circuit validée, ce qui permet une prévisualisation dans Obsidian ainsi quune exportation en SVG/PNG/PDF. Ce fichier de prévisualisation nest pas le résultat dune compilation LaTeX/TikZJax ; les preuves réelles issues du rendu proviennent toujours des commandes spécifiques indiquées ci-dessous.
Pour les modèles standards pris en charge, `layoutHints.inputSide` et `layoutHints.outputSide` restent des contrôles uniquement destinés à la présentation. Ils permettent de déplacer de manière déterministe lemplacement des ports dentrée/sortie, mais ils ne modifient pas la signature de la topologie ni ne permettent une étape de correction pour réorganiser le circuit.
| Type de circuit | Référence dorée | Garantie actuelle |
|--------------|------------------|-------------------|
@ -224,7 +229,7 @@ Le prototype ajoute une frontière `CircuitSpec` distincte ainsi quun exporte
| `cmos-nand2` | `cmos-nand2-v1` | Vérifie le tirage vers le haut parallèle avec PMOS, le tirage vers le bas en série avec NMOS, les deux entrées `va` / `vb`, ainsi que `vout` avant décrire du LaTeX |
| `cmos-nor2` | `cmos-nor2-v1` | Vérifie la série de tirage vers le haut PMOS, le tirage vers le bas en parallèle NMOS, les deux entrées `va` / `vb`, ainsi que `vout` avant décrire du LaTeX |
Ce nest pas encore un générateur TikZ général. Il ne compile pas LaTeX, nappelle pas TikZJax, ninspecte pas les captures décran, et ne met pas en œuvre de réparation automatique basée sur les retours dimage. Ce sont des étapes à venir.
Il ne sagit pas dun générateur TikZ général. Il ne prend pas en charge du TikZ arbitraire, ne compile pas LaTeX, nappelle pas TikZJax, ne consulte pas décrans daffichage pendant le temps dexécution du plugin, et ne met pas en œuvre de correction automatique basée sur des retours dimage. Ces fonctionnalités restent des étapes ultérieures.
La commande Diagramme davant-visualisation peut rouvrir directement les artefacts sources enregistrés circuitikz lorsque lextension de fichier est `.tex` ou `.tikz` et que le code source contient `\usepackage{circuitikz}` ou `\begin{circuitikz}`. Cette méthode constitue une prévisualisation uniquement basée sur le source circuitikz : la fenêtre modale affiche le code source, les diagnostics, les contrôles de copie/enregistrement ainsi que les métadonnées dhistorique, mais elle ne compile pas LaTeX ni nappelle TikZJax pendant lexécution du plugin.
@ -350,8 +355,8 @@ Pour un inverseur CMOS, la demande doit préciser la topologie ainsi que les con
|------|----------------|-----------|
| Diagrammes généraux | Pipeline basé sur les spécifications mis en œuvre pour Mermaid, JSON Canvas, Vega-Lite, HTML | Continuer à étendre la couverture de la vérification sémantique |
| Figures modifiables | Les limites des artefacts `editable-html-svg`, Draw.io XML, ainsi que Drawnix JSON ont été mises en œuvre | Ajoutez des primitives plus riches uniquement après que les tests aient prouvé léditabilité |
| Support CLI | `npm run diagram:export-artifact` exporte des fichiers HTML/SVG, Draw.io et Drawnix modifiables depuis un `DiagramSpec` | Ajouter des dispositifs de fumée spécifiques aux cibles lors du déploiement de nouvelles cibles |
| circuitikz | `CircuitSpec -> circuitikz` prototype exporte des modèles dor pour des sources communes, des inverseurs CMOS, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1`, et `cmos-nor2` / `cmos-nor2-v1`, des projets `layoutHints.inputSide` et `layoutHints.outputSide` permettant une disposition déterministe des ports dentrée/sortie sans modifier la topologie, rejette les écarts de topologie lors des réparations grâce à `--topology-reference`, génère des rapports de réparation préservant la topologie via `--repair-brief-output` et le schéma `notemd.circuitikz.repair-brief.v1`, inclut du contenu structuré `repairPrompt` pour le transfert avec `diagnosticFocus`, `acceptanceCriteria`, et le rôle `topology-preserving-circuitikz-repair`, valide les candidats à la réparation par `--repair-brief`, renvoie des preuves de portes via le schéma `notemd.circuitikz.repair-acceptance.v1` avec `readyForVisualAcceptance` et `remainingChecks`, conserve ces preuves via `--repair-acceptance-output`, analyse les journaux de compilation, peut exécuter des rendeurs locaux explicites ainsi que `--expected-artifact`, SVG `--expected-svg-text`, effectue des vérifications de métadonnées daccessibilité par `aria-label`, `<title>`, et `<desc>`, exclut les éléments SVG cachés/transparents, classe les éléments en `render-svg-text-path-only` / `pathOnlyGlyphUseCount` pour les étiquettes uniquement basées sur des chemins, vérifie la disposition des glyphes uniquement basés sur des chemins pour `<use href="#...">`, diagnostique les chevauchements de glyphes uniquement basés sur des chemins via `render-svg-path-glyph-overlap`, gère le point courant pour les chemins fermés pour `Z/z`, définit des limites exactes pour les extrémités des arcs A/a, des limites exactes pour les extrémités des courbes Bezier C/S/Q/T, effectue des vérifications de chevauchements de bordures et détiquettes en tenant compte de lépaisseur du trait, effectue des vérifications géométriques de dessin `polyline` / `polygon`, gère la géométrie des étiquettes positionnées `tspan`, gère la géométrie du texte positionné en tenant compte de `text-anchor`, gère la géométrie en tenant compte des transformations pour SVG les cas de canvas délimité/chevauchement de texte et les tests de visibilité entre étiquettes et dessins via `render-svg-label-overlap`, ainsi que des vérifications décran capture PNG non vide/coupé/à arrière-plan dense, y compris lalpha de la palette de couleurs indexées, des échantillons transparents en noir et blanc/RGB tRNS, et des directives spécifiques au format `render-png-unsupported` pour les PNG entrelacés Adam7 et les erreurs de profondeur de bit indexée, via `foregroundBounds`, `foregroundDensity`, `render-png-content-clipped`, et `render-png-foreground-dense` sans analyse par shell, inclut des fixtures de test globaux pour les mainteneurs via `npm run diagram:smoke-circuitikz`, enregistre les configurations de rendeur manquantes via `rendererAvailability.status: "missing-configuration"` et `compile-executable-invalid`, et dispose de diagnostics de prévisualisation génériques, de comptes rendus de résumé des diagnostics, dentrées dhistorique tenant compte des diagnostics, ainsi que dun fallback basé uniquement sur la source via `RenderArtifact.diagnostics` et le mode prévisualisation | Ajouter une reconnaissance de labels au niveau OCR pour le texte visuel ne contenant que des chemins, des vérifications précises doverlap au niveau des pixels, une couverture plus large des chemins SVG là où cest nécessaire, une installation/découverte automatique du rendeur uniquement si cela peut rester optionnel, ainsi quune exécution automatique de réparations préservant la topologie. |
| Support CLI | `npm run diagram:export-artifact` exporte des fichiers HTML/SVG modifiables, ainsi que des preuves de révision au format Draw.io, Drawnix, Circuitikz, et SVG/PNG/PDF, à partir dun `DiagramSpec` validé | Ajouter des fixtures de test spécifiques aux cibles lors du déploiement de nouvelles cibles |
| circuitikz | `DiagramSpec(intent: "circuit", circuitSpec) -> CircuitikzRenderer -> circuitikz` exporte des modèles dor pour des composants tels que common-source, inverseur CMOS, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1`, et `cmos-nor2` / `cmos-nor2-v1`, expose les options dintention UI/cible de rendu, génère du TeX accompagné de prévisualisations SVG/PNG/PDF, valide la topologie avant lexport, analyse les journaux de compilation, permet dexécuter des rendeurs locaux explicites via `--expected-artifact`, et propose un fallback basé uniquement sur le code source ainsi que des diagnostics de prévisualisation accessibles via `RenderArtifact.diagnostics` et le modal de prévisualisation | Ajouter une reconnaissance de labels au niveau OCR pour le texte visuel ne contenant que des chemins, des vérifications précises doverlap au niveau des pixels, une couverture plus étendue des chemins SVG lorsque cest nécessaire, une installation/découverte automatique des rendeurs uniquement si cela reste optionnel, ainsi quune exécution automatique de réparations conservant la topologie |
| Intégration TikZJax | Sélectionner un hôte de rendu pour laffichage du côté Obsidian | Laissez-le optionnel ; ne faites pas de TikZJax une dépendance obligatoire au moment de lexécution du plugin |
## Configuration
@ -361,6 +366,7 @@ Pour un inverseur CMOS, la demande doit préciser la topologie ainsi que les con
| `enableExperimentalDiagramPipeline` | `false` | Alterner entre le mode spécifications en premier et le mode ancien Mermaid |
| `experimentalDiagramCompatibilityMode` | `'legacy-mermaid'` | `'legacy-mermaid'` = Mermaid uniquement ; `'best-fit'` = cibles natives + solutions de secours |
| `preferredDiagramIntent` | `undefined` (automatique) | Dépasser la détection automatique des intentions |
| `preferredDiagramRenderTarget` | `undefined` (automatique) | Surcharger le générateur dartefacts, y compris Draw.io, Drawnix et Circuitikz |
| `summarizeToMermaidLanguage` | `'en'` | Langue cible pour les étiquettes de diagramme |
| `summarizeToMermaidProvider` / `Model` | DeepSeek | LLM par tâche pour la génération de diagrammes |
| `autoMermaidFixAfterGenerate` | (de constantes) | Lancer automatiquement le correcteur de versions anciennes sur la sortie de Mermaid |
@ -380,10 +386,11 @@ Lorsquil est activé, Notemd récupère des extraits de contexte pertinents
| Action | Méthode |
|--------|--------|
| SVG export | Constructeur `mermaid.render()` / `vega.View.toSVG()` / SVG pour Canvas |
| Export en PNG | SVG → Image → Toile (rapport de pixels du dispositif 1x-3x) → PNG ArrayBuffer |
| Export en PNG | SVG → Image → Échantillonneur rasterisé sur le PPI configuré → Buffet doctets PNG |
| Export en PDF | SVG → image rasterisée au PPI configuré → PDF une page |
| Enregistrer la source | Contenu brut de lartefact enregistré avec lextension spécifique à la cible |
| Aperçu uniquement source | Artefacts non en ligne dont le contenu source est affiché sous forme de code ainsi que des diagnostics, sans rendu dans un iframe |
| Audit sémantique | Mermaid, JSON Canvas, Vega-Lite, ainsi que les HTML/SVG modifiables vérifiés par `scripts/diagram-semantic-verification.js` |
| Audit sémantique | Vérification de Mermaid, JSON Canvas, Vega-Lite, HTML/SVG modifiables, Draw.io, Drawnix ainsi que de circuitikz restreint par `scripts/diagram-semantic-verification.js` en plus des tests du générateur et de la CLI |
**Mémorisation en cache** : RenderCache utilise une clé déterministe JSON de `{spec, target, theme}`. La déduplication en temps réel empêche les rendus redondants.

View file

@ -1,7 +1,7 @@
---
id: diagrams
title: "תרשימים"
description: "ליצור Mermaid, JSON Canvas, Vega-Lite, HTML, קבצי תרשים ניתנים לעריכה, ותרשימים circuitikz מוגבלים בעתיד מההערות שלך באמצעות ארכיטקטורה שמתחילה במפרט"
description: "יוצרים תרשימי Mermaid, JSON Canvas, Vega-Lite, HTML, קבצי תמונה מעוצבים שניתן לערוך, Draw.io, Drawnix, ותרשימי circuitikz מוגבלים מהרשימות שלכם באמצעות ארכיטקטורה המבוססת על מפרט ראשון"
author:
'@id': 'https://jacobinwwey.github.io/obsidian-NotEMD/#person-jacobinwwey'
keywords: [diagrams, mermaid, vega-lite, canvas, visualization, spec-first, drawio, drawnix, editable svg, circuitikz, TikZJax]
@ -18,7 +18,7 @@ import TLDR from '@site/src/components/TLDR';
# תרשימים
<TLDR>
**Notemd יוצר תרשימים מההערות שלך דרך תהליך שמתחיל במפרט.** הLLM מייצר `DiagramSpec` JSON שאינו תלוי בממשק ההצגה, ולאחר מכן מתאמים מיוחדים ממירים אותו ל-Mermaid, JSON Canvas, Vega-Lite, HTML, או לפלט HTML/SVG ניתן לעריכה. הוא תומך ב8 סוגי כוונות, שרשראות חלופיות אוטומטיות, תצוגה בזמן אמת עם ייצוא SVG/PNG, בדיקה סמנטית, ויצירה מוגברת באמצעות ידע מקומי.
**Notemd מייצר תרשימים מהרשימות שלכם באמצעות תהליך המבוסס על מפרט ראשון.** ה-LLM מייצר קובץ JSON `DiagramSpec` שאינו תלוי בממשק ייצוג, ולאחר מכן מתאמים מיוחדים מתרגמים אותו לפורמטים של Mermaid, JSON Canvas, Vega-Lite, HTML, HTML/SVG מעוצבים שניתן לערוך, Draw.io, Drawnix, או תרשימי circuitikz מוגבלים. המערכת תומכת ב-9 סוגי כוונות, שרשראות חלופה אוטומטיות, תצוגה בזמן אמת עם יצוא ל-SVG/PNG/PDF, בדיקה סמנטית, וייצור משופר באמצעות ידע מקומי.
</TLDR>
זהו חלק מה[Obsidian מדריך ניהול ידע AI](/docs/pillar-ai-knowledge).
@ -54,6 +54,7 @@ graph LR
| `stateDiagram` | Mermaid | HTML | מכונות מצב, מודלים של מחזור חיים |
| `canvasMap` | JSON Canvas | Mermaid → HTML | מפות רעיונות, גרפי ידע |
| `dataChart` | Vega-Lite | Mermaid → HTML | מקלעת, קו, שטח, פיזור, עוגה, טבלאות |
| `circuit` | circuitikz | אין | תרשימי מעגלים מוגבלים מנתוני `CircuitSpec` מאומתים |
## זיהוי כוונה
@ -67,6 +68,7 @@ Notemd מסיק את סוג הדיאגרמה הטוב ביותר מתוכן הה
| `stateDiagram` | מצב, מעבר, בהמתנה, פועל, כשל (3+ התאמות) | 0.76 |
| `flowchart` | שלבים ממוספרים (2+) או אוצר מילים של if/then/else/workflow | 0.74 |
| `canvasMap` | מפת רעיונות, גרף ידע, מרחבי, קבוצות | 0.72 |
| `circuit` | circuitikz, TikZJax, circuit, schematic, CMOS, NMOS, PMOS, MOSFET, VDD/GND, `vin`/`vout` | 0.78 |
| `mindmap` | אפשרות חלופית ברירת מחדל | 0.55 |
החליפו באמצעות הגדרת **סוג הדיאגרמה המועדף**, בחירת הסיידבר הצדדי, או אפשרות מפלטת הפקודות המפורשת.
@ -80,10 +82,9 @@ Notemd מסיק את סוג הדיאגרמה הטוב ביותר מתוכן הה
| סוג הדיאגרמה המועדף | `preferredDiagramIntent` | מנחה את הצורה הסמנטית של ה`DiagramSpec` המופק |
| יעד ההצגה המועדף | `preferredDiagramRenderTarget` | בוחר את ממשק ההצגה של המוצר עבור **Generate diagram** ו-**Preview diagram** |
הגדירו **יעד ההצגה המועדף** ל-**Auto** כברירת מחדל של התכנון, או בחרו באופן מפורש Mermaid, JSON Canvas, Vega-Lite, HTML, או Editable HTML/SVG. ההחלפה תקפה רק לפקודות של מוצרים ותצוגות מבט. הפקודה הסטנדרטית **Summarise as Mermaid diagram** נשארת מחוברת לפלט תואם Mermaid כך שתהליכי Markdown קיימים לא ישנו את הפורמט באופן אוטומטי.
ההפרדה הזו חשובה מכיוון שכעת ניתן להציג כוונה של `flowchart` כ-Mermaid לתגיתות Markdown, כ-HTML כאפשרות חלופית אמינה, או כ-Editable HTML/SVG לעריכה מאוחרת. Draw.io ו-Drawnix נשארים כיוצאי מוצרים של CLI ולא כיעדי הצגה בתוך התוסף.
הגדירו את **היעד לייצוג המועדף** ל-**Auto** כערך ברירת המחדל של התכנון, או בחרו במפורש בין Mermaid, JSON Canvas, Vega-Lite, HTML, HTML/SVG מעוצבים שניתן לערוך, Draw.io, Drawnix, או Circuitikz. השינוי יחול רק על פקודות הייצור של הקבצים והתצוגה בזמן אמת. פקודת ה**Summarise as Mermaid diagram** הסטנדרטית נשארת מחוברת לפורמט התואם ל-Mermaid, כך שתהליכי Markdown קיימים לא ישנו את הפורמט באופן אוטומטי.
ההפרדה הזו חשובה מכיוון שכעת ניתן לייצג כוונה של `flowchart` כתרשים Mermaid עבור רשימות Markdown, כ-HTML כחלופה אמינה, כ-HTML/SVG מעוצבים שניתן לערוך לעריכה בשלבים מאוחרים יותר, או כקבצי מקור Draw.io/Drawnix עם קבצי SVG לבדיקה. כוונה של `circuit` מפנה ל-Circuitikz ודורשת קובץ `CircuitSpec` מאומת; זו אינה בקשה לטקסט TikZ שרירותי.
## שימוש
### יצירת דיאגרמה
@ -101,16 +102,21 @@ Notemd מסיק את סוג הדיאגרמה הטוב ביותר מתוכן הה
| Vega-Lite | `.json` | `{note}_diagram.json` |
| HTML | `.html` | `{note}_diagram.html` |
| ניתן לערוך HTML/SVG | `.html` | `{note}_diagram.html` |
| Draw.io | `.drawio` + `.drawio.svg` + `.drawio.md` | `{note}_diagram.drawio` יחד עם קבצי בדיקה מלווים |
| Drawnix | `.drawnix` + `.drawnix.svg` + `.drawnix.md` | `{note}_diagram.drawnix` יחד עם קבצי בדיקה מלווים |
| Circuitikz | `.tex` + `.tex.svg` + `.tex.md` | `{note}_diagram.tex` יחד עם קבצי בדיקה מלווים |
### להציג תרשים בפריוויו
1. להריץ **"Notemd: Preview diagram"**
2. מודל חלוני נפתח עם התרשים המוצג
3. לייצא כ- SVG או PNG באמצעות כפתורי לוח הבקרה
3. יצאו את התוצאה כ-SVG, PNG, או PDF באמצעות כפתורי הכלי
**פתיחה אוטומטית של פריוויו** זמינה בהגדרות — לאחר הייצור, מודל הפריוויו נפתח אוטומטית.
מודל הפריוויו כולל גם פאנל אבחון של חפצים. מעבדים ובדיקות עשן יכולים להוסיף `RenderArtifact.diagnostics`; המודל מציג סיכום אבחון עם מספרי שגיאות/אזהרות/מידע, ולאחר מכן רמת חומרה, סוג אבחון, הודעה ועצות לתיקון ליד הפריוויו. אותו סיכום מוצג גם ברשומות היסטוריית הפריוויו, כך שניתן להשוות ניסיונות עשן circuitikz חוזרים מבלי לפתוח כל רשומה. עבור חפצים שיש להם תוכן מקור אך אינם ניתנים להצגה בתוך הטקסט או דרך מסלול ה-iframe HTML, המודל עובר כעת לפריוויו של תוכן מקור בלבד במקום לאלץ שימוש ב-iframe ריק. זה מאפשר בדיקות עשן של קומפילציה/הצגה circuitikz, בדיקות טוקנים טקסטואליים SVG, בדיקות סקריןשוט ריק של PNG, ודיווחי חפיפה עתידיים להציג שטח נראה UI מבלי להפוך את TikZJax או LaTeX לתלות ריאלטיים קשה של פלגין או להעמיד פנים שהטקסט המקורי הוא הצגה ויזואלית מאומתת.
יצוא התצוגה בפורמטי PNG ו-PDF משתמש ברמת ה-PPI שהוגדרה. הערך הברירתי הוא 300 PPI, וערכים הגבוהים מ-600 PPI יוגבלו ל-600. קבצי SVG נשארים בגודל וקטורי. קבצי מקור כמו `.drawio`, `.drawnix`, ו-.tex` יכולים לספק קובץ `previewSvg` מלווה, כך ש-Obsidian יוכל להציג ולייצא תמונות לבדיקה מבלי לשלב את diagram.net, Drawnix, LaTeX, או TikZJax בזמן ריצת התוסף.
לחלון התצוגה המראש יש גם לוחבק של אבחון ארטיפקטים. ממררים ובדיקות ראשוניות יכולים להוסיף את הערך `RenderArtifact.diagnostics`; החלון מציג סיכום של האבחונים עם מספרי שגיאות/אזהרות/מידע, לאחר מכן את רמת החומרה, סוג האבחון, ההודעה ועצות לתיקון, לצד התצוגה המראש. אותו סיכום מוצג גם ברשומות ההיסטוריה שמכילות מידע אבחוני, כך שניתן להשוות בין ניסיונות חוזרים של בדיקות circuitikz מבלי לפתוח כל רשומה בנפרד. עבור ארטיפקטים שיש להם תוכן מקורי אך אינם ניתנים להצגה באופן אינליין או דרך מסלול ה-HTML iframe, החלון עובר כעת לשימוש בתצוגה מראש המבוססת רק על התוכן המקורי, במקום לאלץ שימוש ב-iframe ריק. דבר זה מספק ממשק משתמש גלוי עבור בדיקות קומפילציה/הצגה של circuitikz, בדיקות טקסט ב-SVG, בדיקות סקריןשוט ריק ב-PNG, דיווחים על החפצה של גליפים המבוססים רק על מסלולים, ודיווחים על החפצה בעתיד, מבלי להפוך את TikZJax או LaTeX לתלות הכרחית בזמן ריצה של פלגין, או להעמיד פנים שהטקסט המקורי הוא תוצאת הצגה ויזואלית מאומתת.
### מוד **Mermaid** מיושן
@ -164,12 +170,12 @@ Notemd מסיק את סוג הדיאגרמה הטוב ביותר מתוכן הה
### Draw.io ו-Drawnix גבולות ייצוא
היישום הנוכחי שומר על תמיכה במערכות עריכה של צד שלישי בגבול המוצר:
היישום הנוכחי שומר על תמיכה במערכות עריכה של צד שלישי בגבולות הארטיפקט, תוך חשיפת יעדי ייצוג מפורשים:
| יעד | חוזה | תלות בזמן ריצה |
|--------|----------|--------------------|
| Draw.io | `mxfile` XML לא מנוחזר באופן דטרמיניסטי מ-`SemanticFigureModel` | שום דבר בזמן ריצת הפלגין או ב- CI |
| Drawnix | תת‑קבוצה מינימלית של `.drawnix` JSON המשתמשת באלמנטים `geometry` ו-`arrow-line` | שום דבר בזמן ריצת הפלגין או ב- CI |
| Draw.io | XML `mxfile` לא מנותב באופן דטרמיניסטי מתוך `SemanticFigureModel`, בתוספת קבצי בדיקה בפורמט SVG/PNG/PDF | אין דבר מסוג זה בזמן ריצת הפלגין או ב- CI |
| Drawnix | קבוצת JSON מינימלית של קובץ `.drawnix` המשתמשת באלמנטים `geometry` ו-`arrow-line`, בתוספת קבצי בדיקה בפורמט SVG/PNG/PDF | אין דבר מסוג זה בזמן ריצת הפלגין או ב- CI |
הפשרה היא מכוונת: Notemd יכול לבדוק תוויות גלויות, זהויות יציבות, וכיסוי של פרימיטיבים תומכים מבלי לשלב את Diagram.net Desktop, Drawnix, Plait, או מצב מערכת של מערכת עריכה שמותקנת רק בדפדפן לתוך הפלגין.
@ -213,7 +219,11 @@ Notemd כולל כעת את פרוטוטייפ המאגר המוגבל הראש
npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-inverter.tex
```
הפרוטוטייפ מוסיף גבול `CircuitSpec` נפרד ומייצא דטרמיניסטי עבור שש משפחות של התייחסויות זהב:
הפרוטוטייפ מוסיף גבול `CircuitSpec` מוגבל ומייצא דטרמיניסטי עבור שש משפחות של נתוני התייחסות זהב:
במערכת הפיפליין של הדיאגרמות הניסיונית, ניתן כעת לגשת לכך גם דרך `intent: "circuit"` ויעד הייצוג `circuitikz`. קובץ `DiagramSpec` שנוצר יכול להכיל `circuitSpec` רק עבור מטרה של דיאגרמות מעגלים. `CircuitikzRenderer` כותב את אותו מקור `.tex` דטרמיניסטי ומצרף קובץ בדיקה בפורמט SVG המופק מהטופולוגיה המאומתת של המעגל, מה שמאפשר תצוגה ב- Obsidian וייצוא בפורמטים SVG/PNG/PDF. קובץ הבדיקה אינו תוצאה של קומפילציה של LaTeX/TikZJax; הראיות האמיתיות של הממשק מגיעות עדיין מפקודות הבדיקה המפורשות שמופיעות להלן.
עבור התבניות התומכות של נתוני התייחסות זהב, `layoutHints.inputSide` ו- `layoutHints.outputSide` נשארים בקרות לצורך הצגה בלבד. הן יכולות להזיז את מיקום פורטי הקלט/פלט באופן דטרמיניסטי, אך הן אינן משנות את חתימת הטופולוגיה ואינן מאפשרות ביצוע שלב תיקון לחיבור מחדש של המעגל.
| סוג מעגל | התייחסות זהב | הבטחת מתח |
|--------------|------------------|-------------------|
@ -224,7 +234,7 @@ npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-in
| `cmos-nand2` | `cmos-nand2-v1` | בודק את ההרמה המקבילה של PMOS, ההורדה החוזרת של NMOS, שני הקלטים `va` / `vb`, ואת `vout` לפני כתיבת LaTeX |
| `cmos-nor2` | `cmos-nor2-v1` | בודק את ההרמה החוזרת של PMOS בסדרה, ההורדה המקבילה של NMOS, שני הקלטים `va` / `vb`, ואת `vout` לפני כתיבת LaTeX |
זה עדיין אינו מוצר TikZ כללי. הוא אינו מקמץ LaTeX, אינו מקרא TikZJax, אינו בודק תמונות מסך, ואינו מבצע תיקון אוטומטי של תמונות. אלו יהיו שלבים בעתיד.
זהו אינו יוצר TikZ כללי. הוא אינו מקבל קוד TikZ שרירותי, אינו מקומפיל את LaTeX, אינו מזמין את TikZJax, אינו בודק תמונות בזמן ריצת הפלגין, ואינו מבצע תיקון אוטומטי של תמונות על סמך משוב. פעולות אלו נשארות שלבים שיופעלו בהמשך.
הפקודה Preview diagram יכולה לפתוח מחדש ישירות את קבצי המקור circuitikz השמורים כאשר סיומת הקובץ היא `.tex` או `.tikz` והמקור מכיל `\usepackage{circuitikz}` או `\begin{circuitikz}`. שיטה זו היא תצוגת מקור בלבד circuitikz: החלון המודאלי מציג את המקור, את האבחונים, את שליטות ההעתקה/שמירה, ואת מטא-דאטה ההיסטוריה, אך הוא אינו מקמץ LaTeX או מקרא TikZJax בזמן פעולת הפלגין.
@ -350,8 +360,8 @@ npm run diagram:smoke-circuitikz -- --output-dir docs/export/circuitikz-smoke --
|------|----------------|-----------|
| תרשימים כלליים | מערכת עם ספציפיקציות ראשונות מיושמת עבור Mermaid, JSON Canvas, Vega-Lite, HTML | המשך הרחבת כיסוי הבדיקה הסמנטית |
| תרשימים ניתנים לעריכה | גבולות הארטיפקטים של `editable-html-svg`, Draw.io XML ו- Drawnix JSON מיושמו | הוסף פרימיטיבים מתוחכמים רק לאחר שהמבחנים יוכיחו אפשרות לעריכה |
| תמיכה ב- CLI | - `npm run diagram:export-artifact` מייצא קבצים ניתנים לעריכה של HTML/SVG, Draw.io ו- Drawnix מתוך `DiagramSpec` | הוספת מתקני עשן ספציפיים ליעד כאשר יעדים חדשים נשלחים |
| circuitikz | `CircuitSpec -> circuitikz` הפרוטוטייפ מייצא תבניות זהב של מקור משותף, הפוך CMOS, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1`, ו- `cmos-nor2` / `cmos-nor2-v1`, פרויקטים `layoutHints.inputSide` ו- `layoutHints.outputSide` למיקום קבוע של פורטי קלט/פלט מבלי לשנות את הטופולוגיה, דוחה שינויים בטופולוגיה של תיקונים דרך `--topology-reference`, מפרסם תיאורי תיקון השומרים על הטופולוגיה דרך `--repair-brief-output` והתבנית `notemd.circuitikz.repair-brief.v1`, כולל תוכן מועבר מובנה `repairPrompt` עם `diagnosticFocus`, `acceptanceCriteria`, ותפקיד `topology-preserving-circuitikz-repair`, מאשר מועמדי תיקון דרך `--repair-brief`, מחזיר ראיות של שער `repairAcceptance` דרך התבנית `notemd.circuitikz.repair-acceptance.v1` עם `readyForVisualAcceptance` ו- `remainingChecks`, שומר על אותן ראיות דרך `--repair-acceptance-output`, מפרש לוגים של קומפילציה, יכול להריץ ממחישים מקומיים מפורשים בנוסף ל- `--expected-artifact`, SVG `--expected-svg-text`, בדיקות מטא-נתוני נגישות דרך `aria-label`, `<title>`, ו- `<desc>`, הדרה של אלמנטים SVG נסתרים/שקופים, סיווג `render-svg-text-path-only` / `pathOnlyGlyphUseCount` לתוויות בעלות מסלול בלבד, בדיקות מיקום גליפים בעלי מסלול בלבד עבור `<use href="#...">`, אבחון חפיפה של גליפים בעלי מסלול בלבד דרך `render-svg-path-glyph-overlap`, טיפול בנקודת הזרם של מסלולים סגורים עבור `Z/z`, גבולות מדויקים של קשת A/a בקצוות, גבולות מדויקים של עקומות Bezier בקצוות C/S/Q/T, בדיקות חפיפה של תוויות וגבולות SVG המתחשבים בעובי הקו, בדיקות גאומטריה של ציור `polyline` / `polygon`, גאומטריה של תוויות ממוקמות `tspan`, גאומטריה של טקסט ממוקם המתחשבת ב- `text-anchor`, גאומטריה המתחשבת בטרנספורמציות עבור SVG bounded-canvas/text-overlap ו- label-vs-drawing smoke דרך `render-svg-label-overlap`, ובדיקות סקריןשוט של PNG לא ריק/מקוצר/עם רקע צפוף, כולל פלטת צבעים ממוזערת עם אלפא, דגימות שקופות בשחור-לבן/RGB tRNS, והנחיות `render-png-unsupported` ספציפיות ל-PNG מעורבבים Adam7 ולכישלונות בעומק הביט, דרך `foregroundBounds`, `foregroundDensity`, `render-png-content-clipped`, ו- `render-png-foreground-dense` ללא פירוש של שלוחה, כולל מתקני עשן של מתחזקים כוללים דרך `npm run diagram:smoke-circuitikz`, רושם הגדרות ממחיש שחסרות דרך `rendererAvailability.status: "missing-configuration"` ו- `compile-executable-invalid`, ויש לו אבחוני תצוגה כלליים, ספירות סיכום של אבחונים, רשומות היסטוריה המודעות לאבחונים, וחזרה על מקור בלבד דרך `RenderArtifact.diagnostics` והמודל של תצוגה | הוספת זיהוי תוויות ברמת OCR לטקסט ויזואלי בעל מסלול בלבד, בדיקות חפיפה מדויקות ברמת הפיקסל, כיסוי מסלול רחב יותר SVG כאשר נדרש, התקנה/גילוי אוטומטי של ממחישים רק אם ניתן להשאיר אותם אופציונליים, וביצוע אוטומטי של תיקונים השומרים על הטופולוגיה |
| תמיכה בCLI | `npm run diagram:export-artifact` מייצא קבצי HTML/SVG שניתן לערוך, יחד עם קבצי Draw.io, Drawnix, Circuitikz, וכן קבצי SVG/PNG/PDF לצורך בדיקה, מתוך `DiagramSpec` מאומת אחד | הוספת תקני smoke ייעודיים ליעדים חדשים ברגע שהם משוחררים |
| circuitikz | `DiagramSpec(intent: "circuit", circuitSpec) -> CircuitikzRenderer -> circuitikz` מייצא תבניות זהב לcommon-source, CMOS inverter, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1`, ו`cmos-nor2` / `cmos-nor2-v1`, חושף אפשרויות של intent/UI וtarget להצגה, כותב TeX יחד עם קבצי תצוגה SVG/PNG/PDF, מאמת את הטופולוגיה לפני הפקדה, מפרש לוגים של קידוד, יכול להריץ ממרים מקומיים מפורשים בתוספת `--expected-artifact`, ושומר על אפשרות fallback של מקור בלבד יחד עם אבחוני תצוגה הנראים דרך `RenderArtifact.diagnostics` והמודל של חלון התצוגה | הוספת זיהוי תווית ברמת OCR לטקסט ויזואלי שמכיל רק מסלולים, בדיקות החפה מדויקות ברמת פיקסל, כיסוי רחב יותר של מסלולי SVG במקומות הנדרשים, התקנה/גילוי אוטומטי של ממרים רק אם ניתן להשאירם אופציונליים, וביצוע אוטומטי של תיקונים ששומרים על הטופולוגיה |
| אינטגרציה של TikZJax | מארח הממחיש המועמד עבור תצוגה בצד Obsidian | שמרו זאת כאופציונלית; אל תהפכו את TikZJax לתלות חובה של זמן ריצה של פלגין |
## הגדרה
@ -361,6 +371,7 @@ npm run diagram:smoke-circuitikz -- --output-dir docs/export/circuitikz-smoke --
| `enableExperimentalDiagramPipeline` | `false` | החלפה בין ספציפיקציות ראשונות ל- Mermaid מסורתי |
| `experimentalDiagramCompatibilityMode` | `'legacy-mermaid'` | `'legacy-mermaid'` = Mermaid בלבד; `'best-fit'` = יעדים מולדים + חלופות |
| `preferredDiagramIntent` | `undefined` (אוטומטי) | החלפת זיהוי הכוונה האוטומטי |
| `preferredDiagramRenderTarget` | `undefined` (אוטומטי) | עקיפת ממשק ההצגה של הארטיפקט, כולל Draw.io, Drawnix ו-Circuitikz |
| `summarizeToMermaidLanguage` | `'en'` | שפת היעד לתוויות של דיאגרמה |
| `summarizeToMermaidProvider` / `Model` | DeepSeek | LLM לכל משימה ליצירת דיאגרמה |
| `autoMermaidFixAfterGenerate` | (מהקבועים) | הרצה אוטומטית של מתקן התיקונים המסורתי על פלט Mermaid |
@ -380,10 +391,11 @@ npm run diagram:smoke-circuitikz -- --output-dir docs/export/circuitikz-smoke --
| פעולה | שיטה |
|--------|--------|
| SVG export | בונה `mermaid.render()` / `vega.View.toSVG()` / SVG לCanvas |
| ייצוא PNG | SVG → Image → Canvas (יחס פיקסלים של המכשיר 1x-3x) → PNG ArrayBuffer |
| ייצוא ל-PNG | SVG → תמונה → Canvas / ממחשה של רסטר ב-PPI המוגדר → ArrayBuffer PNG |
| ייצוא ל-PDF | SVG → תמונת רסטר ב-PPI המוגדר → PDF של דף בודד |
| שמירת מקור | תוכן הארטיפקט הגולמי נשמר עם סיומת ייעודית ליעד |
| תצוגה מראש של מקור בלבד | ארטיפקטים שאינם inline עם תוכן המקור מוצגים כקוד יחד עם אבחונים, ללא רנדרינג של iframe |
| בדיקת סמנטיקה | Mermaid, JSON Canvas, Vega-Lite, ו- HTML/SVG שניתן לערוך, מאומת על ידי `scripts/diagram-semantic-verification.js` |
| בדיקת סמנטיקה | Mermaid, JSON Canvas, Vega-Lite, HTML/SVG ניתנים לעריכה, Draw.io, Drawnix ו-Circuitikz מוגבלים נבדקים על ידי `scripts/diagram-semantic-verification.js` בתוספת מבחני ממשק ההצגה/CLI |
**אחסון בקשר**: RenderCache משתמש במפתח דטרמיניסטי JSON של `{spec, target, theme}`. ביטול כפילויות בזמן העיבוד מונע הצגות כפולות.

File diff suppressed because one or more lines are too long

View file

@ -1,7 +1,7 @@
---
id: diagrams
title: "Diagramok"
description: "A spec-first architektúra segítségével a figyelmeketből Mermaid, JSON Canvas, Vega-Lite, HTML formátumban működő, szerkeszthető képek, valamint jövőbeli korlátozott circuitikz diagramok készülnek ki."
description: "Egy spec-first architektúra segítségével a jegyzékeidből Mermaid, JSON Canvas, Vega-Lite, HTML, módosítható képformátkú artefektumok, Draw.io, Drawnix, valamint korlátozott circuitikz diagramok készülnek ki."
author:
'@id': 'https://jacobinwwey.github.io/obsidian-NotEMD/#person-jacobinwwey'
keywords: [diagrams, mermaid, vega-lite, canvas, visualization, spec-first, drawio, drawnix, editable svg, circuitikz, TikZJax]
@ -18,7 +18,7 @@ import TLDR from '@site/src/components/TLDR';
# Diagramok
<TLDR>
**Notemd a figyelmeketből spec-first folyamatú módon diagramokká alakítja.** A LLM egy renderer-agnostikus `DiagramSpec` JSON-t készít, majd speciális adapterek ezt Mermaid, JSON Canvas, Vega-Lite, HTML formátumba vagy szerkeszthető HTML/SVG formátumba átvitték. 8 intenzitípus támogatása, automatikus fallback folyamatok, live preview valamint SVG/PNG kiszállítás, semantikus ellenőrzés és helyi tudásokkal bővített generálás is lehetőségként létezik.
**Notemd egy spec-first folyamat útján készít ki diagramokat a jegyzékeidből.** Az LLM egy renderer-agnostikus `DiagramSpec` JSON-fájlt készít, majd speciális adapterek átváltják ezt Mermaid, JSON Canvas, Vega-Lite, HTML, módosítható HTML/SVG, Draw.io, Drawnix vagy korlátozott circuitikz formátumba. Támogatja 9 kívánt típusot, automatikus lehetséges változások sorrendjét, közvetlen előnézetet SVG/PNG/PDF kiszállítással, semantikai ellenőrzést, illetve helyi tudnivalókkal bővített készítést.
</TLDR>
Ez része a [Obsidian AI tudományos kezelési útmutatójának](/docs/pillar-ai-knowledge).
@ -54,6 +54,7 @@ graph LR
| `stateDiagram` | Mermaid | HTML | Állapotmásházak, életciklusmodellek |
| `canvasMap` | JSON Canvas | Mermaid → HTML | Koncepciókártyák, tudományos grafikonok |
| `dataChart` | Vega-Lite | Mermaid → HTML | Sárga, linia, terület, szórás, kör, táblák |
| `circuit` | circuitikz | none | Validerált `CircuitSpec` adatokból készült korlátozott circuitikz diagramok |
## Intenciós felismerés
@ -67,6 +68,7 @@ Notemd az összefoglaló tartalmából kulcszavak értékelésével az optimalab
| `stateDiagram` | Állapot, átmenet, felfüggesztve, futtatásban, sérült (3+ megfelelés) | 0.76 |
| `flowchart` | Numérozott lépések (2+) vagy if/then/else/workflow szókincse | 0.74 |
| `canvasMap` | Konceptusrajz, tudományos graf, térképes, csoport | 0.72 |
| `circuit` | circuitikz, TikZJax, circuit, schematic, CMOS, NMOS, PMOS, MOSFET, VDD/GND, `vin`/`vout` | 0.78 |
| `mindmap` | Alapértelmezett lehetséges választék | 0.55 |
Átírjuk a **Előnyös diagramtípus** beállításával, a sárú selektortól vagy egy kifejezett parancssorpaletái opciójával.
@ -80,10 +82,9 @@ A kísérleti specifikációk alapú folyamat most két külön kontrollt tartal
| Előnyös diagramtípus | `preferredDiagramIntent` | Irányítja a készült `DiagramSpec` semántikai formátumát |
| Előnyös renderelési célpont | `preferredDiagramRenderTarget` | Válaszol a **Diagram készítése** és **Diagram előnézetéhez** szükséges artefakt rendererét |
Beállítsa a **Előnyös renderelési célpontot** **Auto**-ra az alapértelmezett tervezőhez, vagy válassza kifejezetten Mermaid, JSON Canvas, Vega-Lite, HTML, vagy Editable HTML/SVG-t. Az átírás csak a artefakt- és előnézetparancsokra vonatkozik. A standard **Summarise as Mermaid diagram** parancs továbbra is Mermaid-kompatibilis kimenethez van kötve, így a meglévő Markdown munkafolyamok nem változnak titkosan formátumukat.
Ez a különbség fontos, mert egy `flowchart` cél most lehet Markdown jegyzetekhez Mermaid formában, biztonságos lehetséges választékhoz HTML formában, vagy további módosításokhoz Editable HTML/SVG formában renderelni. A Draw.io és Drawnix továbbra is CLI artefakt exportálók maradnak, nem plug-in belüli renderelési célpontokká.
A plánoló alapértelmezettének megadásához állítson be a **Preferred render target**-ot **Auto**-ra, vagy kifejezetten válassza ki Mermaid, JSON Canvas, Vega-Lite, HTML, Editable HTML/SVG, Draw.io, Drawnix vagy Circuitikz-t. Ez a változtatás csak az artefektumok és az előnézet parancsokra vonatkozik. A standard **Summarise as Mermaid diagram** parancs továbbra is Mermaid-kompatibilis kiszállításra van kötve, így a meglévő Markdown munkafolyamok nem változnak titkosan formátumukat.
Ez a különbség fontos, mert egy `flowchart` kívánt típus most Mermaid formátumban lehet renderelni Markdown jegyzékekhez, HTML formátumban erős lehetséges változásokhoz, Editable HTML/SVG formátumban további módosításokhoz, vagy Draw.io/Drawnix forrásartefektumokkával SVG ellenőrzési fájlokkal. Az `circuit` kívánt típus a Circuitikz-re irányul és egy validerált `CircuitSpec`-t igényel; ez nem egy bármilyen TikZ szöveg kérése.
## Használat
### Diagram készítése
@ -101,16 +102,21 @@ Ez a különbség fontos, mert egy `flowchart` cél most lehet Markdown jegyzete
| Vega-Lite | `.json` | `{note}_diagram.json` |
| HTML | `.html` | `{note}_diagram.html` |
| Írható HTML/SVG | `.html` | `{note}_diagram.html` |
| Draw.io | `.drawio` + `.drawio.svg` + `.drawio.md` | `{note}_diagram.drawio` plusz ellenőrzési fájlok |
| Drawnix | `.drawnix` + `.drawnix.svg` + `.drawnix.md` | `{note}_diagram.drawnix` plusz ellenőrzési fájlok |
| Circuitikz | `.tex` + `.tex.svg` + `.tex.md` | `{note}_diagram.tex` plusz ellenőrzési fájlok |
### Diagram előnézetének megtekintése
1. Indítson **"Notemd: Diagram előnézetének megtekintése"**
2. Egy modál ablak nyílik meg a renderelt diagrammal
3. Exportáljon SVG vagy PNG formátumban a szolgáltatási sor parancsainak használatával
3. Használja a szolgáltatási sor parancsait, hogy SVG, PNG vagy PDF formátumban kiszállítsa a képet.
**Autó-előnézet** beállításokban elérhető készítés után az előnézet modál ablaka automatikusan nyílik.
Az előnézet modál ablakán van egy artefakt-diagnozis panel is. A renderelők és a smoke ellenőrzések `RenderArtifact.diagnostics`-t köthetnek hozzá; a modál ablak egy diagnozis összefoglalást mutat beállításokkal az hibák, figyelmeztetések és információk számára, majd a súlyosság, a diagnozis típus, a üzenet és a reparációs tanácsokkal a előnézet mellett. Ugyanaz az összefoglalat jelenik meg a előnézet történeti bejegyeikben is, így az összefüggő circuitikz smoke ellenőrzéseket lehet összevetni, anélkül hogy minden bejegyzést nyitnánk. Azok az artefaktoknál, amelyeknek van forrás tartalma, de nem lehet őket inline formában vagy a HTML iframe útja mellett renderelni, a modál ablak most helyettesítően csak forrásbázisú előnézetet ad, így nincs szükség üres iframe használatára. Ez lehetővé teszi a circuitikz kompilálási/renderelési smoke ellenőrzéseket, a SVG szöveg-tokén ellenőrzéseket, a PNG tömött képernyőkép ellenőrzéseket és a jövőbeli összeütközési jelentéseknek egy látható UI felületet adni, anélkül hogy a TikZJax vagy LaTeX legyenek szigorú plugin futtatási függőségek vagy azonképpen az forrás szövegnek kellene bizonyítva lennie egy ellenőrzött visuális renderelésnek.
A PNG és PDF előnézet kiszállítása az konfigurált előnézet PPI-jét használja. A alapértelmezett 300 PPI, és a 600 PPI-nél magasabb értékek 600-re korlátozódnak. Az SVG továbbra is vektortípusú marad. A `.drawio`, `.drawnix` és `.tex` szintű forrásartefektumok egy `previewSvg` ellenőrzési fájlt is adhatnak, így a Obsidian képes megjeleníteni és kiszállítani ellenőrizhető képeket, anélkül hogy a plugin működése során diagram.net, Drawnix, LaTeX vagy TikZJax-t beillesztené.
A előnyölt nézet ablakában is létezik egy hibadiagnózis panel. A renderelők és a „smoke check”-ek hozzá tudják tartani a `RenderArtifact.diagnostics`-ot; az ablak az előnyölt kép mellett mutatja be egy összefoglalót a hiba, figyelmeztetés és információ számairól, majd a súlyosság, a diagnostikai típus, a üzenet és a reparációs tanácsokat. Ugyanaz az összefoglalat jelenik meg a diagnostikákat támogató históriai bejegyzésekben is, így a többszörre ismétlődő circuitikz „smoke”-próbákat lehet egymással összevetni, anélkül hogy minden bejegyzést kellene nyitni. Azok az artefektek esetében, amelyeknek van forrásíneke, de nem lehet őket inline formában vagy az HTML iframe útja melaljánk renderelni, az ablak most helyett egy teljesen forrásínekre épülő előnyölt nézetet használ, így nincs szükség üres iframe-t használni. Ez lehetővé teszi a circuitikz kompilálási/renderelési „smoke”-próbákat, az SVG szöveg-token ellenőrzéseit, a PNG tömött képernyőképek ellenőrzéseit, a csak útinformációkra épülő glifák összeütközési jelentésekét, valamint a jövőbeli összeütközési jelentésekét egy látható felületen mutatni, anélkül hogy a TikZJax vagy LaTeX legyenek szigorú plugin futtatási függőségeknek, vagy pedig az forrásínekeknek kellene mintha ellenőrzött visuális renderelésnek tűnnie.
### Örökségű Mermaid módszer
@ -164,12 +170,12 @@ Ez a célpont intenzíven nem a helyettesítő tervezési útja még. Ez elérhe
### Draw.io és Drawnix Export határai
A jelen implementáció a harmadik fél editor támogatását az artefakt határában tartja:
A jelenlegi implementáció a harmadik fél szerkesztők támogatását az artefakt határában tartja, ugyanakkor viszont elérhetőek maradnak a kifejezetten megadott renderelési célok:
| Célpont | Kontraktus | Működési időkéntes függőség |
|--------|----------|--------------------|
| Draw.io | Deterministikus, komprimálhatatlan `mxfile` XML a `SemanticFigureModel`-től | Nem vannak sem a plugin működési időben, sem a CI-ben |
| Drawnix | Minimalista `.drawnix` JSON alamagom, amely használja a `geometry` és `arrow-line` elemeket | Nem vannak sem a plugin működési időben, sem a CI-ben |
| Draw.io | `SemanticFigureModel` által generált determiniszmusos, komprimálás nélküli `mxfile` XML-ö, továbbá SVG/PNG/PDF formátumban lévő ellenőrzési fájlok | a plugin futtatása vagy CI-ben semmi nincs |
| Drawnix | `geometry` és `arrow-line` elemeket használó minimális `.drawnix` JSON-komponensek, továbbá SVG/PNG/PDF formátumban lévő ellenőrzési fájlok | a plugin futtatása vagy CI-ben semmi nincs |
A kiegyensúlyozás intenzíven választott: a Notemd lehetővé teszi a látólagos címkek, stabil azonosítók és támogatott primitívek összefoglalásának ellenőrzését, anélkül hogy beépítené a diagrams.net Desktop, Drawnix, Plait vagy csak böngészőben működő editor állapotot a pluginbe.
@ -213,7 +219,11 @@ Notemd tartalmaz now a felszólított tárgykör számára első korlátozott re
npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-inverter.tex
```
A prototípus hozzáad egy külön `CircuitSpec` határt és deterministikus kiszolgálót három aranyreferenciái családhoz:
A prototípus egy korlátozott `CircuitSpec` határat ad, illetve determiniszmusos exportálót biztosít számos klasszikus referenciációs családhoz:
A kísérleti diagrammállományú folyamatban ezt most is elérhetővé teszi a `intent: "circuit"` és a renderelési cél `circuitikz`. A generált `DiagramSpec` csak a circuit céllal használhatja a `circuitSpec`-t. A `CircuitikzRenderer` ugyanazt a determiniszmusos `.tex` forráskódot ír le, és olyan SVG előnézetfájlt csatlakoztat, amely az ellenőrzött circuit topológiából készül; ez lehetővé teszi az Obsidian előnézetét, valamint a SVG/PNG/PDF exportálást. Ez a fájl nem egy LaTeX/TikZJax kompilációs eredmény; a valós renderer részletek továbbra is az alábbi kifejezetten megadott parancsokban vannak.
A támogatott klasszikus szablónképek esetén a `layoutHints.inputSide` és a `layoutHints.outputSide` továbbra is csak bemutatási céllal használt kontrollok maradnak. Ezek lehetővé teszik a determiniszmusos be-/kimeneti port helyezését, de nem változtatják a topológiái jellegzetét, és nem engedélyezik egy reparációs lépést, amely átrendelne a circuitot.
| Környezet típu | Aranyreferencia | Folyamennyelv garancia |
|--------------|------------------|-------------------|
@ -224,7 +234,7 @@ A prototípus hozzáad egy külön `CircuitSpec` határt és deterministikus kis
| `cmos-nand2` | `cmos-nand2-v1` | Ellenőrizi a paralel PMOS pull-up, soros NMOS pull-down, két bevezetés `va` / `vb` és `vout` működését, mielőtt LaTeX-ot írjon le |
| `cmos-nor2` | `cmos-nor2-v1` | Ellenőrizi a soros PMOS pull-up, paralel NMOS pull-down, két bevezetés `va` / `vb` és `vout` működését, mielőtt LaTeX-ot írjon le |
Ez még nem egy általános TikZ generátor. Nem kompilálja a LaTeX-ot, nem hívja fel TikZJax, nem ellenőrizi a képeket, és nem futtat automatikus kép-fejlesztési műveleteket. Ezek a funkciók később kerülnek be.
Ez nem egy általános TikZ generátor. Ez nem fogadja el bármilyen TikZ kódot, nem kompilálja LaTeX-kódot, nem hívja fel a TikZJax-t, nem ellenőrzi képeket a plugin futtatása során, és nem futtat automatikus kép-alapú reparációs folyamatokat. Ezek továbbra is későbbi lépéseknek tartoznak.
A Preview diagram parancsa lehetővé teszi az összeállított circuitikz forrásfájlok újra megnyitását közvetlenül, ha a fájl extenzíja `.tex` vagy `.tikz`, és a forrásban vannak `\usepackage{circuitikz}` vagy `\begin{circuitikz}`. Ez egy circuitikz forráskörű előnézet: a modális ablak mutatja be a forrásot, a diagnostikákat, a kopiálás/megőrzés kezelőket és a históriai adatokat, de nem kompilálja a LaTeX-ot vagy nem hívja fel TikZJax a plug-in működési időszakában.
@ -350,8 +360,8 @@ Egy CMOS invertér esetében a kérésnek egy konkrét topológiát és tervezé
|------|----------------|-----------|
| Általános diagramok | Spec-first pipeline implementálva Mermaid, JSON Canvas, Vega-Lite, HTML számára | Folytatjuk a semantikus ellenőrzés körét bővítését |
| Módosítható képek | `editable-html-svg`, Draw.io XML, és Drawnix JSON artefaktus határai implementálva | Hozz létre több információt tartalmazó primitívumokat csak azután, ha a tesztek bizonyítják a módosíthatóságát |
| CLI támogatása | `npm run diagram:export-artifact` exportálja módosítható HTML/SVG, Draw.io, és Drawnix-t egy `DiagramSpec`-ból | Új célok elérkezésekor célként specifikus tárgyfüggő tárgyak hozzáadása |
| circuitikz | `CircuitSpec -> circuitikz` prototípus exportálja közös forrásokat, CMOS invertert, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1`, és `cmos-nor2` / `cmos-nor2-v1` aranyos szabályokat, projekteteket `layoutHints.inputSide` és `layoutHints.outputSide` determinisztikus be-/kimeneti port helyezésére, anélkül hogy a topológiá változna, elutasítja a topológiai hibák módosítását `--topology-reference` keresztül, kiadja a topológiát megőrző működési leírásokat `--repair-brief-output` és szkémákkal `notemd.circuitikz.repair-brief.v1`, tartalmaz struktúrált `repairPrompt` átadási tartalmat `diagnosticFocus`, `acceptanceCriteria`, és szerepkeléssel `topology-preserving-circuitikz-repair`, ellenőrizi a működési kandidátumokat `--repair-brief` keresztül, adja vissza `repairAcceptance` kapu bizonyítékait a szkémákkal `notemd.circuitikz.repair-acceptance.v1`, valamint `readyForVisualAcceptance` és `remainingChecks` keresztül, tárolja ezt a bizonyítékot `--repair-acceptance-output` keresztül, elemzéli a kompilálási logokat, lehetőség van futtatni kifejezetten helyi renderereket plusz `--expected-artifact`, SVG `--expected-svg-text`, hozzáférhetőség metaadat ellenőrzéseit `aria-label`, `<title>`, és `<desc>` keresztül, elrejtett/transparent SVG elemek kizárása, `render-svg-text-path-only` / `pathOnlyGlyphUseCount` osztályozás csak út-orientált jelzőknek, út-orientált glifák helyezés ellenőrzései `<use href="#...">` keresztül, út-orientált glifák összeütközés diagnostikája `render-svg-path-glyph-overlap` keresztül, záró út current-point kezelése `Z/z` keresztül, pontos kör határai A/a kör extremumainak érdekében, pontos Bezier kurva határai C/S/Q/T kurva extremumainak érdekében, stroke-width-re szabott SVG határok és jelzők összeütközés ellenőrzései, `polyline` / `polygon` rajz geometriája ellenőrzései, pozicionált `tspan` jelző geometriája, `text-anchor`-re szabott pozicionált szöveg geometriája, transform-re szabott geometria SVG korlátozott canvas/szöveg összeütközés és jelző-kép összeütközés érdekében `render-svg-label-overlap` keresztül, valamint PNG nemtüntető / kizáró / sűrű előnyölt képek ellenőrzései, beleértve indexelt színpaletta alfa-tartalmát, szürke/RGB tRNS transparent példákat, és formátumspecifikus `render-png-unsupported` irányításokat Adam7 interlaced PNG-knek és indexelt bit-dereség hibáinak érdekében, `foregroundBounds`, `foregroundDensity`, `render-png-content-clipped`, és `render-png-foreground-dense` keresztül, anélkül hogy shell elemzés legyen, tartalmaz összefoglaló karbantartó tárgyfüggő tárgyakat `npm run diagram:smoke-circuitikz` keresztül, rögzíti hiányzó renderer konfigurációt `rendererAvailability.status: "missing-configuration"` és `compile-executable-invalid` keresztül, és rendelkezik általános előnézet diagnostikájával, diagnostikai összefoglaló számokkal, diagnostikára alapuló történelmi bejegyzésekkel, és forrás-orientált fallback-kal `RenderArtifact.diagnostics` és a előnézet modálján keresztül | Út-orientált visuális szövegnek OCR-szintű jelzőkigenlét eléréséhez, precíz pixel-szintű összeütközés ellenőrzésekre, szükség esetén szélesbb SVG út lefedésre, automatikus renderer telepítése/keresése csak akkor, ha lehetőségként maradhat, és automatikus topológiát megőrző működési elvégzés |
| CLI támogatás | `npm run diagram:export-artifact` kiszolgálható HTML/SVG, Draw.io, Drawnix, Circuitikz formátumban való fájlokat, illetve SVG/PNG/PDF formátumban lévő ellenőrzési adatokat egy megerősített `DiagramSpec` alapján | Új célok elérhetővé válnak korán a célspecifikus smoke fixtureek hozzáadásával |
| circuitikz | `DiagramSpec(intent: "circuit", circuitSpec) -> CircuitikzRenderer -> circuitikz` kiszolgál egyéb típusú forrásokat, CMOS invertereket, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1` és `cmos-nor2` / `cmos-nor2-v1` típusú általános szabványos modelljeket; nyílt a UI célok és renderelési célok beállításához, ír le TeX fájlokat, valamint SVG/PNG/PDF formátumban lévő előnyugrásokat; előnyel kiszolgálja a topológiát, áttekinti a kompilációs logokat, lehetőség van használni specifikus helyi renderereket és a `--expected-artifact` paramétert, továbbá biztosít egy forráskód-alapú lehetséges alternatívát, illetve előnyugrásokhoz kapcsolódó diagnostikai információkat a `RenderArtifact.diagnostics` és a előnyugrás modális ablak keresztül | Hozzáadás OCR-szintű jelképezések azonosításához csak útinformációt tartalmazó kézi szövegeknek, precíz pixel-szintű összeütközés ellenőrzésekre, szükség esetén szélesebb SVG út-követelmények teljesítésére; az automatikus renderer telepítése vagy keresése csak akkor történik, ha ez továbbra is választható lehet, illetve automatikus topológiát megőrző reparációs folyamatok ellátása |
| TikZJax integráció | Obsidian oldalának megjelenítéséhez kandidát render host | Tartsonk ezt lehetőségként; ne tegyük TikZJax szigorú plugin futászási függőséggé |
## Konfiguráció
@ -361,6 +371,7 @@ Egy CMOS invertér esetében a kérésnek egy konkrét topológiát és tervezé
| `enableExperimentalDiagramPipeline` | `false` | Specifikáció-első és régiódi Mermaid között váltás |
| `experimentalDiagramCompatibilityMode` | `'legacy-mermaid'` | `'legacy-mermaid'` = Mermaid csak; `'best-fit'` = natív célok + fallbackok |
| `preferredDiagramIntent` | `undefined` (auto) | Automatikus célis azonosítás leírásának összeírása |
| `preferredDiagramRenderTarget` | `undefined` (automatikus) | Az artefakt renderelőt módosítja, beleértve a Draw.io, Drawnix és Circuitikz-t |
| `summarizeToMermaidLanguage` | `'en'` | Diagram jelzői számára cél nyelv |
| `summarizeToMermaidProvider` / `Model` | DeepSeek | Munka alapján LLM diagram készítéséhez |
| `autoMermaidFixAfterGenerate` | (konstantákból) | Autómódos régiódi működési elvégzés Mermaid kiindulókön |
@ -380,10 +391,11 @@ Ha aktiválva van, Notemd keresi el a releváns kontextus részleteket a vault h
| Ellenőrzés | Métód |
|--------|--------|
| SVG exportálás | `mermaid.render()` / `vega.View.toSVG()` / SVG építő a Canvas számára |
| PNG exportálás | SVG → Image → Canvas (eszköz pixel arány 1x-3x) → PNG ArrayBuffer |
| PNG-k exportálása | SVG → kép → konfigurált PPI-re szabályozott canvas / előnézetes rasterizáló → PNG ArrayBuffer |
| PDF-k exportálása | SVG → konfigurált PPI-re szabályozott rasterkép → egyoldalas PDF |
| Forrás mentése | A gyümölcs összetevői mentésre kerülnek a célspecifikus kiterjesztéssel |
| Kizárólag forrás előnézet | A nem-inline gyümölcsök a forrás tartalmával együtt kódként és diagnostikákkel jelennek meg, nincs iframe renderelése |
| Semantikus ellenőrzés | Mermaid, JSON Canvas, Vega-Lite, és módosítható HTML/SVG-t `scripts/diagram-semantic-verification.js` ellenőriz |
| Semantikai ellenőrzés | A Mermaid, JSON Canvas, Vega-Lite, módosítható HTML/SVG, Draw.io, Drawnix és korlátozott Circuitikz összeállítása a `scripts/diagram-semantic-verification.js` segítségével, továbbá a renderelő/CLI tesztekkel |
**Caching**: RenderCache használja `{spec, target, theme}` determiniszmusos JSON kulcsát. Az útban történő duplikácsok elszűrése megakadályozza a duplán készített képeket.

View file

@ -1,7 +1,7 @@
---
id: diagrams
title: "Diagram"
description: "Menghasilkan Mermaid, JSON Canvas, Vega-Lite, HTML, artefak gambar yang dapat diedit, serta diagram circuitikz terbatas di masa depan dari catatan Anda menggunakan arsitektur berbasis spesifikasi terlebih dahulu"
description: "Menghasilkan diagram Mermaid, JSON Canvas, Vega-Lite, HTML, artefak gambar yang dapat diedit, Draw.io, Drawnix, serta diagram circuitikz terbatas dari catatan Anda menggunakan arsitektur berbasis spesifikasi terlebih dahulu"
author:
'@id': 'https://jacobinwwey.github.io/obsidian-NotEMD/#person-jacobinwwey'
keywords: [diagrams, mermaid, vega-lite, canvas, visualization, spec-first, drawio, drawnix, editable svg, circuitikz, TikZJax]
@ -18,7 +18,7 @@ import TLDR from '@site/src/components/TLDR';
# Diagram
<TLDR>
**Notemd membuat diagram dari catatan Anda melalui pipeline berbasis spesifikasi terlebih dahulu.** LLM menghasilkan `DiagramSpec` JSON yang tidak bergantung pada renderer, lalu adapter khusus menerjemahkannya menjadi Mermaid, JSON Canvas, Vega-Lite, HTML, atau output HTML/SVG yang dapat diedit. Dukungan untuk 8 tipe intent, rantai fallback otomatis, pratinjau langsung dengan ekspor SVG/PNG, verifikasi semantik, dan generasi yang diperkuat pengetahuan lokal.
**Notemd menghasilkan diagram dari catatan Anda melalui pipeline berbasis spesifikasi terlebih dahulu.** LLM akan menghasilkan file JSON `DiagramSpec` yang independen dari renderer, kemudian adapter khusus menerjemahkannya menjadi format Mermaid, JSON Canvas, Vega-Lite, HTML, HTML/SVG yang dapat diedit, Draw.io, Drawnix, atau output circuitikz terbatas. Fitur ini mendukung 9 tipe intent, rantai fallback otomatis, pratinjau langsung beserta ekspor SVG/PNG/PDF, verifikasi semantik, serta generasi yang diperkuat oleh pengetahuan lokal.
</TLDR>
Ini merupakan bagian dari [Obsidian Panduan Manajemen Pengetahuan AI](/docs/pillar-ai-knowledge).
@ -54,6 +54,7 @@ graph LR
| `stateDiagram` | Mermaid | HTML | Mesin keadaan, model siklus hidup |
| `canvasMap` | JSON Canvas | Mermaid → HTML | Peta konsep, graf pengetahuan |
| `dataChart` | Vega-Lite | Mermaid → HTML | Graf batang, garis, area, scatter, pie, tabel |
| `circuit` | circuitikz | none | Diagram circuit terbatas dari payload `CircuitSpec` yang telah diverifikasi |
## Deteksi niat
@ -67,6 +68,7 @@ Notemd menentukan jenis diagram terbaik dari konten catatan Anda menggunakan sko
| `stateDiagram` | Keadaan, transisi, dalam proses, sedang berjalan, gagal (3+ kesesuaian) | 0.76 |
| `flowchart` | Langkah bernomor (2+) atau kosakata if/then/else/workflow | 0.74 |
| `canvasMap` | Peta konsep, graf pengetahuan, spasial, kluster | 0.72 |
| `circuit` | circuitikz, TikZJax, circuit, schematic, CMOS, NMOS, PMOS, MOSFET, VDD/GND, `vin`/`vout` | 0.78 |
| `mindmap` | Nilai default sebagai pengganti | 0.55 |
Atur ulang menggunakan pengaturan **Tipe diagram yang diinginkan**, pilihan di sidebar, atau opsi panel perintah yang eksplisit.
@ -80,10 +82,9 @@ Pipeline berbasis spesifikasi eksperimental kini memiliki dua kontrol terpisah:
| Tipe diagram yang diinginkan | `preferredDiagramIntent` | Membimbing bentuk semantik dari `DiagramSpec` yang dihasilkan |
| Target render yang diinginkan | `preferredDiagramRenderTarget` | Memilih renderer artefak untuk **Menghasilkan diagram** dan **Pratinjau diagram** |
Atur **Target render yang diinginkan** menjadi **Auto** sebagai default untuk perencana, atau pilih secara eksplisit Mermaid, JSON Canvas, Vega-Lite, HTML, atau Editable HTML/SVG. Pengaturan ulang hanya berlaku untuk perintah artefak dan pratinjau. Perintah standar **Merangkum sebagai diagram Mermaid** tetap menggunakan output yang kompatibel dengan Mermaid sehingga alur kerja Markdown yang ada tidak secara diam-diam mengubah formatnya.
Pemisahan ini penting karena niat `flowchart` kini dapat dirender sebagai Mermaid untuk catatan Markdown, HTML sebagai pengganti yang andal, atau Editable HTML/SVG untuk penyuntingan selanjutnya. Draw.io dan Drawnix tetap merupakan ekspor artefak jenis CLI, bukan target render di dalam plugin.
Atur **Preferred render target** menjadi **Auto** sebagai pengaturan default untuk alat perencana, atau pilih secara eksplisit Mermaid, JSON Canvas, Vega-Lite, HTML, Editable HTML/SVG, Draw.io, Drawnix, atau Circuitikz. Pengaturan override ini hanya berlaku untuk perintah artefak dan pratinjau. Perintah standar **Summarise as Mermaid diagram** tetap menghasilkan output yang kompatibel dengan Mermaid agar alur kerja Markdown yang sudah ada tidak secara diam-diam mengubah formatnya.
Pemisahan ini penting karena intent `flowchart` kini dapat dirender sebagai Mermaid untuk catatan Markdown, HTML sebagai fallback yang andal, Editable HTML/SVG untuk pengeditan lebih lanjut, atau artefak sumber berformat Draw.io/Drawnix beserta file pendamping berformat SVG untuk peninjauan. Intent `circuit` akan dialihkan ke Circuitikz dan memerlukan file `CircuitSpec` yang telah diverifikasi; ini bukan permintaan untuk teks TikZ sembarangan.
## Penggunaan
### Menghasilkan Diagram
@ -101,16 +102,21 @@ Pemisahan ini penting karena niat `flowchart` kini dapat dirender sebagai Mermai
| Vega-Lite | `.json` | `{note}_diagram.json` |
| HTML | `.html` | `{note}_diagram.html` |
| Dapat Diubah HTML/SVG | `.html` | `{note}_diagram.html` |
| Draw.io | `.drawio` + `.drawio.svg` + `.drawio.md` | `{note}_diagram.drawio` beserta file pendamping untuk peninjauan |
| Drawnix | `.drawnix` + `.drawnix.svg` + `.drawnix.md` | `{note}_diagram.drawnix` beserta file pendamping untuk peninjauan |
| Circuitikz | `.tex` + `.tex.svg` + `.tex.md` | `{note}_diagram.tex` beserta file pendamping untuk peninjauan |
### Pratinjau Diagram
1. Jalankan **"Notemd: Pratinjau diagram"**
2. Sebuah modal terbuka dengan diagram yang telah dirender
3. Ekspor sebagai SVG atau PNG menggunakan tombol toolbar
3. Ekspor sebagai SVG, PNG, atau PDF menggunakan tombol-tombol di toolbar
**Buka pratinjau otomatis** tersedia di pengaturan — setelah generasi, modal pratinjau akan dibuka secara otomatis.
Modal pratinjau juga memiliki panel diagnosis artefak. Renderer dan pemeriksaan smoke dapat menambahkan `RenderArtifact.diagnostics`; modal tersebut menampilkan ringkasan diagnosis dengan jumlah kesalahan/peringatan/informasi, lalu tingkat keparahan, jenis diagnosis, pesan, dan saran perbaikan di samping pratinjau. Ringkasan yang sama ditampilkan dalam entri sejarah pratinjau, sehingga percobaan smoke circuitikz yang berulang dapat dibandingkan tanpa membuka setiap entri. Untuk artefak yang memiliki konten sumber tetapi tidak dapat dirender secara inline atau melalui jalur iframe HTML, modal kini beralih ke pratinjau hanya berbasis sumber alih-alih memaksakan iframe kosong. Hal ini memberikan permukaan visual UI yang jelas untuk pemeriksaan compile/render smoke circuitikz, pemeriksaan token teks SVG, pemeriksaan screenshot PNG kosong, dan laporan tumpang tindih di masa depan, tanpa menjadikan TikZJax atau LaTeX sebagai ketergantungan runtime plugin yang wajib atau berpura-pura bahwa teks sumber merupakan render visual yang telah diverifikasi.
Ekspor pratinjau berformat PNG dan PDF menggunakan tingkat kepadatan titik (PPI) pratinjau yang telah dikonfigurasi. Nilai defaultnya adalah 300 PPI, dan nilai di atas 600 PPI akan dibatasi hingga 600. SVG tetap mempertahankan ukuran vektor. Artefak sumber seperti `.drawio`, `.drawnix`, dan `.tex` dapat menyediakan file pendamping berformat `previewSvg` sehingga Obsidian dapat menampilkan dan mengekspor gambar yang siap ditinjau tanpa perlu memasukkan diagram.net, Drawnix, LaTeX, atau TikZJax ke dalam lingkungan eksekusi plugin.
Modal pratinjau juga memiliki panel diagnosis artifact. Alat render dan pemeriksaan dasar dapat menambahkan data `RenderArtifact.diagnostics`; modal tersebut akan menampilkan ringkasan diagnosis berupa jumlah kesalahan/peringatan/informasi, diikuti tingkat keparahan, jenis diagnosis, pesan, serta saran perbaikan di samping tampilan pratinjau. Ringkasan yang sama juga ditampilkan pada entri sejarah yang mendukung fitur diagnosis, sehingga percobaan pemeriksaan dasar circuitikz yang berulang dapat dibandingkan tanpa perlu membuka setiap entri secara terpisah. Untuk artifact yang memiliki konten sumber namun tidak dapat dirender secara langsung atau melalui jalur iframe HTML, modal kini beralih ke tampilan pratinjau berbasis sumber saja alih-alih memaksa penggunaan iframe kosong. Hal ini memberikan antarmuka visual yang jelas bagi pemeriksaan kompilasi/render circuitikz, pemeriksaan teks token SVG, pemeriksaan screenshot PNG kosong, laporan tumpang tindih glyph berbasis jalur saja, serta laporan tumpang tindih di masa depan, tanpa menjadikan TikZJax atau LaTeX sebagai ketergantungan runtime plugin yang wajib, maupun berpura-pura bahwa teks sumber merupakan hasil render visual yang sudah diverifikasi.
### Mode Mermaid Lama
@ -164,12 +170,12 @@ Target ini sengaja belum menjadi rute perencanaan default. Target ini tersedia s
### Draw.io dan Drawnix Batas Ekspor
Implementasi saat ini mempertahankan dukungan editor pihak ketiga di batas artefak:
Implementasi saat ini mempertahankan dukungan editor pihak ketiga di batas artefak, sambil tetap menyediakan target render yang eksplisit:
| Target | Kontrak | Ketergantungan Runtime |
|--------|----------|--------------------|
| Draw.io | `mxfile` XML yang tidak dikompresi secara deterministik dari `SemanticFigureModel` | tidak ada di runtime plugin atau CI |
| Drawnix | subset minimal `.drawnix` JSON menggunakan elemen `geometry` dan `arrow-line` | tidak ada di runtime plugin atau CI |
| Draw.io | XML `mxfile` yang deterministik dan tidak terkompresi dari `SemanticFigureModel`, ditambah file bantu berformat SVG/PNG/PDF untuk peninjauan | Tidak ada komponen semacam itu di masa eksekusi plugin maupun dalam proses CI |
| Drawnix | Subset JSON `.drawnix` yang minimal yang menggunakan elemen `geometry` dan `arrow-line`, ditambah file bantu berformat SVG/PNG/PDF untuk peninjauan | Tidak ada komponen semacam itu di masa eksekusi plugin maupun dalam proses CI |
Kompromi ini disengaja: Notemd dapat memverifikasi label yang terlihat, ID yang stabil, dan cakupan primitif yang didukung tanpa memasukkan diagram.net Desktop, Drawnix, Plait, atau keadaan editor khusus browser ke dalam plugin.
@ -213,7 +219,11 @@ Notemd kini mencakup prototipe repositori terbatas pertama untuk arah ini. Proto
npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-inverter.tex
```
Prototipe ini menambahkan batas `CircuitSpec` yang terpisah serta ekspor deterministik untuk enam keluarga referensi emas:
Prototipe ini menambahkan batas `CircuitSpec` yang terbatas serta alat ekspor yang deterministik untuk enam keluarga referensi utama:
Dalam pipeline diagram eksperimental ini, akses juga kini dapat dilakukan melalui `intent: "circuit"` dan target render `circuitikz`. File `DiagramSpec` yang dihasilkan hanya boleh memasukkan elemen `circuitSpec` untuk intent jenis circuit. `CircuitikzRenderer` menulis sumber kode `.tex` yang deterministik dan menambahkan file bantu berformat SVG yang dihasilkan dari topologi circuit yang telah diverifikasi, sehingga memungkinkan tampilan pratinjau di Obsidian serta ekspor ke format SVG/PNG/PDF. File bantu tersebut bukan hasil kompilasi LaTeX/TikZJax; bukti eksekusi renderer yang sebenarnya tetap berasal dari perintah khusus untuk verifikasi di bawahnya.
Untuk template referensi yang didukung, `layoutHints.inputSide` dan `layoutHints.outputSide` tetap merupakan kontrol yang hanya digunakan untuk presentasi. Kontrol tersebut dapat memindahkan posisi port input/output yang bersifat deterministik, namun tidak mengubah tanda tangan topologi maupun tidak memungkinkan proses perbaikan untuk menghubungkan kembali sirkuit.
| Jenis rangkaian | Referensi emas | Jaminan arus |
|--------------|------------------|-------------------|
@ -224,7 +234,7 @@ Prototipe ini menambahkan batas `CircuitSpec` yang terpisah serta ekspor determi
| `cmos-nand2` | `cmos-nand2-v1` | Memvalidasi pull-up PMOS paralel, pull-down NMOS seri, dua masukan `va` / `vb`, dan `vout` sebelum menulis LaTeX |
| `cmos-nor2` | `cmos-nor2-v1` | Memvalidasi pull-up PMOS seri, pull-down NMOS paralel, dua masukan `va` / `vb`, dan `vout` sebelum menulis LaTeX |
Ini belum merupakan generator TikZ umum. Alat ini tidak mengkompilasi LaTeX, memanggil TikZJax, memeriksa tangkapan layar, atau menjalankan perbaikan otomatis berbasis gambar. Fitur-fitur tersebut masih menjadi bagian tahap selanjutnya.
Ini bukan generator TikZ umum. Alat ini tidak menerima kode TikZ sembarangan, tidak mengompilasi LaTeX, tidak memanggil TikZJax, tidak memeriksa tangkapan layar selama masa eksekusi plugin, dan tidak menjalankan proses perbaikan otomatis berbasis umpan balik gambar. Fungsi-fungsi tersebut masih merupakan tahap selanjutnya.
Perintah Diagram Pratinjau dapat membuka kembali artefak sumber circuitikz yang disimpan langsung bila ekstensi file adalah `.tex` atau `.tikz` dan sumbernya mengandung `\usepackage{circuitikz}` atau `\begin{circuitikz}`. Jalur ini merupakan pratinjau berbasis sumber saja: tampilan modal menampilkan sumber, diagnosis, kontrol salin/simpan, serta metadata sejarah, tetapi tidak mengkompilasi LaTeX atau memanggil TikZJax selama runtime plugin.
@ -350,8 +360,8 @@ Untuk inverter CMOS, prompt seharusnya meminta topologi eksplisit beserta batasa
|------|----------------|-----------|
| Diagram umum | Pipeline berbasis spesifikasi telah diimplementasikan untuk Mermaid, JSON Canvas, Vega-Lite, HTML | Terus perluas cakupan verifikasi semantik |
| Gambar yang dapat diedit | Batas artefak `editable-html-svg`, Draw.io XML, dan Drawnix JSON telah diimplementasikan | Tambahkan primitif yang lebih kompleks hanya setelah tes membuktikan kemampuan edisi |
| Dukungan CLI | `npm run diagram:export-artifact` mengekspor HTML/SVG, Draw.io, dan Drawnix yang dapat diedit dari satu `DiagramSpec` | Menambahkan perangkat asap khusus target saat target baru dikirim |
| circuitikz | `CircuitSpec -> circuitikz` prototipe mengekspor sumber umum, inverter CMOS, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1`, dan `cmos-nor2` / `cmos-nor2-v1` template emas, proyek `layoutHints.inputSide` dan `layoutHints.outputSide` ke penempatan port input/output yang deterministik tanpa mengubah topologi, menolak penyimpangan topologi perbaikan melalui `--topology-reference`, mengeluarkan ringkasan perbaikan yang mempertahankan topologi melalui `--repair-brief-output` dan skema `notemd.circuitikz.repair-brief.v1`, mencakup konten penyerahan terstruktur `repairPrompt` dengan `diagnosticFocus`, `acceptanceCriteria`, dan peran `topology-preserving-circuitikz-repair`, memvalidasi kandidat perbaikan melalui `--repair-brief`, mengembalikan bukti gerbang `repairAcceptance` melalui skema `notemd.circuitikz.repair-acceptance.v1` dengan `readyForVisualAcceptance` dan `remainingChecks`, menyimpan bukti tersebut melalui `--repair-acceptance-output`, menganalisis log kompilasi, dapat menjalankan renderer lokal eksplisit ditambah `--expected-artifact`, SVG `--expected-svg-text`, pemeriksaan metadata aksesibilitas melalui `aria-label`, `<title>`, dan `<desc>`, pengecualian elemen SVG tersembunyi/transparan, klasifikasi `render-svg-text-path-only` / `pathOnlyGlyphUseCount` untuk label hanya jalur, pemeriksaan penempatan glyph hanya jalur untuk `<use href="#...">`, diagnosis tumpang tindih glyph hanya jalur melalui `render-svg-path-glyph-overlap`, penanganan titik arus jalur tertutup untuk `Z/z`, batas lengkung tepat untuk ekstrem A/a, batas kurva Bezier tepat untuk ekstrem C/S/Q/T, pemeriksaan tumpang tindih label dengan batas lebar garis yang disadari SVG, pemeriksaan geometri gambar `polyline` / `polygon`, geometri label yang diposisikan `tspan`, geometri teks yang diposisikan dengan memperhatikan `text-anchor`, geometri yang memperhatikan transformasi untuk SVG bounded-canvas/text-overlap dan label-vs-drawing asap melalui `render-svg-label-overlap`, serta pemeriksaan screenshot PNG nonblank / terpotong / foreground padat, termasuk palet warna indeks dengan alpha, sampel transparan grayscale/RGB tRNS, dan panduan spesifik format `render-png-unsupported` untuk PNG Adam7 interlaced dan kegagalan kedalaman bit indeks, melalui `foregroundBounds`, `foregroundDensity`, `render-png-content-clipped`, dan `render-png-foreground-dense` tanpa parsing shell, mencakup perangkat asap pemeliharaan agregat melalui `npm run diagram:smoke-circuitikz`, mencatat konfigurasi renderer yang hilang melalui `rendererAvailability.status: "missing-configuration"` dan `compile-executable-invalid`, serta memiliki diagnosis pratinjau umum, hitungan ringkasan diagnosis, entri sejarah yang memperhatikan diagnosis, dan fallback hanya sumber melalui `RenderArtifact.diagnostics` dan modal pratinjau | Menambahkan pengenalan label tingkat OCR untuk teks visual hanya jalur, pemeriksaan tumpang tindih tingkat piksel yang akurat, cakupan jalur SVG yang lebih luas bila diperlukan, instalasi/deteksi renderer otomatis hanya jika tetap opsional, dan eksekusi perbaikan yang mempertahankan topologi secara otomatis |
| Dukungan CLI | `npm run diagram:export-artifact` mengekspor bukti tinjauan berupa HTML/SVG yang dapat diedit, file Draw.io, Drawnix, Circuitikz, serta SVG/PNG/PDF dari satu `DiagramSpec` yang telah diverifikasi | Tambahkan fixture uji khusus untuk target tertentu saat versi baru dari target tersebut dirilis |
| circuitikz | `DiagramSpec(intent: "circuit", circuitSpec) -> CircuitikzRenderer -> circuitikz` mengekspor template emas untuk sumber umum, inverter CMOS, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1`, dan `cmos-nor2` / `cmos-nor2-v1`, menampilkan opsi intent UI/rendernya, menulis kode TeX beserta file pratinjau SVG/PNG/PDF, memverifikasi topologi sebelum menghasilkan output, menganalisis log kompilasi, dapat menjalankan renderer lokal secara eksplisit beserta opsi `--expected-artifact`, serta menyediakan alternatif berupa sumber kode saja ditambah diagnosis pratinjau yang terlihat melalui `RenderArtifact.diagnostics` dan modal pratinjau | Tambahkan fitur pengenalan label tingkat OCR untuk teks visual yang hanya berupa path, pemeriksaan tumpang tindih pada tingkat piksel yang lebih akurat, cakupan path SVG yang lebih luas bila diperlukan, instalasi/deteksi renderer otomatis hanya jika hal tersebut tetap dapat dipilih secara opsional, serta eksekusi perbaikan otomatis yang mempertahankan struktur topologi asli |
| Integrasi TikZJax | Host render kandidat untuk tampilan sisi Obsidian | Jadikannya opsional; jangan jadikan TikZJax sebagai ketergantungan runtime plugin yang wajib |
## Konfigurasi
@ -361,6 +371,7 @@ Untuk inverter CMOS, prompt seharusnya meminta topologi eksplisit beserta batasa
| `enableExperimentalDiagramPipeline` | `false` | Beralih antara versi berbasis spesifikasi dan versi lama Mermaid |
| `experimentalDiagramCompatibilityMode` | `'legacy-mermaid'` | `'legacy-mermaid'` = Mermaid saja; `'best-fit'` = target native + fallback |
| `preferredDiagramIntent` | `undefined` (otomatis) | Mengganti deteksi intent otomatis |
| `preferredDiagramRenderTarget` | `undefined` (otomatis) | Menggantikan renderer artefak, termasuk Draw.io, Drawnix, dan Circuitikz |
| `summarizeToMermaidLanguage` | `'en'` | Bahasa target untuk label diagram |
| `summarizeToMermaidProvider` / `Model` | DeepSeek | LLM per tugas untuk pembuatan diagram |
| `autoMermaidFixAfterGenerate` | (Dari konstanta) | Menjalankan perbaiki lama secara otomatis pada output Mermaid |
@ -380,10 +391,11 @@ Ketika diaktifkan, Notemd mengambil potongan konteks yang relevan dari basis pen
| Aksi | Metode |
|--------|--------|
| Ekspor SVG | Pembangun `mermaid.render()` / `vega.View.toSVG()` / SVG untuk Canvas |
| Ekspor PNG | SVG → Image → Canvas (rasio piksel perangkat 1x-3x) → PNG ArrayBuffer |
| Ekspor ke PNG | SVG → Gambar → Canvas / rasterizer pratinjau pada PPI yang telah dikonfigurasi → Buffer Array PNG |
| Ekspor ke PDF | SVG → gambar raster pada PPI yang telah dikonfigurasi → PDF satu halaman |
| Simpan Sumber | Konten artefak mentah disimpan dengan ekstensi khusus target |
| Pratinjau Hanya Sumber | Artefak non-inline dengan konten sumber ditampilkan sebagai kode beserta diagnosis, tanpa rendering iframe |
| Audit Semantik | Mermaid, JSON Canvas, Vega-Lite, dan HTML/SVG yang dapat diedit telah diperiksa oleh `scripts/diagram-semantic-verification.js` |
| Audit semantik | Mermaid, JSON Canvas, Vega-Lite, HTML/SVG yang dapat diedit, Draw.io, Drawnix, dan circuitikz yang terbatas diperiksa oleh `scripts/diagram-semantic-verification.js` beserta tes renderer/CLI |
**Penyimpanan dalam cache**: RenderCache menggunakan kunci JSON yang deterministik dari `{spec, target, theme}`. Proses penghapusan duplikat saat rendering mencegah hasil rendering yang sama berulang.

View file

@ -1,7 +1,7 @@
---
id: diagrams
title: "Diagrammi"
description: "Genera Mermaid, JSON Canvas, Vega-Lite, HTML, artefatti di figure editabili e diagrammi futuri con vincoli circuitikz direttamente dalle tue note, utilizzando unarchitettura basata su specifiche."
description: "Genera diagrammi Mermaid, JSON Canvas, Vega-Lite, HTML, file di immagini modificabili, Draw.io, Drawnix e diagrammi circuitikz con vincoli a partire dalle tue note, grazie a unarchitettura basata sulle specifiche tecniche"
author:
'@id': 'https://jacobinwwey.github.io/obsidian-NotEMD/#person-jacobinwwey'
keywords: [diagrams, mermaid, vega-lite, canvas, visualization, spec-first, drawio, drawnix, editable svg, circuitikz, TikZJax]
@ -18,7 +18,7 @@ import TLDR from '@site/src/components/TLDR';
# Diagrammi
<TLDR>
**Notemd genera diagrammi dalle tue note attraverso un pipeline basato su specifiche.** Il LLM produce un formato `DiagramSpec` JSON indipendente dal renderer, dopodiché adattatori dedicati lo convertono in Mermaid, JSON Canvas, Vega-Lite, HTML o output editabile HTML/SVG. Supporta 8 tipi di intent, catene di fallback automatiche, anteprima in tempo reale con esportazione in SVG/PNG, verifica semantica e generazione arricchita da conoscenze locali.
**Notemd genera diagrammi dalle tue note attraverso un flusso di lavoro basato sulle specifiche.** LLLM produce un file JSON `DiagramSpec` indipendente dal renderer, dopodiché adattatori dedicati lo convertono in output Mermaid, JSON Canvas, Vega-Lite, HTML, HTML/SVG modificabili, Draw.io, Drawnix o diagrammi circuitikz con vincoli. Supporta 9 tipi di intent, catene di fallback automatiche, anteprima in tempo reale con esportazione in SVG/PNG/PDF, verifica semantica e generazione potenziata da conoscenze locali.
</TLDR>
Questo fa parte della [Obsidian Guida alla gestione delle conoscenze AI](/docs/pillar-ai-knowledge).
@ -54,6 +54,7 @@ graph LR
| `stateDiagram` | Mermaid | HTML | Macchine a stati, modelli di ciclo di vita |
| `canvasMap` | JSON Canvas | Mermaid → HTML | Mappe concettuali, grafi di conoscenza |
| `dataChart` | Vega-Lite | Mermaid → HTML | Barre, linee, aree, dispersioni, torte, tabelle |
| `circuit` | circuitikz | none | Diagrammi circuitici con vincoli derivati da payload `CircuitSpec` validati |
## Rilevamento delle intenzioni
@ -67,6 +68,7 @@ Notemd determina il tipo di diagramma più adatto dal contenuto della nota utili
| `stateDiagram` | Stato, transizione, in attesa, in esecuzione, fallito (3+ corrispondenze) | 0.76 |
| `flowchart` | Passaggi numerati (2+) o vocabolario if/then/else/workflow | 0.74 |
| `canvasMap` | Mappa concettuale, grafo di conoscenza, spaziale, cluster | 0.72 |
| `circuit` | circuitikz, TikZJax, circuit, schematic, CMOS, NMOS, PMOS, MOSFET, VDD/GND, `vin`/`vout` | 0.78 |
| `mindmap` | Ripiego predefinito | 0.55 |
Sovrascrivere con la impostazione **Tipo di diagramma preferito**, il selezionatore nella barra laterale o unopzione esplicita della palette dei comandi.
@ -80,10 +82,9 @@ Il pipeline sperimentale basato sulle specifiche ora dispone di due controlli in
| Tipo di diagramma preferito | `preferredDiagramIntent` | Guida la forma semantica del `DiagramSpec` generato |
| Target di rendering preferito | `preferredDiagramRenderTarget` | Sceglie il renderer per gli artefatti nelle operazioni **Genera diagramma** e **Anteprima diagramma** |
Imposta **Target di rendering preferito** su **Auto** come valore predefinito per il pianificatore, oppure scegli esplicitamente Mermaid, JSON Canvas, Vega-Lite, HTML o Editable HTML/SVG. La sovrascrittura è valida solo per i comandi di generazione di artefatti e anteprime. Il comando standard **Riassumi come diagramma Mermaid** rimane legato a un output compatibile con Mermaid, così da evitare che i flussi di lavoro Markdown cambino silenziosamente formato.
Questa separazione è importante perché unintenzione `flowchart` può ora essere visualizzata come Mermaid per le note Markdown, come HTML come fallback affidabile, o come Editable HTML/SVG per modifiche successive. Draw.io e Drawnix rimangono esportatori di artefatti CLI anziché target di rendering allinterno dellplugin.
Imposta **Preferred render target** su **Auto** come valore predefinito per il pianificatore, oppure scegli esplicitamente Mermaid, JSON Canvas, Vega-Lite, HTML, Editable HTML/SVG, Draw.io, Drawnix o Circuitikz. La sovrascrittura vale solo per i comandi relativi agli artifact e alle anteprime. Il comando standard **Summarise as Mermaid diagram** rimane configurato per produrre output compatibile con Mermaid, così da non modificare silenziosamente i formati nei workflow Markdown esistenti.
Questa separazione è importante perché un intent di tipo `flowchart` può ora essere visualizzato come Mermaid per le note Markdown, come HTML per un fallback affidabile, come Editable HTML/SVG per modifiche successive, oppure come file sorgente Draw.io/Drawnix accompagnati da immagini SVG per la revisione. Un intent di tipo `circuit` viene inoltrato a Circuitikz e richiede un file `CircuitSpec` validato; non si tratta di una richiesta di testo TikZ arbitrario.
## Uso
### Genera un diagramma
@ -101,16 +102,21 @@ Questa separazione è importante perché unintenzione `flowchart` può ora es
| Vega-Lite | `.json` | `{note}_diagram.json` |
| HTML | `.html` | `{note}_diagram.html` |
| Editable HTML/SVG | `.html` | `{note}_diagram.html` |
| Draw.io | `.drawio` + `.drawio.svg` + `.drawio.md` | `{note}_diagram.drawio` insieme ai file di riferimento per la revisione |
| Drawnix | `.drawnix` + `.drawnix.svg` + `.drawnix.md` | `{note}_diagram.drawnix` insieme ai file di riferimento per la revisione |
| Circuitikz | `.tex` + `.tex.svg` + `.tex.md` | `{note}_diagram.tex` insieme ai file di riferimento per la revisione |
### Visualizza una diagramma
1. Esegui **"Notemd: Visualizza diagramma"**
2. Si apre un modulo modale con il diagramma visualizzato
3. Esporta come SVG o PNG utilizzando i pulsanti della barra degli strumenti
3. Esporta in SVG, PNG o PDF utilizzando i pulsanti della barra degli strumenti
**Apri automaticamente la visualizzazione** è disponibile nelle impostazioni — dopo la generazione, il modulo modale di anteprima si avvia automaticamente.
Il modulo modale di anteprima dispone anche di un pannello di diagnosi degli artefatti. I renderizzatori e i controlli di smoke possono aggiungere `RenderArtifact.diagnostics`; il modulo mostra un riepilogo delle diagnosi con i conteggi di errori/allarmi/informazioni, poi la gravità, il tipo di diagnosi, il messaggio e i suggerimenti per la riparazione accanto allanteprima. Lo stesso riepilogo viene visualizzato nelle voci della cronologia delle anteprime, quindi è possibile confrontare tentativi ripetuti di smoke circuitikz senza aprire ogni voce. Per gli artefatti che hanno contenuto sorgente ma non possono essere renderizzati inline o tramite il percorso iframe HTML, il modulo ora passa a unanteprima basata esclusivamente sulla sorgente invece di forzare un iframe vuoto. Questo consente ai controlli di smoke di compilazione/rendering circuitikz, alle verifiche dei token di testo SVG, alle verifiche dello screenshot PNG vuoto e ai futuri report di sovrapposizione di avere una superficie visibile UI senza rendere TikZJax o LaTeX una dipendenza obbligatoria in tempo di esecuzione del plugin o fingendo che il testo sorgente sia un rendering visivo verificato.
Lesportazione delle anteprime in PNG e PDF utilizza il livello di risoluzione PPI configurato. Il valore predefinito è 300 PPI e i valori superiori a 600 PPI vengono limitati a 600. SVG mantiene le dimensioni vettoriali. Gli artifact di origine come `.drawio`, `.drawnix` e `.tex` possono fornire un file `previewSvg` complementare, permettendo a Obsidian di visualizzare ed esportare immagini utilizzabili per la revisione senza includere diagram.net, Drawnix, LaTeX o TikZJax durante lesecuzione del plugin.
Il modulo di anteprima dispone inoltre di un pannello per le diagnosi degli artifact. I renderer e i controlli di base possono associare il valore `RenderArtifact.diagnostics`; il modulo visualizza un riepilogo delle diagnosi con i conteggi degli errori, degli avvisi e delle informazioni, seguiti dalla gravità, dal tipo di diagnosi, dal messaggio e dai suggerimenti per la correzione accanto allanteprima. Lo stesso riepilogo viene mostrato nelle voci della cronologia che supportano le diagnosi, pertanto è possibile confrontare più tentativi di verifica di circuitikz senza dover aprire ogni singola voce. Per gli artifact che dispongono di contenuto sorgente ma non possono essere visualizzati in linea o tramite il percorso delliframe HTML, il modulo ora ricorre a unanteprima basata esclusivamente sul contenuto sorgente, invece di forzare lutilizzo di un iframe vuoto. Ciò consente ai controlli di compilazione/rendering di circuitikz, alle verifiche sui token di testo SVG, alle verifiche delle screenshot PNG vuote, ai report sugli sovrapposizioni dei glifi basati esclusivamente sui percorsi e ai futuri report sugli sovrapposizioni di disporre di uninterfaccia utente visibile, senza rendere TikZJax o LaTeX una dipendenza obbligatoria in tempo di esecuzione né fingere che il testo sorgente sia già una rappresentazione visiva verificata.
### Modalità Mermaid legacy
@ -164,12 +170,12 @@ Questo obiettivo non è intenzionalmente la rotta predefinita del pianificatore.
### Draw.io e Drawnix Limiti di esportazione
Limplementazione attuale mantiene il supporto degli editor di terze parti al confine dellartefatto:
L'attuale implementazione mantiene il supporto per editor di terze parti al confine dell'artefatto, esponendo comunque target di rendering espliciti:
| Obiettivo | Contratto | Dipendenza in tempo di esecuzione |
|--------|----------|--------------------|
| Draw.io | `mxfile` XML decompresso in modo deterministico da `SemanticFigureModel` | nessuno nel runtime del plugin o nel CI |
| Drawnix | sottoset minimo di `.drawnix` JSON che utilizza elementi `geometry` e `arrow-line` | nessuno nel runtime del plugin o nel CI |
| Draw.io | XML `mxfile` non compresso e deterministico generato da `SemanticFigureModel`, unitamente a file di revisione in formato SVG/PNG/PDF | nessun componente nel runtime del plugin o nei processi CI |
| Drawnix | sottoinsieme minimo di JSON `.drawnix` che utilizza gli elementi `geometry` e `arrow-line`, unitamente a file di revisione in formato SVG/PNG/PDF | nessun componente nel runtime del plugin o nei processi CI |
Il compromesso è intenzionale: Notemd può verificare etichette visibili, ID stabili e copertura delle primitive supportate senza incorporare diagram.net Desktop, Drawnix, Plait o lo stato delleditor disponibile solo nei browser nel plugin.
@ -213,7 +219,11 @@ Notemd include ora il primo prototipo di repository vincolato per questa direzio
npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-inverter.tex
```
Il prototipo aggiunge un confine separato `CircuitSpec` e un esportatore deterministico per sei famiglie di riferimento doro:
Il prototipo introduce un confine limitato da `CircuitSpec` nonché un esportatore deterministico per sei famiglie di riferimento standard:
Nel pipeline sperimentale per i diagrammi, è ora possibile accedervi anche tramite `intent: "circuit"` e il target di rendering `circuitikz`. Il file `DiagramSpec` generato può includere un elemento `circuitSpec` soltanto quando lintento è relativo a un circuito. Il `CircuitikzRenderer` scrive lo stesso codice sorgente `.tex` deterministico e aggiunge una preview in SVG ottenuta dalla topologia del circuito validata, consentendo così la visualizzazione in Obsidian nonché lesportazione in SVG/PNG/PDF. Tale preview non rappresenta il risultato di una compilazione LaTeX/TikZJax; le prove effettive fornite dal renderer provengono comunque dai comandi specificati di seguito.
Per i template golden supportati, `layoutHints.inputSide` e `layoutHints.outputSide` rimangono controlli esclusivamente per la presentazione. Essi permettono di spostare in modo deterministico la posizione delle porte di input/output, ma non modificano la firma topologica né consentono un pass di riparazione per riconnettere i componenti del circuito.
| Tipo di circuito | Riferimento doro | Garanzia di corrente |
|--------------|------------------|-------------------|
@ -224,7 +234,7 @@ Il prototipo aggiunge un confine separato `CircuitSpec` e un esportatore determi
| `cmos-nand2` | `cmos-nand2-v1` | valida un pull-up PMOS in serie, un pull-down NMOS in parallelo, ingressi duali `va` / `vb` e `vout` prima di scrivere LaTeX |
| `cmos-nor2` | `cmos-nor2-v1` | valida un pull-up PMOS in serie, un pull-down NMOS in parallelo, ingressi duali `va` / `vb` e `vout` prima di scrivere LaTeX |
Questo non è ancora un generatore TikZ generico. Non compila LaTeX, non chiama TikZJax, non esamina le schermate né esegue riparazioni automatiche tramite feedback visivo. Queste funzionalità rimangono fasi successive.
Questo non è un generatore TikZ generico. Non accetta codice TikZ arbitrario, non compila LaTeX, non avvia TikZJax, non esamina screenshot durante lesecuzione del plugin, né esegue riparazioni automatiche basate sul feedback visivo. Queste funzionalità rimangono fasi successive.
Il comando Diagramma di anteprima può riaprire direttamente gli artefatti di sorgente salvati circuitikz quando lestensione del file è `.tex` o `.tikz` e la sorgente contiene `\usepackage{circuitikz}` o `\begin{circuitikz}`. Quel percorso è unanteprima basata esclusivamente sulla sorgente circuitikz: il modulo mostra la sorgente, le diagnosi, i controlli di copia/ salvataggio e i metadati della cronologia, ma non compila LaTeX né chiama TikZJax durante lesecuzione del plugin.
@ -350,8 +360,8 @@ Per un inverter CMOS, il prompt deve richiedere esplicitamente la topologia e i
|------|----------------|-----------|
| Diagrammi generali | Pipeline basata sulle specifiche implementata per Mermaid, JSON Canvas, Vega-Lite, HTML | Continuare ad ampliare la copertura della verifica semantica |
| Figure editabili | Sono state implementate le barriere tra gli artefatti di `editable-html-svg`, Draw.io XML e Drawnix JSON | Aggiungere primitive più ricche solo dopo che i test avranno dimostrato leditabilità |
| Supporto per CLI | `npm run diagram:export-artifact` esporta HTML/SVG, Draw.io e Drawnix editabili da un singolo `DiagramSpec` | Aggiungere fixture di smoke specifici per ogni target non appena vengono rilasciati nuovi target |
| circuitikz | Il prototipo di `CircuitSpec -> circuitikz` esporta template doro con codice sorgente comune, invertitore CMOS, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1` e `cmos-nor2` / `cmos-nor2-v1`, progetti `layoutHints.inputSide` e `layoutHints.outputSide` per una disposizione deterministica delle porte di input/output senza modificare la topologia, rifiuta le deviazioni della topologia di riparazione tramite `--topology-reference`, emette briefing di riparazione che preservano la topologia tramite `--repair-brief-output` e lo schema `notemd.circuitikz.repair-brief.v1`, include contenuti strutturati di handoff con `diagnosticFocus`, `acceptanceCriteria` e il ruolo `topology-preserving-circuitikz-repair`, verifica i candidati per la riparazione tramite `--repair-brief`, restituisce prove delle porte `repairAcceptance` tramite lo schema `notemd.circuitikz.repair-acceptance.v1` insieme a `readyForVisualAcceptance` e `remainingChecks`, mantiene tali prove tramite `--repair-acceptance-output`, analizza i log di compilazione, può eseguire render locali espliciti oltre a `--expected-artifact`, SVG `--expected-svg-text`, controlli dei metadati di accessibilità tramite `aria-label`, `<title>` e `<desc>`, esclusione degli elementi SVG nascosti/trasparenti, classificazione `render-svg-text-path-only` / `pathOnlyGlyphUseCount` per etichette a percorsi soltanto, controlli di posizionamento dei glyph a percorsi soltanto per `<use href="#...">`, diagnosi di sovrapposizione dei glyph a percorsi soltanto tramite `render-svg-path-glyph-overlap`, gestione del punto corrente per percorsi chiusi per `Z/z`, limiti esatti degli archi A/a agli estremi, limiti esatti delle curve Bézier C/S/Q/T agli estremi, controlli di sovrapposizione tra bordi sensibili alla larghezza del tratto e etichette, controlli geometrici di disegno `polyline` / `polygon`, geometria delle etichette posizionate `tspan`, geometria del testo posizionato consapevole di `text-anchor`, geometria consapevole di trasformazioni per SVG bounded-canvas/text-overlap e smoke di etichetta contro disegno tramite `render-svg-label-overlap`, nonché controlli di screenshot PNG non vuoti / recisi / a primo piano denso, inclusa lalpha della palette a colori indexati, campioni trasparenti in grigio/scuro/RGB tRNS e linee guida specifiche per il formato `render-png-unsupported` per PNG interlacciati Adam7 e errori di profondità bit indexata, tramite `foregroundBounds`, `foregroundDensity`, `render-png-content-clipped` e `render-png-foreground-dense` senza analisi della shell, include fixture di smoke aggregati per i mantentori tramite `npm run diagram:smoke-circuitikz`, registra la configurazione del renderer mancante tramite `rendererAvailability.status: "missing-configuration"` e `compile-executable-invalid`, e dispone di diagnosi di anteprima generiche, conteggi di riepilogo delle diagnosi, voci di storia consapevoli delle diagnosi e fallback basato solo sul codice sorgente tramite `RenderArtifact.diagnostics` e il modal di anteprima | Aggiungere riconoscimento delle etichette a livello OCR per testo visivo a percorsi soltanto, controlli di sovrapposizione precisi a livello di pixel, una copertura più ampia dei percorsi SVG dove necessario, installazione/discovery automatica del renderer solo se può rimanere opzionale, e esecuzione automatizzata di riparazioni che preservano la topologia |
| Supporto CLI | `npm run diagram:export-artifact` esporta file HTML/SVG modificabili, nonché prove di revisione in formato Draw.io, Drawnix, Circuitikz, SVG/PNG/PDF, provenienti da un `DiagramSpec` validato | Aggiungere fixture di test specifici per ogni target non appena vengono rilasciati nuovi target |
| circuitikz | `DiagramSpec(intent: "circuit", circuitSpec) -> CircuitikzRenderer -> circuitikz` esporta modelli gold standard per sorgenti comuni, invertitori CMOS, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1` e `cmos-nor2` / `cmos-nor2-v1`; espone le opzioni di intento UI e di destinazione di rendering, scrive file TeX accompagnati da anteprime in SVG/PNG/PDF, verifica la topologia prima delloutput, analizza i log di compilazione, permette lesecuzione di renderer locali espliciti tramite `--expected-artifact`, e mantiene una soluzione di fallback basata esclusivamente sulla sorgente, nonché visualizza le diagnosi delle anteprime tramite `RenderArtifact.diagnostics` e il modal delle anteprime | Aggiungere riconoscimento dei testi visivi basato su OCR per percorsi senza etichette, controlli di sovrapposizione precisi a livello di pixel, una copertura più ampia dei percorsi SVG dove necessario, installazione e scoperta automatica dei renderer solo se possibile mantenere lopzionalità, e esecuzione automatica di operazioni di riparazione che preservano la topologia |
| Integrazione con TikZJax | Scegliere il host di rendering per la visualizzazione sul lato Obsidian | Rimandarlo opzionale; non rendere TikZJax una dipendenza obbligatoria al runtime del plugin |
## Configurazione
@ -361,6 +371,7 @@ Per un inverter CMOS, il prompt deve richiedere esplicitamente la topologia e i
| `enableExperimentalDiagramPipeline` | `false` | Passare tra modalità basata sulle specifiche e modalità legacy Mermaid |
| `experimentalDiagramCompatibilityMode` | `'legacy-mermaid'` | `'legacy-mermaid'` = Mermaid solo; `'best-fit'` = target nativi + soluzioni di fallback |
| `preferredDiagramIntent` | `undefined` (automatico) | Sovrascrivere la rilevazione automatica delle intenzioni |
| `preferredDiagramRenderTarget` | `undefined` (automatico) | Sovrascrivere il renderizzatore degli artefatti, inclusi Draw.io, Drawnix e Circuitikz |
| `summarizeToMermaidLanguage` | `'en'` | Lingua di destinazione per le etichette del diagramma |
| `summarizeToMermaidProvider` / `Model` | DeepSeek | LLM per task specifici per la generazione del diagramma |
| `autoMermaidFixAfterGenerate` | (da costanti) | Eseguire automaticamente il correttore legacy sugli output di Mermaid |
@ -380,10 +391,11 @@ Quando abilitato, Notemd recupera frammenti di contesto rilevanti dalla base di
| Azione | Metodo |
|--------|--------|
| Esportazione SVG | Costruttore `mermaid.render()` / `vega.View.toSVG()` / SVG per Canvas |
| Esportazione PNG | SVG → Immagine → Canvas (rapporto pixel del dispositivo 1x-3x) → ArrayBuffer PNG |
| Esportazione in PNG | SVG → Immagine → Canvas / rasterizzatore di anteprima al PPI configurato → ArrayBuffer PNG |
| Esportazione in PDF | SVG → immagine rasterizzata al PPI configurato → PDF a pagina singola |
| Salvataggio della fonte | Contenuto dell'artefatto grezzo salvato con estensione specifica per il target |
| Anteprima solo della sorgente | Artefatti non inline con il contenuto della sorgente visualizzato come codice più diagnosi, senza rendering tramite iframe |
| Audit semantico | Mermaid, JSON Canvas, Vega-Lite e HTML/SVG modificabili controllati da `scripts/diagram-semantic-verification.js` |
| Controllo semantico | Verifica di Mermaid, JSON Canvas, Vega-Lite, HTML/SVG editabili, Draw.io, Drawnix e circuitikz con limitazioni tramite `scripts/diagram-semantic-verification.js` unitamente ai test del renderizzatore/CLI |
**Caching**: RenderCache utilizza una chiave deterministica JSON di `{spec, target, theme}`. La deduplicazione in tempo reale impedisce rendering duplicati.

View file

@ -1,7 +1,7 @@
---
id: diagrams
title: 図表
description: スペックファーストアーキテクチャを利用して、メモから編集可能な図形アーティファクトであるMermaid、JSON Canvas、Vega-Lite、HTML、および将来的に制約付きとなるcircuitikzの図表を生成します
description: "スペックファーストのアーキテクチャを利用して、ートからMermaid、JSON Canvas、Vega-Lite、HTML、編集可能な図形アーティファクト、Draw.io、Drawnix、および制約付きcircuitikzの図表を生成します。"
author:
'@id': 'https://jacobinwwey.github.io/obsidian-NotEMD/#person-jacobinwwey'
keywords: [diagrams, mermaid, vega-lite, canvas, visualization, spec-first, drawio, drawnix, editable svg, circuitikz, TikZJax]
@ -18,7 +18,7 @@ import TLDR from '@site/src/components/TLDR';
# 図表
<TLDR>
**Notemd**は、スペックファーストのパイプラインを通じてノートから図表を生成します。LLMはレンダラーに依存しない`DiagramSpec` JSONを作成し、専用のアダプターがそれをMermaid、JSON Canvas、Vega-Lite、HTML、または編集可能なHTML/SVG形式の出力に変換します。8種類のインテントタイプ、自動的なフォールバックチェーン、SVG/PNG出力を備えたリアルタイムプレビュー、セマンティック検証、およびローカル知識による生成強化をサポートしています。
**Notemdは、スペックファーストのパイプラインを通じてートから図表を生成します。** LLMがレンダラーに依存しない `DiagramSpec` 形式のJSONを出力し、専用のアダプターがそれをMermaid、JSON Canvas、Vega-Lite、HTML、編集可能なHTML/SVG、Draw.io、Drawnix、または制約付きcircuitikzの出力に変換します。9種類のインテントタイプ、自動的なフォールバックチェーン、SVG/PNG/PDFへのエクスポート機能を備えたリアルタイムプレビュー、セマンティック検証、およびローカル知識による強化生成にも対応しています。
</TLDR>
これは[Obsidian AI知識管理ガイド](/docs/pillar-ai-knowledge)の一部です。
@ -54,6 +54,7 @@ graph LR
| `stateDiagram` | Mermaid | HTML | ステートマシン、ライフサイクルモデル |
| `canvasMap` | JSON Canvas | Mermaid を HTML に変更します。 | 概念マップ、知識グラフ |
| `dataChart` | Vega-Lite | Mermaid を HTML に変更します。 | 棒グラフ、折れ線グラフ、面積グラフ、散布図、円グラフ、表 |
| `circuit` | circuitikz | none | 検証済みの `CircuitSpec` ペイロードから作成される制約付き回路図 |
## 意図検出
@ -67,6 +68,7 @@ Notemdはキーワードスコアリングを用いて、メモの内容から
| `stateDiagram` | ステータス、トランジション、ペンディング、実行中、失敗3件以上のマッチ | 0.76 |
| `flowchart` | 番号付きステップ2以上またはif/then/else/ワークフロー用語 | 0.74 |
| `canvasMap` | 概念マップ、知識グラフ、空間的、クラスター | 0.72 |
| `circuit` | circuitikz, TikZJax, circuit, schematic, CMOS, NMOS, PMOS, MOSFET, VDD/GND, `vin`/`vout` | 0.78 |
| `mindmap` | デフォルトのフォールバック | 0.55 |
**Preferred diagram type**設定、サイドバーのセレクタ、または明示的なコマンドパレットオプションで上書きしてください。
@ -75,15 +77,9 @@ Notemdはキーワードスコアリングを用いて、メモの内容から
実験用のスペックファーストパイプラインには、現在2つの独立したコントロールがあります
| コントロール | 設定 | エフェクト |
|---------|---------|--------|
| 希望する図の種類 | `preferredDiagramIntent` | 生成される`DiagramSpec`の意味的な形状を決定する |
| 優先レンダーターゲット | `preferredDiagramRenderTarget` | **図の生成**および**図のプレビュー**用のアーティファクトレンダラーを選択します |
プランナーのデフォルト設定として**Preferred render target**を**Auto**に設定するか、明示的にMermaid、JSON Canvas、Vega-Lite、HTML、またはEditable HTML/SVGを選択してください。この上書き設定はartifactおよびpreviewコマンドにのみ適用されます。標準の**Summarise as Mermaid diagram**コマンドはMermaid互換の出力に固定されているため、既存のMarkdownワークフローが自動的にフォーマットを変更することはありません。
この分離は重要です。なぜなら、`flowchart`のインテントをMarkdownート用にはMermaidとして、信頼性の高いフォールバック用にはHTMLとして、また後工程での編集用には編集可能なHTML/SVGとしてレンダリングできるからです。一方、Draw.ioとDrawnixは依然としてプラグイン内のレンダリング対象ではなく、CLIのアーティファクトエクスポーターのままです。
プランナーのデフォルト設定として**Preferred render target**を**Auto**に設定するか、Mermaid、JSON Canvas、Vega-Lite、HTML、Editable HTML/SVG、Draw.io、Drawnix、またはCircuitikzのいずれかを明示的に選択してください。この上書き設定はアーティファクト生成コマンドおよびプレビューコマンドにのみ適用されます。標準の**Summarise as Mermaid diagram**コマンドは引き続きMermaid互換の出力に固定されるため、既存のMarkdownワークフローが知らず知らずのうちにフォーマットが変更されることはありません。
この分離は非常に重要であり、`flowchart`インテントはMarkdownート向けにMermaidとして、堅牢なフォールバック用にHTMLとして、後工程での編集用にEditable HTML/SVGとして、またはSVGレビュー用の付随ファイルを含むDraw.io/Drawnix形式のソースアーティファクトとしてレンダリングできるようになりました。一方、`circuit`インテントはCircuitikzを経由して処理され、検証済みの `CircuitSpec` が必要です。これは任意のTikZテキストを生成するリクエストではありません。
## 使用方法
### 図を生成する
@ -101,16 +97,21 @@ Notemdはキーワードスコアリングを用いて、メモの内容から
| Vega-Lite | `.json` | `{note}_diagram.json` |
| HTML | `.html` | `{note}_diagram.html` |
| 編集可能な HTML/SVG | `.html` | `{note}_diagram.html` |
| Draw.io | `.drawio` + `.drawio.svg` + `.drawio.md` | `{note}_diagram.drawio` およびレビュー用の付随ファイル |
| Drawnix | `.drawnix` + `.drawnix.svg` + `.drawnix.md` | `{note}_diagram.drawnix` およびレビュー用の付随ファイル |
| Circuitikz | `.tex` + `.tex.svg` + `.tex.md` | `{note}_diagram.tex` およびレビュー用の付随ファイル |
### 図のプレビューを表示する
1. **"Notemd: プレビュー図"**を実行してください。
2. レンダリングされた図が表示されるモーダルが開きます
3. ツールバーのボタンを使用してSVGまたはPNG形式でエクスポートします
3. ツールバーのボタンを使用してSVG、PNG、またはPDFとしてエクスポートします
設定で「自動プレビュー表示」を有効にすることができ、生成後にプレビューモーダルが自動的に開きます。
プレビューモーダルにはアーティファクト診断パネルも備わっています。レンダラーやスモークチェックでは `RenderArtifact.diagnostics` を添付でき、モーダルにはエラー/警告/情報の件数、その後に重大度、診断の種類、メッセージ、および修復アドバイスがプレビューの横に表示されます。同じ要約はプレビュー履歴エントリにも表示されるため、各エントリを開かなくても繰り返される circuitikz スモークテストを比較できます。ソースコンテンツはあるもののインラインでのレンダリングや HTML iframe パス経由でのレンダリングができないアーティファクトの場合、モーダルは空のiframeを強制する代わりにソースのみのプレビューに切り替わります。これにより、circuitikz のコンパイル/レンダリングスモークテスト、SVG のテキストトークンチェック、PNGの空白スクリーンショットチェック、そして将来的な重複報告に対して、TikZJax やLaTeXを厳格なプラグイン実行時依存項目にすることなく、またソーステキストが検証済みの視覚レンダリングであるかのように振る舞うことなく、目に見える UI の表示面を提供します。
PNGおよびPDFのプレビューエクスポートでは、設定されているプレビュー用PPIが使用されます。デフォルトは300 PPIで、600 PPIを超える値は600に制限されます。SVGはベクターサイズのままです。`.drawio`、`.drawnix`、`.tex`といったソースアーティファクトには `previewSvg` という付随ファイルを含めることができ、これによりObsidianはdiagrams.net、Drawnix、LaTeX、TikZJaxをプラグインの実行環境内に埋め込むことなく、レビュー可能な画像を表示・エクスポートできます。
プレビューモーダルには、アーティファクトの診断パネルも用意されています。レンダラーやスモークチェックでは `RenderArtifact.diagnostics` を追加でき、モーダル上にエラー/警告/情報の件数、その後に重大度、診断の種類、メッセージ、そしてプレビューの横に修復のアドバイスが表示されます。 この同じ要約は、診断機能を備えた履歴エントリにも表示されるため、各エントリを開かなくても、繰り返し行われた circuitikz のスモークテスト結果を比較することができます。 ソースコンテンツは存在するものの、インラインでのレンダリングや HTML iframe を通じてレンダリングできないアーティファクトについては、モーダルが空の iframe を強制表示する代わりに、ソースのみを表示するプレビューに切り替わります。これにより、circuitikz のコンパイル/レンダリングスモークテスト、SVG のテキストトークンチェック、PNG の空白スクリーンショットチェック、パスのみを対象としたグリフの重なり検出、および今後実装される重なり検出機能などが、TikZJax や LaTeX を必須のプラグイン実行環境として依存させたり、ソーステキストを確認済みの視覚的レンダリング結果であるかのように扱ったりすることなく、視覚的に確認できるようになります。
### レガシー Mermaid モード
@ -164,12 +165,12 @@ Notemdはキーワードスコアリングを用いて、メモの内容から
### Draw.ioおよびDrawnixのエクスポート境界
現在の実装では、サードパーティエディタのサポートをアーティファクトの境界に留めています:
現在の実装では、サードパーティエディタのサポートをアーティファクトの境界に留めつつ、明示的なレンダーターゲットを提供しています。
| ターゲット | 契約 | 実行時依存性 |
|--------|----------|--------------------|
| Draw.io | `SemanticFigureModel`からの決定的な非圧縮形式の`mxfile` XML | プラグインの実行時やCI環境には何もありません。 |
| Drawnix | `geometry`および`arrow-line`の要素を使用したminimal `.drawnix` JSONサブセット | プラグインの実行時やCI環境には何もありません。 |
| Draw.io | `SemanticFigureModel` から得られる決定論的で圧縮されていない `mxfile` XML および SVG/PNG/PDF 形式のレビュー用ファイル | プラグインの実行時や CI では使用されない |
| Drawnix | `geometry` および `arrow-line` 要素を使用した最小限の `.drawnix` JSON サブセット、および SVG/PNG/PDF 形式のレビュー用ファイル | プラグインの実行時や CI では使用されない |
このトレードオフは意図的なものです。図表生成機能やPlait、ブラウザ専用エディタの状態をプラグインに組み込まずとも、Notemdは目に見えるラベルや安定したID、サポートされているプリミティブのカバレッジを検証できます。
@ -213,7 +214,11 @@ Notemdには、この方向性向けの最初の制約付きリポジトリプ
npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-inverter.tex
```
このプロトタイプでは、6つのゴールデンリファレンスファミリーに対して、別途の`CircuitSpec`境界と決定的なエクスポータが追加されています。
このプロトタイプでは、制約付きの `CircuitSpec` 構造と、6つのゴールデンリファレンスファミリー向けの決定論的なエクスポータが追加されています。
実験的な図表処理パイプラインにおいて、これは現在 `intent: "circuit"` およびレンダーターゲット `circuitikz` を通じてもアクセス可能です。生成される `DiagramSpec` は、回路を扱う意図の場合にのみ `circuitSpec` を含むことがあります。`CircuitikzRenderer` は同じ決定論的な `.tex` ソースを書き出し、検証済みの回路トポロジーから派生した SVG プレビューファイルを添付することで、Obsidian でのプレビューや SVG/PNG/PDF へのエクスポートを可能にします。このプレビューファイルは LaTeX/TikZJax のコンパイル結果ではなく、実際のレンダリング結果は引き続き下記の明示的なスモークコマンドによって得られます。
サポートされているゴールデンテンプレートにおいて、`layoutHints.inputSide` および `layoutHints.outputSide` は依然としてプレゼンテーション専用のコントロールです。これらを使うことで決定論的な入力/出力ポートの配置を変更できますが、トポロジーの仕様自体を変更したり、回路の再配線を行うリペア処理を実行したりすることはできません。
| 回路の種類 | ゴールデンリファレンス | 現在の保証期間 |
|--------------|------------------|-------------------|
@ -224,7 +229,7 @@ npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-in
| `cmos-nand2` | `cmos-nand2-v1` | LaTeXを書き出す前に、並列PMOSプルアップ、直列NMOSプルダウン、デュアル入力の`va` / `vb`、および`vout`を検証します |
| `cmos-nor2` | `cmos-nor2-v1` | LaTeXに書き出す前に、シリアルPMOSプルアップ、パラレルNMOSプルダウン、デュアル入力の`va` / `vb`、および`vout`を検証します |
これはまだ一般的なTikZジェネレータではありません。LaTeXをコンパイルしたり、TikZJaxを呼び出したり、スクリーンショットを確認したり、自動的な画像フィードバックによる修復を行ったりする機能はありません。これらは今後の実装段階で追加される予定です。
これは一般的な TikZ ジェネレータではありません。任意の TikZ コードの受け付け、LaTeX のコンパイル、TikZJax の呼び出し、プラグインの実行時にスクリーンショットの確認、または自動的な画像フィードバックに基づく修復処理を行うことはありません。これらの機能は後段の工程で実装されます。
Preview diagramコマンドは、ファイルの拡張子が`.tex`または`.tikz`で、ソースに`\usepackage{circuitikz}`や`\begin{circuitikz}`が含まれている場合、保存されたcircuitikzのソースアーティファクトを直接再開することができます。このルートはcircuitikzのソースのみのプレビューであり、モーダルウィンドウにはソース、診断情報、コピー/保存用のコントロール、および履歴メタデータが表示されますが、LaTeXをコンパイルしたり、プラグインの実行中にTikZJaxを呼び出したりすることはありません。
@ -350,8 +355,8 @@ CMOSインバーターの場合、「CMOSインバーターを描いて」とだ
|------|----------------|-----------|
| 一般的な図 | Mermaid、JSON Canvas、Vega-Lite、HTML向けにスペックファーストパイプラインが実装されました | 意味論的検証のカバレッジを引き続き拡大していく |
| 編集可能な図 | `editable-html-svg`、Draw.io XML、および Drawnix JSON のアーティファクト境界が実装されました | テストで編集可能性が証明された後にのみ、より高度なプリミティブを追加してください |
| CLIのサポート | `npm run diagram:export-artifact`は、1つの`DiagramSpec`から編集可能なHTML/SVG、Draw.io、およびDrawnixをエクスポートします | 新しいターゲットがリリースされた際に、そのターゲット専用のスモークフィクスチャを追加する |
| circuitikz | `CircuitSpec -> circuitikz`プロトタイプは、common-source、CMOSインバータ、`cmos-buffer` / `cmos-buffer-v1`、`cmos-transmission-gate` / `cmos-transmission-gate-v1`、`cmos-nand2` / `cmos-nand2-v1`、および`cmos-nor2` / `cmos-nor2-v1`のゴールデンテンプレートやプロジェクト`layoutHints.inputSide`、`layoutHints.outputSide`を、トポロジーを変更することなく決定的な入力/出力ポート配置に変換し、`--topology-reference`を通じてトポロジーの変動を拒否し、`--repair-brief-output`およびスキーマ`notemd.circuitikz.repair-brief.v1`を通じてトポロジーを保持する修復ブリーフを出力し、`diagnosticFocus`、`acceptanceCriteria`、および役割`topology-preserving-circuitikz-repair`を含む構造化された`repairPrompt`の引き継ぎコンテンツを提供し、`--repair-brief`を通じて修復候補を検証し、スキーマ`notemd.circuitikz.repair-acceptance.v1`を通じて`readyForVisualAcceptance`、`remainingChecks`を含むゲートエビデンスを返し、`--repair-acceptance-output`を通じてそのエビデンスを保持し、コンパイルログを解析し、明示的なローカルレンダラーおよび`--expected-artifact`、SVG `--expected-svg-text`を実行でき、`aria-label`、`<title>`、`<desc>`を通じてアクセシビリティメタデータのチェックを行い、隠し/透明なSVG要素の除外、パスのみのラベル用の`render-svg-text-path-only` / `pathOnlyGlyphUseCount`分類、`<use href="#...">`用のパスのみのグリフ配置チェック、`render-svg-path-glyph-overlap`を通じたパスのみのグリフの重なり診断、`Z/z`用のクローズドパスのカレントポイント処理、A/aアークの極値用の正確なアーク境界、C/S/Q/T曲線の極値用の正確なベジエ曲線境界、ストローク幅を考慮したSVG境界およびラベルの重なりチェック、`polyline` / `polygon`の描画幾何学的チェック、位置付けられた`tspan`ラベルの幾何学、`text-anchor`を考慮した位置付けられたテキストの幾何学、SVGのbounded-canvas/text-overlapおよびlabel-vs-drawingスモークテスト用の変換を考慮した幾何学、`foregroundBounds`、`foregroundDensity`、`render-png-content-clipped`、`render-png-foreground-dense`を通じてシェル解析なしで、インデックス付きカラーパレットのアルファ値、グレースケール/RGB tRNS透明サンプル、およびAdam7インターレースPNGやインデックス付きビット深度エラー向けの形式固有の`render-png-unsupported`ガイダンスを含み、シェル解析なしで、`npm run diagram:smoke-circuitikz`を通じて集約されたメンテナー用のスモークフィクストチェックを含み、`rendererAvailability.status: "missing-configuration"`、`compile-executable-invalid`を通じて欠落しているレンダラー設定を記録し、汎用的なプレビューディアグノスティクス、ディアグノスティクスに基づくサマリーカウント、ディアグノスティクスを考慮した履歴エントリ、および`RenderArtifact.diagnostics`およびプレビューモーダルを通じたソースのみのフォールバックを備えている | パスのみが含まれる視覚的テキストに対するOCRレベルのラベル認識機能、正確なピクセル単位での重複チェック、必要に応じたより広範なSVGパスカバレッジ、オプションとして残せる場合にのみ自動的にレンダラーのインストールや検出を行い、トポロジーを保持した自動修復処理の実行 |
| CLIサポート | `npm run diagram:export-artifact` は、検証済みの `DiagramSpec` から編集可能な HTML/SVG、Draw.io、Drawnix、Circuitikz、および SVG/PNG/PDF のレビュー証跡をエクスポートします | 新しいターゲットが出荷される際に、ターゲット固有のスモークフィクスチャを追加する |
| circuitikz | `DiagramSpec(intent: "circuit", circuitSpec) -> CircuitikzRenderer -> circuitikz` という流れで、共通ソース、CMOSインバータ、`cmos-buffer` / `cmos-buffer-v1`、`cmos-transmission-gate` / `cmos-transmission-gate-v1`、`cmos-nand2` / `cmos-nand2-v1`、および `cmos-nor2` / `cmos-nor2-v1` 用のゴールデンテンプレートがエクスポートされます。また、UIの意図やレンダリング対象のオプションも表示され、TeXコードと共にSVG/PNG/PDF形式のプレビューファイルも生成されます。出力前にトポロジーを検証し、コンパイルログを解析することができ、明示的なローカルレンダラや `--expected-artifact` オプションを使用して実行することも可能です。さらに、ソースのみのフォールバック機能や、`RenderArtifact.diagnostics` およびプレビューモーダルを通じてプレビュー時の診断情報も確認できます。 | パスのみからなる視覚的テキストに対するOCRレベルのラベル認識機能、ピクセル単位の正確なオーバーラップチェック機能、必要に応じたより広範なSVGパスのサポート機能、オプションとして残せる場合にのみ自動的にレンダラをインストール・検出する機能、そしてトポロジーを保持したまま自動的に修復処理を実行する機能の追加が予定されています。 |
| TikZJaxの統合 | Obsidian側の表示用の候補となるレンダーホスト | 任意で構いますので、TikZJaxをプラグイン実行時の必須依存項目にしないでください。 |
## 設定
@ -361,6 +366,7 @@ CMOSインバーターの場合、「CMOSインバーターを描いて」とだ
| `enableExperimentalDiagramPipeline` | `false` | spec-firstとlegacy Mermaidの間で切り替える |
| `experimentalDiagramCompatibilityMode` | `'legacy-mermaid'` | `'legacy-mermaid'`はMermaidのみです。`'best-fit'`はネイティブターゲットとフォールバックです。 |
| `preferredDiagramIntent` | `undefined` (自動) | 自動インテント検出を上書きする |
| `preferredDiagramRenderTarget` | `undefined` (自動) | Draw.io、Drawnix、Circuitikz を含むアーティファクトレンダラーを上書きする |
| `summarizeToMermaidLanguage` | `'en'` | 図のラベル用の対象言語 |
| `summarizeToMermaidProvider` / `Model` | DeepSeek | 図面生成のタスクごとのLLM |
| `autoMermaidFixAfterGenerate` | (定数から) | Mermaidの出力に対してレガシー修正ツールを自動実行する |
@ -380,10 +386,11 @@ CMOSインバーターの場合、「CMOSインバーターを描いて」とだ
| アクション | メソッド |
|--------|--------|
| SVG export | Canvas用の`mermaid.render()` / `vega.View.toSVG()` / SVGビルダー |
| PNGエクスポート | SVG → 画像 → キャンバス(デバイスピクセル比 1x3x→ PNG ArrayBuffer |
| PNG 出力 | SVG → 画像 → 設定された PPI でのキャンバス/プレビューレスタライザー → PNG ArrayBuffer |
| PDF 出力 | SVG → 設定された PPI でのレスタ画像 → 単一ページの PDF |
| ソースの保存 | ターゲット固有の拡張子を使用して、Raw artifactのコンテンツが保存されました |
| ソースのみのプレビュー | コードとして表示されるソースコンテンツと診断情報を含む、iframeでレンダリングされないンインラインアーティファクト |
| セマンティック監査 | Mermaid、JSON Canvas、Vega-Lite、および編集可能なHTML/SVGは`scripts/diagram-semantic-verification.js`によってチェックされました |
| 意味論的監査 | `scripts/diagram-semantic-verification.js` およびレンダラーCLI テストによって、Mermaid、JSON Canvas、Vega-Lite、編集可能な HTML/SVG、Draw.io、Drawnix、制約付き Circuitikz がチェックされる |
**キャッシング**: RenderCacheは`{spec, target, theme}`の決定的なJSONキーを使用します。インフライト重複排除により、重複したレンダリングが防がれます。

View file

@ -1,7 +1,7 @@
---
id: diagrams
title: 다이어그램
description: 스펙-퍼스트 아키텍처를 활용하여 노트에서 Mermaid, JSON Canvas, Vega-Lite, HTML와 같은 편집 가능한 그림 자산과 향후 제약이 적용될 circuitikz 다이어그램을 생성하세요.
description: "사양 기반 아키텍처를 활용하여 노트에서 Mermaid, JSON Canvas, Vega-Lite, HTML, 편집 가능한 그래프 자산, Draw.io, Drawnix, 그리고 제약이 적용된 circuitikz 다이어그램을 생성합니다."
author:
'@id': 'https://jacobinwwey.github.io/obsidian-NotEMD/#person-jacobinwwey'
keywords: [diagrams, mermaid, vega-lite, canvas, visualization, spec-first, drawio, drawnix, editable svg, circuitikz, TikZJax]
@ -18,7 +18,7 @@ import TLDR from '@site/src/components/TLDR';
# 다이어그램
<TLDR>
**Notemd는 스펙 기반의 파이프라인을 통해 사용자의 노트에서 다이어그램을 생성합니다.** LLM은 렌더러와 무관한 `DiagramSpec` JSON를 만들어내고, 전용 어댑터들이 이를 Mermaid, JSON Canvas, Vega-Lite, HTML 형태나 편집 가능한 HTML/SVG 형태의 출력물로 변환합니다. 8가지 의도 유형, 자동 페일백 체인, SVG/PNG 내보내기 기능을 갖춘 실시간 미리보기, 의미론적 검증, 그리고 로컬 지식을 활용한 생성 기능을 지원합니다.
**Notemd은 사양 기반 파이프라인을 통해 노트에서 다이어그램을 생성합니다.** LLM은 렌더러와 무관한 `DiagramSpec` JSON을 생성하며, 이후 전용 어댑터들이 이를 Mermaid, JSON Canvas, Vega-Lite, HTML, 편집 가능한 HTML/SVG, Draw.io, Drawnix, 혹은 제약이 적용된 circuitikz 형태로 변환합니다. 9가지 의도 유형을 지원하며, 자동 대체 체인, SVG/PNG/PDF 내보내기 기능이 포함된 실시간 미리 보기, 의미론적 검증, 그리고 로컬 지식을 활용한 생성 기능도 제공합니다.
</TLDR>
이것은 [Obsidian AI 지식 관리 가이드](/docs/pillar-ai-knowledge)의 일부입니다.
@ -54,6 +54,7 @@ graph LR
| `stateDiagram` | Mermaid | HTML | 상태 머신, 라이프사이클 모델 |
| `canvasMap` | JSON Canvas | Mermaid → HTML | 개념 지도, 지식 그래프 |
| `dataChart` | Vega-Lite | Mermaid → HTML | 바, 선, 면, 산점, 파이, 표 |
| `circuit` | circuitikz | none | 유효한 `CircuitSpec` 데이터를 기반으로 한 제약이 적용된 회로 다이어그램 |
## 의도 감지
@ -67,6 +68,7 @@ Notemd는 키워드 점수를 활용하여 노트의 내용에서 가장 적합
| `stateDiagram` | 상태, 전환, 대기 중, 실행 중, 실패 (3개 이상 일치) | 0.76 |
| `flowchart` | 번호가 매겨진 단계(2개 이상) 또는 if/then/else/workflow 관련 용어 | 0.74 |
| `canvasMap` | 개념 지도, 지식 그래프, 공간적, 클러스터 | 0.72 |
| `circuit` | circuitikz, TikZJax, circuit, schematic, CMOS, NMOS, PMOS, MOSFET, VDD/GND, `vin`/`vout` | 0.78 |
| `mindmap` | 기본 대체값 | 0.55 |
**Preferred diagram type** 설정이나 사이드바 선택기, 혹은 명시적인 커맨드 팔레트 옵션을 사용하여 재정의합니다.
@ -80,10 +82,9 @@ Notemd는 키워드 점수를 활용하여 노트의 내용에서 가장 적합
| 선호하는 다이어그램 유형 | `preferredDiagramIntent` | 생성된 `DiagramSpec`의 의미적 형태를 안내합니다. |
| 선호하는 렌더 타겟 | `preferredDiagramRenderTarget` | **다이어그램 생성** 및 **다이어그램 미리보기**에 사용할 아티팩트 렌더러를 선택합니다. |
플래너의 기본 설정으로 **Preferred render target**을 **Auto**로 지정하거나, Mermaid, JSON Canvas, Vega-Lite, HTML 또는 Editable HTML/SVG를 명시적으로 선택할 수 있습니다. 이러한 재지정은 artifact 및 preview 명령에만 적용됩니다. 기존의 **Summarise as Mermaid diagram** 명령은 Mermaid와 호환되는 출력 형식을 그대로 유지하므로 기존의 Markdown 작업 흐름이 자동으로 형식이 변경되는 일은 없습니다.
이러한 분리는 중요한데, 이제 `flowchart` 인텐트를 Markdown 노트의 경우 Mermaid 형태로, 안정적인 대체 옵션으로는 HTML 형태로, 그리고 후속 편집을 위해 편집 가능한 HTML/SVG 형태로 표현할 수 있기 때문입니다. Draw.io와 Drawnix는 플러그인 내에서의 렌더링 대상이 아닌 CLI 형태의 아티팩트 내보내기 도구로 남아 있습니다.
플래너의 기본 설정으로 **Preferred render target**를 **Auto**로 지정하거나, Mermaid, JSON Canvas, Vega-Lite, HTML, Editable HTML/SVG, Draw.io, Drawnix, Circuitikz 중 원하는 형식을 명시적으로 선택할 수 있습니다. 이러한 재지정은 오직 자산 및 미리 보기 관련 명령에만 적용됩니다. 기존 Markdown 작업 흐름이 은밀하게 형식이 변경되는 것을 방지하기 위해, **Summarise as Mermaid diagram** 명령은 계속해서 Mermaid와 호환되는 형태로 출력됩니다.
이러한 분리가 중요한 이유는 이제 `flowchart` 의도는 Markdown 노트의 경우 Mermaid로, 안정적인 대체용으로는 HTML로, 후속 편집을 위해 Editable HTML/SVG로, 혹은 SVG 검토 파일과 함께 제공되는 Draw.io/Drawnix 형태의 소스 자산으로도 렌더링될 수 있기 때문입니다. 반면 `circuit` 의도는 Circuitikz를 사용하며 유효한 `CircuitSpec`이 필요하므로, 임의의 TikZ 텍스트를 요청하는 것과는 다릅니다.
## 사용법
### 다이어그램 생성
@ -101,16 +102,21 @@ Notemd는 키워드 점수를 활용하여 노트의 내용에서 가장 적합
| Vega-Lite | `.json` | `{note}_diagram.json` |
| HTML | `.html` | `{note}_diagram.html` |
| 편집 가능한 HTML/SVG | `.html` | `{note}_diagram.html` |
| Draw.io | `.drawio` + `.drawio.svg` + `.drawio.md` | `{note}_diagram.drawio` 및 검토용 파일들 |
| Drawnix | `.drawnix` + `.drawnix.svg` + `.drawnix.md` | `{note}_diagram.drawnix` 및 검토용 파일들 |
| Circuitikz | `.tex` + `.tex.svg` + `.tex.md` | `{note}_diagram.tex` 및 검토용 파일들 |
### 다이어그램 미리 보기
1. **"Notemd: Preview diagram"**을 실행하세요.
2. 렌더링된 다이어그램과 함께 모달 창이 열립니다.
3. 도구 모음 버튼을 사용하여 SVG 또는 PNG 형식으로 내보내기
3. 도구 모음 버튼을 사용하여 SVG, PNG 또는 PDF 형태로 내보냅니다.
설정에서 **자동 미리보기** 기능을 사용할 수 있습니다. 생성이 완료되면 미리보기 모달이 자동으로 열립니다.
프리뷰 모달에는 아티팩트 진단 패널도 있습니다. 렌더러와 스모크 체크는 `RenderArtifact.diagnostics`를 연결할 수 있으며, 모달은 프리뷰 옆에 오류/경고/정보의 개수와 그 심각도, 진단 유형, 메시지, 수리 방법 등이 포함된 진단 요약을 표시합니다. 동일한 요약은 프리뷰 기록 항목에도 표시되므로 각 항목을 일일이 열지 않고 반복된 circuitikz 스모크 시도를 비교할 수 있습니다. 소스 콘텐츠는 있지만 인라인으로 또는 HTML iframe 경로를 통해 렌더링할 수 없는 아티팩트의 경우, 이제 모달은 빈 iframe을 강제하는 대신 소스만 표시하는 프리뷰로 전환됩니다. 이를 통해 circuitikz 컴파일/렌더링 스모크 테스트, SVG 텍스트 토큰 검사, PNG 빈 스크린샷 검사, 그리고 향후의 중복 보고 기능들이 UI 형태로 명확하게 표시될 수 있으며, TikZJax나 LaTeX를 반드시 플러그인 런타임 의존성으로 만들거나 소스 텍스트가 검증된 시각적 렌더링이라고 가정할 필요가 없습니다.
PNG 및 PDF 미리 보기 내보내기 시에는 설정된 미리 보기 PPI가 적용됩니다. 기본값은 300 PPI이며, 600 PPI를 초과하는 값은 600으로 제한됩니다. SVG의 경우는 벡터 크기 그대로 유지됩니다. `.drawio`, `.drawnix`, `.tex`와 같은 소스 자산들은 `previewSvg`라는 보조 파일을 제공함으로써, Obsidian이 diagram.net, Drawnix, LaTeX, TikZJax를 플러그인 실행 환경에 포함시키지 않고도 검토 가능한 이미지를 표시하고 내보낼 수 있게 해줍니다.
프리뷰 모달에도 애셋 진단 패널이 존재합니다. 렌더러와 스모크 체크는 `RenderArtifact.diagnostics`를 연결할 수 있으며, 모달은 프리뷰 옆에 오류/경고/정보의 개수와 그 심각도, 진단 유형, 메시지, 그리고 수정 방법에 대한 요약 정보를 표시합니다. 이와 동일한 요약 정보는 진단 기능이 적용된 기록 항목들에서도 표시되므로, 각 항목을 일일이 열어보지 않고도 반복적으로 수행된 circuitikz 스모크 테스트 결과들을 비교할 수 있습니다. 소스 콘텐츠는 있지만 인라인으로 또는 HTML iframe 경로를 통해 렌더링할 수 없는 애셋의 경우, 이제 모달은 빈 iframe을 강제로 표시하는 대신 소스 코드만 보여주는 프리뷰로 전환됩니다. 이를 통해 circuitikz 컴파일/렌더링 스모크 테스트, SVG 텍스트 토큰 검사, PNG 빈 스크린샷 검사, 경로만 기반으로 하는 글리프 중첩 보고서, 그리고 향후 등장할 추가적인 중첩 보고서들이 TikZJax나 LaTeX와 같은 플러그인 런타임 의존성 없이도 시각적으로 확인될 수 있게 됩니다.
### 레거시 Mermaid 모드
@ -164,12 +170,12 @@ Notemd는 키워드 점수를 활용하여 노트의 내용에서 가장 적합
### Draw.io 및 Drawnix 내보내기 경계
현재 구현은 서드파티 에디터 지원을 아티팩트 경계에 그대로 유지합니다:
현재의 구현 방식은 명시적인 렌더링 대상을 제공하는 동시에, 서드파티 에디터 지원 기능을 아티팩트 경계 외부에 유지합니다:
| 타겟 | 계약 | 실행 시간 의존성 |
|--------|----------|--------------------|
| Draw.io | `SemanticFigureModel`에서 추출된 결정론적 압축 해제된 `mxfile` XML | 플러그인 런타임이나 CI에서는 없음 |
| Drawnix | `geometry`와 `arrow-line` 요소를 사용한 최소 `.drawnix` JSON 하위 집합 | 플러그인 런타임이나 CI에서는 없음 |
| Draw.io | `SemanticFigureModel`에서 생성된 결정론적이고 압축되지 않은 `mxfile` XML 형식, 그리고 SVG/PNG/PDF 형태의 검토용 파일들 | 플러그인 실행 시나 CI 환경에서는 해당 기능 없음 |
| Drawnix | `geometry` 및 `arrow-line` 요소를 사용하는 최소한의 `.drawnix` JSON 하위 집합, 그리고 SVG/PNG/PDF 형태의 검토용 파일들 | 플러그인 실행 시나 CI 환경에서는 해당 기능 없음 |
이러한 타협은 의도적인 것입니다. Notemd는 diagrams.net Desktop, Drawnix, Plait, 또는 브라우저 전용 에디터 상태를 플러그인에 포함시키지 않고도 가시적인 레이블, 안정적인 ID, 그리고 지원되는 프리미티브 커버리지를 확인할 수 있습니다.
@ -213,7 +219,11 @@ Notemd에는 이 방향을 위한 첫 번째 제약이 적용된 리포지토리
npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-inverter.tex
```
이 프로토타입은 6개의 골든 리퍼런스 패밀리에 대해 별도의 `CircuitSpec` 경계와 결정론적 엑스포터를 추가합니다.
이 프로토타입은 제한된 `CircuitSpec` 경계와 6가지 골든 리퍼런스 패밀리에 대한 결정론적인 내보내기 기능을 추가합니다:
실험적인 다이어그램 파이프라인에서는 이제 `intent: "circuit"` 및 렌더링 대상 `circuitikz`를 통해 이 기능에 접근할 수도 있습니다. 생성된 `DiagramSpec`은 회로 관련 작업의 경우에만 `circuitSpec`을 포함할 수 있습니다. `CircuitikzRenderer`는 동일한 결정론적인 `.tex` 소스를 작성하고, 검증된 회로 토폴로지에서 파생된 SVG 미리보기 파일을 함께 첨부하여 Obsidian 미리보기 기능과 SVG/PNG/PDF 내보내기 기능을 지원합니다. 이 미리보기 파일은 LaTeX/TikZJax 컴파일 결과가 아니며, 실제 렌더링 증거는 아래에 명시된 명령어들에서 확인할 수 있습니다.
지원되는 골든 템플릿의 경우, `layoutHints.inputSide`와 `layoutHints.outputSide`는 단순히 표시용으로만 사용되는 제어 항목입니다. 이들은 결정론적인 입력/출력 포트의 위치를 조정할 수는 있지만, 토폴로지의 구조 자체를 변경하거나 회로를 재연결하기 위한 수정 과정을 제공하지는 않습니다.
| 회로 종류 | 골든 리퍼런스 | 현재 보증 기간 |
|--------------|------------------|-------------------|
@ -224,7 +234,7 @@ npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-in
| `cmos-nand2` | `cmos-nand2-v1` | LaTeX를 작성하기 전에 병렬 PMOS 풀업, 직렬 NMOS 풀다운, 듀얼 입력 `va` / `vb`, 그리고 `vout`를 검증합니다. |
| `cmos-nor2` | `cmos-nor2-v1` | LaTeX로 작성하기 전에 시리즈 PMOS 풀업, 병렬 NMOS 풀다운, 듀얼 입력 `va` / `vb`, 그리고 `vout`를 검증합니다. |
것은 아직 일반적인 TikZ 생성기가 아닙니다. LaTeX를 컴파일하거나 TikZJax을 호출하거나 스크린샷을 검사하거나 자동화된 이미지 피드백 복구 기능을 수행하지 않습니다. 이러한 기능들은 나중에 추가될 예정입니다.
도구는 일반적인 TikZ 생성기가 아닙니다. 임의의 TikZ 코드를 받아들이거나 LaTeX를 컴파일하거나 TikZJax를 호출하거나, 플러그인 실행 시간 동안 스크린샷을 확인하거나 자동화된 이미지 피드백 기반의 수정 기능을 제공하지 않습니다. 이러한 기능들은 향후 단계에서 추가될 예정입니다.
Preview diagram 명령어는 파일 확장자가 `.tex` 또는 `.tikz`이고 소스에 `\usepackage{circuitikz}` 또는 `\begin{circuitikz}`가 포함된 경우 저장된 circuitikz 소스 파일들을 직접 다시 열 수 있습니다. 이 방식은 circuitikz 형태의 소스 전용 미리보기입니다. 모달 창에는 소스 코드, 진단 정보, 복사/저장 버튼, 그리고 기록 메타데이터가 표시되지만, LaTeX를 컴파일하거나 플러그인 실행 중에 TikZJax을 호출하지는 않습니다.
@ -350,8 +360,8 @@ CMOS 인버터의 경우, 단순히 “CMOS 인버터를 그려주세요”라
|------|----------------|-----------|
| 일반 다이어그램 | Mermaid, JSON Canvas, Vega-Lite, HTML를 위해 스펙-퍼스트 파이프라인이 구현되었습니다. | 의미론적 검증 커버리지를 계속 확장해 나가세요. |
| 편집 가능한 그림 | `editable-html-svg`, Draw.io XML, 그리고 Drawnix JSON 아티팩트 경계가 구현되었습니다 | 테스트를 통해 편집 가능성이 입증된 후에만 더 다양한 프리미티브를 추가하십시오. |
| CLI 지원 | `npm run diagram:export-artifact`는 하나의 `DiagramSpec`에서 편집 가능한 HTML/SVG, Draw.io, 그리고 Drawnix를 내보냅니다. | 새로운 타겟이 배포될 때 타겟별 스모크 픽스처를 추가합니다. |
| circuitikz | `CircuitSpec -> circuitikz` 프로토타입은 공통 소스, CMOS 인버터, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1`, 그리고 `cmos-nor2` / `cmos-nor2-v1`의 골든 템플릿과 프로젝트 `layoutHints.inputSide` 및 `layoutHints.outputSide`을 토폴로지를 변경하지 않고 결정론적인 입출력 포트 배치로 내보내며, `--topology-reference`을 통해 수리 토폴로지의 변동을 거부하고 `--repair-brief-output` 및 스키마 `notemd.circuitikz.repair-brief.v1`을 통해 토폴로지를 보존하는 수리 요약 정보를 생성하며, `diagnosticFocus`, `acceptanceCriteria`, 그리고 역할 `topology-preserving-circuitikz-repair`가 포함된 구조화된 `repairPrompt` 인계 콘텐츠를 제공하고, `--repair-brief`을 통해 수리 후보를 검증하며, 스키마 `notemd.circuitikz.repair-acceptance.v1`을 통해 `readyForVisualAcceptance` 및 `remainingChecks`와 함께 `repairAcceptance` 게이트 증거를 반환하고, `--repair-acceptance-output`을 통해 해당 증거를 보존하며, 컴파일 로그를 파싱할 수 있고 명시적인 로컬 렌더러와 `--expected-artifact`, SVG `--expected-svg-text`를 실행할 수 있으며, `aria-label`, `<title>`, `<desc>`을 통해 접근성 메타데이터를 확인하고, 숨겨진/투명한 SVG 요소를 제외하며, 경로 전용 레이블에 대한 `render-svg-text-path-only` / `pathOnlyGlyphUseCount` 분류와 `<use href="#...">`을 위한 경로 전용 글리프 배치 확인, `render-svg-path-glyph-overlap`을 통한 경로 전용 글리프 중첩 진단, `Z/z`을 위한 클로즈드 패스 현재점 처리, A/a 곡선 극값에 대한 정확한 호 경계, C/S/Q/T 곡선 극값에 대한 정확한 베지어 곡선 경계, 스트로크 너비를 고려한 SVG 경계 및 레이블 중첩 확인, `polyline` / `polygon` 드로잉 기하학 확인, 위치 지정된 `tspan` 레이블 기하학, `text-anchor`을 고려한 위치 지정된 텍스트 기하학, SVG bounded-canvas/text-overlap 및 레이블 대 드로잉 검증을 위한 변환을 고려한 기하학, `render-svg-label-overlap`을 통한 PNG 비공백/클리핑/밀도 높은 프론트그라운드 스크린샷 검증, 인덱싱된 색상 팔레트 알파, 그레이스케일/RGB tRNS 투명 샘플, 그리고 Adam7 인터레이스 PNG 및 인덱싱된 비트 깊이 오류에 대한 형식별 `render-png-unsupported` 가이드라인을 포함하며, 셸 파싱 없이 `foregroundBounds`, `foregroundDensity`, `render-png-content-clipped`, `render-png-foreground-dense`을 통해 처리되고, `npm run diagram:smoke-circuitikz`를 통해 집계된 유지보수자 검증 고정장치를 포함하며, `rendererAvailability.status: "missing-configuration"` 및 `compile-executable-invalid`을 통해 누락된 렌더러 설정을 기록하고, 일반적인 미리보기 진단 기능, 진단 요약 카운트, 진단 정보를 고려한 이력 항목, 그리고 `RenderArtifact.diagnostics` 및 미리보기 모달을 통한 소스 전용 대체 방안을 제공합니다. | 경로만 포함된 시각적 텍스트에 OCR 수준의 레이블 인식 기능을 추가하고, 정밀한 픽셀 단위의 중첩 검사를 수행하며, 필요한 경우 더 넓은 SVG 경로 범위를 지원합니다. 선택 사항으로 남을 수 있을 때에만 자동 렌더러 설치/검색 기능을 제공하고, 자동화된 토폴로지 보존형 복구 작업을 실행합니다. |
| CLI 지원 | `npm run diagram:export-artifact`는 검증된 하나의 `DiagramSpec`에서 편집 가능한 HTML/SVG, Draw.io, Drawnix, Circuitikz 형식의 파일과 SVG/PNG/PDF 형태의 리뷰용 증거 자료를 내보냅니다. | 새로운 대상 환경이 배포될 때 해당 대상에 맞는 스모크 픽스처를 추가합니다. |
| circuitikz | `DiagramSpec(intent: "circuit", circuitSpec) -> CircuitikzRenderer -> circuitikz`는 커먼 소스, CMOS 인버터, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1`, 그리고 `cmos-nor2` / `cmos-nor2-v1`용 골든 템플릿을 내보내며, UI 의도 및 렌더링 대상 관련 옵션들을 제공합니다. 또한 TeX 코드와 함께 SVG/PNG/PDF 형태의 미리보기 파일도 생성하고, 출력하기 전에 회로 구조를 검증하며 컴파일 로그를 파싱할 수 있습니다. 명시적인 로컬 렌더러를 사용하거나 `--expected-artifact` 옵션을 지정할 수도 있으며, 소스 파일만으로도 작동하는 대체 방식과 함께 `RenderArtifact.diagnostics` 및 미리보기 모달을 통해 미리보기 관련 진단 정보를 확인할 수 있습니다. | 경로만 포함된 시각적 텍스트에 대한 OCR 수준의 레이블 인식 기능, 정밀한 픽셀 단위의 중첩 검사 기능, 필요한 경우 보다 광범위한 SVG 경로 지원 기능, 선택 사항으로 남을 수 있는 경우에만 자동으로 렌더러를 설치하거나 찾아주는 기능, 그리고 회로 구조를 그대로 유지하면서 자동으로 오류를 수정해 주는 기능을 추가할 예정입니다. |
| TikZJax 통합 | Obsidian-쪽 디스플레이용 후보 렌더 호스트 | 선택 사항으로 남겨두세요. TikZJax을 필수적인 플러그인 런타임 의존성으로 만들지 마세요. |
## 구성 설정
@ -361,6 +371,7 @@ CMOS 인버터의 경우, 단순히 “CMOS 인버터를 그려주세요”라
| `enableExperimentalDiagramPipeline` | `false` | spec-first와 legacy Mermaid 사이를 전환합니다. |
| `experimentalDiagramCompatibilityMode` | `'legacy-mermaid'` | `'legacy-mermaid'`는 Mermaid만 가능하며, `'best-fit'`은 기본 대상과 예비 대상입니다. |
| `preferredDiagramIntent` | `undefined` (자동) | 자동 의도 감지를 무시하기 |
| `preferredDiagramRenderTarget` | `undefined` (자동) | Draw.io, Drawnix, Circuitikz를 포함한 아티팩트 렌더러를 재정의하기 |
| `summarizeToMermaidLanguage` | `'en'` | 다이어그램 레이블의 대상 언어 |
| `summarizeToMermaidProvider` / `Model` | DeepSeek | 다이어그램 생성 시 작업별 LLM |
| `autoMermaidFixAfterGenerate` | (상수에서) | Mermaid 출력 결과에 대해 레거시 픽서를 자동으로 실행합니다. |
@ -380,10 +391,11 @@ CMOS 인버터의 경우, 단순히 “CMOS 인버터를 그려주세요”라
| 동작 | 메서드 |
|--------|--------|
| SVG export | Canvas용 `mermaid.render()` / `vega.View.toSVG()` / SVG 빌더 |
| PNG 내보내기 | SVG → 이미지 → 캔버스 (디바이스 픽셀 비율 1x-3x) → PNG ArrayBuffer |
| PNG 내보내기 | SVG → 이미지 → 설정된 PPI에 따른 캔버스/프리뷰 래스터라이저 → PNG ArrayBuffer |
| PDF 내보내기 | SVG → 설정된 PPI에 따른 래스터 이미지 → 단일 페이지 PDF |
| 소스 저장 | 대상에 맞는 확장자를 사용하여 원시 아티팩트 콘텐츠가 저장되었습니다. |
| 소스 전용 미리보기 | 코드 형태로 표시된 소스 콘텐츠와 진단 정보를 포함하며 iframe을 사용하지 않고 표시되는 비인라인 아티팩트 |
| 의미론적 감사 | Mermaid, JSON Canvas, Vega-Lite, 그리고 편집 가능한 HTML/SVG는 `scripts/diagram-semantic-verification.js`에 의해 확인됨 |
| 의미론적 감사 | `scripts/diagram-semantic-verification.js`와 렌더러/CLI 테스트를 통해 Mermaid, JSON Canvas, Vega-Lite, 편집 가능한 HTML/SVG, Draw.io, Drawnix 및 제한된 Circuitikz가 검사됨 |
**캐싱**: RenderCache는 `{spec, target, theme}`의 결정론적인 JSON 키를 사용합니다. 전송 중 중복 제거 기능을 통해 중복된 렌더링을 방지합니다.

View file

@ -1,7 +1,7 @@
---
id: diagrams
title: "Diagram"
description: "Jana Mermaid, JSON Canvas, Vega-Lite, HTML, artifak rajah yang boleh diubah suai, serta diagram circuitikz yang terhad pada masa depan daripada nota anda menggunakan seni bina berdasarkan spesifikasi terlebih dahulu"
description: "Jana diagram Mermaid, JSON Canvas, Vega-Lite, HTML, artifak gambar yang boleh diedit, Draw.io, Drawnix, dan diagram circuitikz terhad daripada nota anda menggunakan reka bentuk berasaskan spesifikasi terlebih dahulu"
author:
'@id': 'https://jacobinwwey.github.io/obsidian-NotEMD/#person-jacobinwwey'
keywords: [diagrams, mermaid, vega-lite, canvas, visualization, spec-first, drawio, drawnix, editable svg, circuitikz, TikZJax]
@ -18,7 +18,7 @@ import TLDR from '@site/src/components/TLDR';
# Diagram
<TLDR>
**Notemd menjana diagram daripada nota anda melalui saluran kerja berdasarkan spesifikasi terlebih dahulu.** LLM menghasilkan `DiagramSpec` JSON yang tidak bergantung pada penghasilan, kemudian penyesuai khusus menukarkannya kepada Mermaid, JSON Canvas, Vega-Lite, HTML, atau output HTML/SVG yang boleh diubah suai. Ia menyokong 8 jenis niat, rantaian penggantian automatik, pratonton masa nyata dengan eksport SVG/PNG, pengesahan semantik, dan penjanaan yang diperkukuh dengan pengetahuan tempatan.
**Notemd menjana diagram daripada nota anda melalui proses berdasarkan spesifikasi terlebih dahulu.** LLM menghasilkan fail JSON `DiagramSpec` yang tidak bergantung pada pengolah, kemudian penyesuai khusus menukarkannya kepada format Mermaid, JSON Canvas, Vega-Lite, HTML, HTML/SVG yang boleh diedit, Draw.io, Drawnix, atau output circuitikz terhad. Ia menyokong 9 jenis niat, rantaian penggantian automatik, pratonton masa nyata dengan eksport SVG/PNG/PDF, pengesahan semantik, serta penjanaan yang diperkukuh dengan pengetahuan tempatan.
</TLDR>
Ini merupakan sebahagian daripada [Obsidian Panduan Pengurusan Pengetahuan AI](/docs/pillar-ai-knowledge).
@ -54,6 +54,7 @@ graph LR
| `stateDiagram` | Mermaid | HTML | Mesin keadaan, model kitaran hayat |
| `canvasMap` | JSON Canvas | Mermaid → HTML | Peta konsep, graf pengetahuan |
| `dataChart` | Vega-Lite | Mermaid → HTML | Bar, garis, kawasan, serakan, pai, jadual |
| `circuit` | circuitikz | tiada | Diagram circuit terhad daripada beban data `CircuitSpec` yang telah disahkan |
## Pengesanan niat
@ -67,6 +68,7 @@ Notemd menentukan jenis diagram terbaik berdasarkan kandungan nota anda mengguna
| `stateDiagram` | Keadaan, peralihan, menunggu, sedang berjalan, gagal (3+ padanan) | 0.76 |
| `flowchart` | Langkah bernombor (2+) atau perbendaharaan istilah if/then/else/workflow | 0.74 |
| `canvasMap` | Peta konsep, graf pengetahuan, ruang, kluster | 0.72 |
| `circuit` | circuitikz, TikZJax, circuit, schematic, CMOS, NMOS, PMOS, MOSFET, VDD/GND, `vin`/`vout` | 0.78 |
| `mindmap` | Pilihan lalai | 0.55 |
Gantikan dengan tetapan **Jenis diagram yang diutamakan**, pemilih di sidebar, atau pilihan palet arahan yang jelas.
@ -80,10 +82,9 @@ Pipelajn eksperimen berasaskan spesifikasi kini mempunyai dua kawalan bebas:
| Jenis diagram yang diutamakan | `preferredDiagramIntent` | Membimbing bentuk semantik `DiagramSpec` yang dihasilkan |
| Sasaran render yang diutamakan | `preferredDiagramRenderTarget` | Memilih penghasil artefak untuk **Jana diagram** dan **Pratonton diagram** |
Tetapkan **Sasaran render yang diutamakan** kepada **Auto** untuk lalai perancang, atau pilih Mermaid, JSON Canvas, Vega-Lite, HTML, atau Editable HTML/SVG secara eksplisit. Penggantian ini hanya berkuat kuasa untuk arahan artefak dan pratonton. Arahan standard **Ringkaskan sebagai diagram Mermaid** kekal dipautkan pada output yang serasi dengan Mermaid supaya aliran kerja Markdown sedia ada tidak menukar format secara senyap.
Pemisahan ini penting kerana niat `flowchart` kini boleh direnderkan sebagai Mermaid untuk nota Markdown, HTML untuk pilihan lalai yang mantap, atau Editable HTML/SVG untuk penyuntingan seterusnya. Draw.io dan Drawnix kekal sebagai pengeksport artefak CLI dan bukannya sasaran render dalam plugin.
Aturkan **Sasaran render yang diutamakan** kepada **Auto** sebagai tetapan lalai bagi perancang, atau pilih secara eksplisit Mermaid, JSON Canvas, Vega-Lite, HTML, HTML/SVG yang boleh diedit, Draw.io, Drawnix, atau Circuitikz. Penggantian ini hanya berkuat kuasa untuk arahan artifak dan pratonton. Arahan standard **Ringkaskan sebagai diagram Mermaid** tetap ditetapkan kepada output yang serasi dengan Mermaid supaya aliran kerja Markdown sedia ada tidak menukar format secara senyap.
Pemisahan ini penting kerana niat `flowchart` kini boleh direnderkan sebagai Mermaid untuk nota Markdown, HTML sebagai penggantian yang mantap, HTML/SVG yang boleh diedit untuk penyuntingan seterusnya, atau artifak sumber Draw.io/Drawnix bersama fail semakan SVG. Niat `circuit` diarahkan ke Circuitikz dan memerlukan `CircuitSpec` yang telah disahkan; ia bukan permintaan untuk teks TikZ secara rawak.
## Penggunaan
### Jana Diagram
@ -101,16 +102,21 @@ Pemisahan ini penting kerana niat `flowchart` kini boleh direnderkan sebagai Mer
| Vega-Lite | `.json` | `{note}_diagram.json` |
| HTML | `.html` | `{note}_diagram.html` |
| Boleh Diubah HTML/SVG | `.html` | `{note}_diagram.html` |
| Draw.io | `.drawio` + `.drawio.svg` + `.drawio.md` | `{note}_diagram.drawio` bersama fail semakan yang berkaitan |
| Drawnix | `.drawnix` + `.drawnix.svg` + `.drawnix.md` | `{note}_diagram.drawnix` bersama fail semakan yang berkaitan |
| Circuitikz | `.tex` + `.tex.svg` + `.tex.md` | `{note}_diagram.tex` bersama fail semakan yang berkaitan |
### Tunjuk Pratonton Diagram
1. Jalankan **"Notemd: Tunjuk Pratonton Diagram"**
2. Tetingkap modal terbuka dengan diagram yang telah diproses
3. Eksport sebagai SVG atau PNG menggunakan butang pada toolbar
3. Eksport sebagai SVG, PNG, atau PDF menggunakan butang pada toolbar
**Buka pratonton secara automatik** tersedia dalam tetapan — selepas dihasilkan, tetingkap modal pratonton akan dibuka secara automatik.
Tetingkap modal pratonton juga mempunyai panel diagnosis artefak. Pemproses dan pemeriksa asap boleh lampirkan `RenderArtifact.diagnostics`; tetingkap tersebut menunjukkan ringkasan diagnosis dengan jumlah ralat/amaran/maklumat, diikuti tahap keparahan, jenis diagnosis, mesej, dan cadangan pembaikan di sebelah pratonton. Ringkasan yang sama dipaparkan dalam entri sejarah pratonton, jadi percubaan asap circuitikz yang berulang boleh dibandingkan tanpa perlu membuka setiap entri. Untuk artefak yang mempunyai kandungan sumber tetapi tidak dapat diproses secara dalam baris atau melalui laluan iframe HTML, tetingkap modal kini beralih kepada pratonton hanya sumber daripada menggunakan iframe kosong. Ini membolehkan pemeriksaan asap kompilasi/pemprosesan circuitikz, pemeriksaan token teks SVG, pemeriksaan skrin tangkapan PNG kosong, dan laporan pertindihan masa depan mempunyai paparan yang jelas UI tanpa menjadikan TikZJax atau LaTeX sebagai kebergantungan masa jalankan plugin yang wajib atau berpura-pura teks sumber ialah hasil visual yang telah disahkan.
Eksport pratonton dalam format PNG dan PDF menggunakan resolusi PPI yang telah dikonfigurasikan. Nilai lalainya ialah 300 PPI dan nilai melebihi 600 PPI akan dipotong kepada 600. SVG kekal berukuran vektor. Artifak sumber seperti `.drawio`, `.drawnix`, dan `.tex` boleh menyediakan fail `previewSvg` sebagai tambahan supaya Obsidian dapat memaparkan dan mengeksport imej yang boleh disemak tanpa perlu memasukkan diagram.net, Drawnix, LaTeX, atau TikZJax ke dalam masa jalanan plugin.
Tetingkap pratonton ini juga mempunyai panel diagnostik untuk artifak. Alat pemprosesan dan ujian asas boleh menambahkan data `RenderArtifact.diagnostics`; tetingkap tersebut akan memaparkan ringkasan diagnostik yang menunjukkan jumlah ralat/amaran/maklumat, diikuti dengan tahap keterukan, jenis diagnostik, mesej, dan cadangan pembaikan di sebelah pratonton. Ringkasan yang sama turut dipaparkan dalam entri sejarah yang menyokong fungsi diagnostik, jadi percubaan ujian asas circuitikz yang berulang boleh dibandingkan tanpa perlu membuka setiap entri secara berasingan. Bagi artifak yang mempunyai kandungan sumber tetapi tidak dapat dipaparkan secara dalam talian atau melalui laluan iframe HTML, tetingkap pratonton kini akan beralih kepada paparan pratonton yang hanya menunjukkan sumber sahaja, dan bukannya memaksa penggunaan iframe kosong. Cara ini membolehkan ujian kompilasi/pemprosesan circuitikz, pemeriksaan teks token SVG, pemeriksaan tangkapan skrin kosong PNG, laporan pertindihan glif yang hanya berdasarkan laluan, serta laporan pertindihan pada masa hadapan mempunyai antaramuka pengguna yang kelihatan, tanpa perlu menjadikan TikZJax atau LaTeX sebagai kebergantungan masa jalankan plugin yang wajib, atau berpura-pura bahawa teks sumber itu merupakan hasil paparan visual yang telah disahkan.
### Mod Mermaid Lama
@ -164,12 +170,12 @@ Sasaran ini sengaja bukan laluan perancang lalai buat masa ini. Ia tersedia seba
### Draw.io dan Drawnix Sempadan Eksport
Pelaksanaan semasa mengekalkan sokongan editor pihak ketiga pada sempadan artefak:
Pelaksanaan semasa mengekalkan sokongan editor pihak ketiga di sempadan artefak, sambil tetap menyediakan sasaran rendering yang jelas:
| Sasaran | Kontrak | Ketergantungan Masa Jalankan |
|--------|----------|--------------------|
| Draw.io | `mxfile` XML yang tidak dikompres dan ditentukan secara pasti daripada `SemanticFigureModel` | tiada dalam masa jalankan plugin atau CI |
| Drawnix | subset `.drawnix` JSON yang minimum menggunakan unsur `geometry` dan `arrow-line` | tiada dalam masa jalankan plugin atau CI |
| Draw.io | XML `mxfile` yang tidak dikompres dan bersifat deterministik daripada `SemanticFigureModel`, ditambah dengan fail rujukan SVG/PNG/PDF | Tiada komponen dalam masa jalanan plugin atau proses CI |
| Drawnix | Subset JSON `.drawnix` yang minimum yang menggunakan unsur `geometry` dan `arrow-line`, ditambah dengan fail rujukan SVG/PNG/PDF | Tiada komponen dalam masa jalanan plugin atau proses CI |
Kompromi ini adalah disengajakan: Notemd boleh sahkan label yang kelihatan, ID yang stabil, dan liputan primitif yang disokong tanpa memasukkan diagram.net Desktop, Drawnix, Plait, atau keadaan editor khusus pelayar ke dalam plugin.
@ -213,7 +219,11 @@ Notemd kini merangkumi prototaip repositori terhad pertama untuk arah ini. Ia se
npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-inverter.tex
```
Prototaip ini menambah sempadan `CircuitSpec` yang berasingan serta pengeksport yang ditentukan secara deterministik untuk enam keluarga rujukan emas:
Prototaip ini menambahkan sempadan `CircuitSpec` yang terhad serta alat eksport yang bersifat deterministik untuk enam keluarga rujukan utama:
Dalam saluran paip diagram eksperimen ini, ia kini juga boleh diakses melalui `intent: "circuit"` dan sasaran rendering `circuitikz`. Fail `DiagramSpec` yang dijana hanya boleh memasukkan elemen `circuitSpec` untuk niat yang berkaitan dengan litar sahaja. `CircuitikzRenderer` akan menulis sumber `.tex` yang tetap dan menambahkan fail pratonton SVG yang dihasilkan daripada topologi litar yang telah disahkan, sekaligus membolehkan pratonton dalam Obsidian serta pengeksportan dalam format SVG/PNG/PDF. Fail pratonton tersebut bukanlah hasil kompilasi LaTeX/TikZJax; bukti sebenar daripada proses rendering masih terdapat pada arahan khusus untuk ujian yang disenaraikan di bawah.
Bagi templat emas yang disokong, `layoutHints.inputSide` dan `layoutHints.outputSide` kekal sebagai kawalan yang hanya digunakan untuk tujuan paparan sahaja. Ia boleh mengalihkan kedudukan port input/output yang tetap, tetapi ia tidak mengubah tandatangan topologi atau membenarkan proses pembaikan untuk menyambung semula litar tersebut.
| Jenis litar | Rujukan emas | Jaminan arus |
|--------------|------------------|-------------------|
@ -224,7 +234,7 @@ Prototaip ini menambah sempadan `CircuitSpec` yang berasingan serta pengeksport
| `cmos-nand2` | `cmos-nand2-v1` | Memeriksa daya tarik ke atas PMOS selari, daya tarik ke bawah NMOS bersiri, input berganda `va` / `vb`, dan `vout` sebelum menulis LaTeX |
| `cmos-nor2` | `cmos-nor2-v1` | Memeriksa daya tarik ke atas PMOS bersiri, daya tarik ke bawah NMOS selari, input berganda `va` / `vb`, dan `vout` sebelum menulis LaTeX |
Ini bukan penjana TikZ umum lagi. Ia tidak mengkompilasi LaTeX, memanggil TikZJax, memeriksa tangkapan skrin, atau menjalankan pembaikan imej automatik. Fungsi tersebut masih menjadi langkah seterusnya.
Ini bukanlah penghasil TikZ umum. Ia tidak menerima kod TikZ secara rawak, tidak mengkompilasi LaTeX, tidak memanggil TikZJax, tidak memeriksa tangkapan skrin semasa masa jalanan plugin, dan juga tidak menjalankan proses pembaikan automatik berdasarkan maklum balas imej. Ciri-ciri tersebut masih merupakan langkah-langkah seterusnya yang perlu dilaksanakan.
Arahan Diagram Pratonton boleh membuka semula artifak sumber circuitikz yang disimpan secara langsung apabila lanjutan fail ialah `.tex` atau `.tikz` dan sumber mengandungi `\usepackage{circuitikz}` atau `\begin{circuitikz}`. Laluan ini ialah pratonton hanya sumber circuitikz: tetingkap modal menunjukkan sumber, diagnostik, kawalan salin/simpan, dan metadata sejarah, tetapi ia tidak mengkompilasi LaTeX atau memanggil TikZJax semasa masa jalanan plugin.
@ -350,8 +360,8 @@ Untuk inverter CMOS, promptn harus meminta topologi yang jelas serta kekangan su
|------|----------------|-----------|
| Diagram umum | Pipelajn berdasarkan spesifikasi telah dilaksanakan untuk Mermaid, JSON Canvas, Vega-Lite, HTML | Terus luaskan liputan pengesahan semantik |
| Rajah yang boleh diubah suai | Sempadan artifak `editable-html-svg`, Draw.io XML, dan Drawnix JSON telah dilaksanakan | Tambah primitif yang lebih kaya hanya selepas ujian membuktikan kebolehan pengubahsuaian |
| Sokongan CLI | `npm run diagram:export-artifact` mengeksport HTML/SVG, Draw.io, dan Drawnix yang boleh diubah suai daripada satu `DiagramSpec` | Tambah peranti asap khusus sasaran apabila sasaran baru dihantar |
| circuitikz | `CircuitSpec -> circuitikz` prototaip mengeksport sumber biasa, inverter CMOS, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1`, dan `cmos-nor2` / `cmos-nor2-v1` templat emas, projek `layoutHints.inputSide` dan `layoutHints.outputSide` ke penempatan port input/output yang pasti tanpa mengubah topologi, menolak perubahan topologi pembaikan melalui `--topology-reference`, mengeluarkan ringkasan pembaikan yang memelihara topologi melalui `--repair-brief-output` dan skema `notemd.circuitikz.repair-brief.v1`, termasuk kandungan penyerahan berstruktur `repairPrompt` dengan `diagnosticFocus`, `acceptanceCriteria`, dan peranan `topology-preserving-circuitikz-repair`, mengesahkan calon pembaikan melalui `--repair-brief`, mengembalikan bukti pintu `repairAcceptance` melalui skema `notemd.circuitikz.repair-acceptance.v1` dengan `readyForVisualAcceptance` dan `remainingChecks`, menyimpan bukti tersebut melalui `--repair-acceptance-output`, menganalisis log kompilasi, boleh menjalankan pemproses tempatan eksplisit serta `--expected-artifact`, SVG `--expected-svg-text`, pemeriksaan metadata kebolehaksesan melalui `aria-label`, `<title>`, dan `<desc>`, pengecualian elemen SVG tersembunyi/transparent, klasifikasi `render-svg-text-path-only` / `pathOnlyGlyphUseCount` untuk label hanya laluan, pemeriksaan penempatan glyph hanya laluan untuk `<use href="#...">`, diagnosis pertindihan glyph hanya laluan melalui `render-svg-path-glyph-overlap`, pengendalian titik arus laluan tertutup untuk `Z/z`, sempadan lengkung tepat untuk ekstrem A/a, sempadan lengkung Bezier tepat untuk ekstrem C/S/Q/T, pemeriksaan pertindihan label dengan sempadan yang mengambil kira ketebalan garisan SVG, pemeriksaan geometri lukisan `polyline` / `polygon`, geometri label yang diletakkan `tspan`, geometri teks yang diletakkan dengan mengambil kira `text-anchor`, geometri yang mengambil kira transformasi untuk SVG bounded-canvas/text-overlap dan label-vs-drawing asap melalui `render-svg-label-overlap`, serta pemeriksaan skrin tangkapan PNG bukan kosong / dipotong / latar tebal, termasuk palet warna berindeks dengan alpha, sampel transparan grayscale/RGB tRNS, dan panduan khusus format `render-png-unsupported` untuk PNG Adam7 interlaced dan kegagalan kedalaman bit berindeks, melalui `foregroundBounds`, `foregroundDensity`, `render-png-content-clipped`, dan `render-png-foreground-dense` tanpa analisis shell, termasuk peranti asap penyelenggaraan agregat melalui `npm run diagram:smoke-circuitikz`, merekod konfigurasi pemproses yang hilang melalui `rendererAvailability.status: "missing-configuration"` dan `compile-executable-invalid`, serta mempunyai diagnosis pratonton umum, kiraan ringkasan diagnosis, entri sejarah yang mengambil kira diagnosis, dan alternatif hanya sumber melalui `RenderArtifact.diagnostics` dan mod pratonton | Tambah pengenalan label pada tahap OCR untuk teks visual hanya laluan, pemeriksaan pertindihan pada tahap piksel yang tepat, liputan laluan SVG yang lebih luas apabila diperlukan, pemasangan/pengesanan pemproses secara automatik hanya jika ia boleh kekal sebagai pilihan, dan pelaksanaan pembaikan yang memelihara topologi secara automatik |
| Sokongan CLI | `npm run diagram:export-artifact` mengeksport bukti semakan HTML/SVG yang boleh diubah suai, Draw.io, Drawnix, Circuitikz, serta SVG/PNG/PDF daripada satu `DiagramSpec` yang telah disahkan | Tambahkan alat ujian khas untuk sasaran tertentu apabila sasaran baru dikeluarkan |
| circuitikz | `DiagramSpec(intent: "circuit", circuitSpec) -> CircuitikzRenderer -> circuitikz` mengeksport templat emas untuk common-source, CMOS inverter, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1`, dan `cmos-nor2` / `cmos-nor2-v1`, memaparkan pilihan niat UI/tujuan rendering, menulis fail TeX bersama-sama dengan fail pratonton SVG/PNG/PDF, menyahkan topologi sebelum menghasilkan output, menganalisis log kompilasi, boleh menjalankan renderer tempatan secara eksplisit bersama-sama dengan opsyen `--expected-artifact`, serta menyediakan pilihan sandaran yang hanya menggunakan sumber asal dan memaparkan diagnosis pratonton melalui `RenderArtifact.diagnostics` serta modul pratonton | Tambahkan pengenalan label pada tahap OCR untuk teks visual yang hanya terdiri daripada laluan, pemeriksaan pertindihan pada tahap piksel yang tepat, liputan laluan SVG yang lebih luas apabila diperlukan, pemasangan/penemuan renderer secara automatik hanya jika ia masih boleh dijadikan pilihan, serta pelaksanaan pembaikan automatik yang mengekalkan struktur topologi asal |
| Pengintegrasian TikZJax | Pemacu render calon untuk paparan sisi Obsidian | Biarkan ia sebagai pilihan; jangan jadikan TikZJax sebagai kebergantungan masa jalankan plugin yang wajib |
## Konfigurasi
@ -361,6 +371,7 @@ Untuk inverter CMOS, promptn harus meminta topologi yang jelas serta kekangan su
| `enableExperimentalDiagramPipeline` | `false` | Tukar antara pendekatan berdasarkan spesifikasi dan Mermaid lama |
| `experimentalDiagramCompatibilityMode` | `'legacy-mermaid'` | `'legacy-mermaid'` = Mermaid sahaja; `'best-fit'` = sasaran asli + alternatif |
| `preferredDiagramIntent` | `undefined` (auto) | Atur semula pengesanan niat automatik |
| `preferredDiagramRenderTarget` | `undefined` (auto) | Gantikan penghasil artefak, termasuk Draw.io, Drawnix, dan Circuitikz |
| `summarizeToMermaidLanguage` | `'en'` | Bahasa sasaran untuk label diagram |
| `summarizeToMermaidProvider` / `Model` | DeepSeek | LLM setiap tugas untuk penjanaan diagram |
| `autoMermaidFixAfterGenerate` | (daripada pemalar) | Jalankan pembaiki lama secara automatik pada output Mermaid |
@ -380,10 +391,11 @@ Apabila diaktifkan, Notemd akan mendapatkan petikan konteks yang relevan daripad
| Tindakan | Kaedah |
|--------|--------|
| Eksport SVG | Pembina `mermaid.render()` / `vega.View.toSVG()` / SVG untuk Canvas |
| Eksport PNG | SVG → Imej → Canvas (nisbah piksel peranti 1x-3x) → ArrayBuffer PNG |
| Eksport ke PNG | SVG → Imej → Canvas / alat rasterisasi pratonton pada PPI yang ditetapkan → ArrayBuffer PNG |
| Eksport ke PDF | SVG → imej raster pada PPI yang ditetapkan → PDF satu halaman |
| Simpan Sumber | Kandungan artifak mentah disimpan dengan lanjutan khusus sasaran |
| Pratonton Hanya Sumber | Artifak bukan inline dengan kandungan sumber dipaparkan sebagai kod bersama diagnosis, tanpa rendering iframe |
| Pemeriksaan Semantik | Mermaid, JSON Canvas, Vega-Lite, dan HTML/SVG yang boleh diubah suai telah diperiksa oleh `scripts/diagram-semantic-verification.js` |
| Audit semantik | Mermaid, JSON Canvas, Vega-Lite, HTML/SVG yang boleh diubah suai, Draw.io, Drawnix, dan circuitikz yang terhad diperiksa oleh `scripts/diagram-semantic-verification.js` bersama-sama dengan ujian penghasil dan CLI |
**Caching**: RenderCache menggunakan kunci JSON yang tetap daripada `{spec, target, theme}`. Penghapusan duplikasi semasa proses mengelakkan paparan berulang.

View file

@ -1,7 +1,7 @@
---
id: diagrams
title: "Diagrammen"
description: "Genereer Mermaid, JSON Canvas, Vega-Lite, HTML, bewerkbare afbeeldingen en toekomstige beperkte circuitikz diagrammen uit je notities met een spec-first architectuur"
description: "Genereer Mermaid-, JSON Canvas-, Vega-Lite-, HTML-, bewerkbare afbeeldingsbestanden, Draw.io-, Drawnix- en beperkte circuitikz-diagrammen uit je notities met behulp van een architectuur die eerst de specificaties gebruikt"
author:
'@id': 'https://jacobinwwey.github.io/obsidian-NotEMD/#person-jacobinwwey'
keywords: [diagrams, mermaid, vega-lite, canvas, visualization, spec-first, drawio, drawnix, editable svg, circuitikz, TikZJax]
@ -18,7 +18,7 @@ import TLDR from '@site/src/components/TLDR';
# Diagrammen
<TLDR>
**Notemd genereert diagrammen uit je notities via een spec-first pipeline.** De LLM levert een renderer-agnostisch `DiagramSpec` JSON op, waarna gespecialiseerde adapters dit omzetten in Mermaid, JSON Canvas, Vega-Lite, HTML of bewerkbare HTML/SVG uitvoer. Er wordt ondersteuning geboden voor 8 intentietypen, automatische fallbackketens, live preview met SVG/PNG export, semantische verificatie en generatie aangevuld met lokale kennis.
**Notemd genereert diagrammen uit je notities via een pipeline die eerst de specificaties verwerkt.** De LLM genereert een renderer-onafhankelijk `DiagramSpec`-JSON-bestand, waarna gespecialiseerde adapters dit omzetten in Mermaid-, JSON Canvas-, Vega-Lite-, HTML-, bewerkbare HTML/SVG-, Draw.io-, Drawnix- of beperkte circuitikz-output. Er wordt ondersteuning geboden voor 9 intentietypen, automatische fallbackketens, een live preview met mogelijkheid om bestanden als SVG/PNG/PDF te exporteren, semantische verificatie en generatie aangevuld met lokale kennis.
</TLDR>
Dit maakt deel uit van de [Obsidian AI Knowledge Management Guide](/docs/pillar-ai-knowledge).
@ -54,6 +54,7 @@ graph LR
| `stateDiagram` | Mermaid | HTML | Toestandsmachines, levenscyclusmodellen |
| `canvasMap` | JSON Canvas | Mermaid → HTML | Conceptkaarten, kennisgraphen |
| `dataChart` | Vega-Lite | Mermaid → HTML | Staven, lijnen, gebieden, verspreide punten, piecharts, tabellen |
| `circuit` | circuitikz | geen | Beperkte circuitdiagrammen op basis van geverifieerde `CircuitSpec`-bestanden |
## Intent Detectie
@ -67,6 +68,7 @@ Notemd bepaalt op basis van woordscoren de beste diagramtype uit de inhoud van j
| `stateDiagram` | Toestand, overgang, in afwachting, actief, mislukt (3+ overeenkomsten) | 0.76 |
| `flowchart` | Genummerde stappen (2+) of if/then/else/workflow vocabulaire | 0.74 |
| `canvasMap` | Conceptkaart, kennisgraaf, ruimtelijk, cluster | 0.72 |
| `circuit` | circuitikz, TikZJax, circuit, schematic, CMOS, NMOS, PMOS, MOSFET, VDD/GND, `vin`/`vout` | 0.78 |
| `mindmap` | Default fallback | 0.55 |
Overtuig met de **Preferred diagram type**-instelling, de selector in de zijbalk of een expliciete optie in het commandopalette.
@ -75,15 +77,9 @@ Overtuig met de **Preferred diagram type**-instelling, de selector in de zijbalk
De experimentele spec-first pipeline heeft nu twee onafhankelijke controles:
| Control | Instelling | Effect |
|---------|---------|--------|
| Preferred diagram type | `preferredDiagramIntent` | Stuurt de semantische vorm van de gegenereerde `DiagramSpec` aan |
| Preferred render target | `preferredDiagramRenderTarget` | Kiest de renderer voor **Generate diagram** en **Preview diagram** |
Stel **Preferred render target** in op **Auto** voor de standaard planner, of kies expliciet Mermaid, JSON Canvas, Vega-Lite, HTML of Editable HTML/SVG. De override is alleen van toepassing op artifact- en preview-commando's. Het standaardcommando **Summarise as Mermaid diagram** blijft gekoppeld aan Mermaid-compatibele uitvoer zodat bestaande Markdown-workflows niet stilletjes van formaat wisselen.
Deze scheiding is belangrijk omdat een `flowchart`-intent nu kan worden weergegeven als Mermaid voor Markdown-notities, HTML voor een betrouwbare fallback, of Editable HTML/SVG voor verdere bewerking. Draw.io en Drawnix blijven CLI-artikelformaatexporteurs in plaats van renderdoelstellingen binnen de plugin.
Stel **Preferred render target** in op **Auto** voor de standaardinstelling van de planner, of kies expliciet voor Mermaid, JSON Canvas, Vega-Lite, HTML, Editable HTML/SVG, Draw.io, Drawnix of Circuitikz. Deze override heeft alleen invloed op de commands voor het genereren van artefacten en het bekijken ervan. De standaardcommando **Summarise as Mermaid diagram** blijft gericht op Mermaid-compatibele output zodat bestaande Markdown-workflows niet stilletjes van formaat wisselen.
Deze scheiding is belangrijk omdat een `flowchart`-intent nu kan worden weergegeven als Mermaid voor Markdown-notities, als HTML voor een betrouwbare fallback, als Editable HTML/SVG voor verdere bewerking, of als Draw.io/Drawnix-bronbestanden vergezeld van SVG-bestanden ter beoordeling. Een `circuit`-intent leidt naar Circuitikz en vereist een geverifieerd `CircuitSpec`; het is geen verzoek om willekeurige TikZ-tekst.
## Gebruik
### Een diagram genereren
@ -101,16 +97,21 @@ Deze scheiding is belangrijk omdat een `flowchart`-intent nu kan worden weergege
| Vega-Lite | `.json` | `{note}_diagram.json` |
| HTML | `.html` | `{note}_diagram.html` |
| Editabel HTML/SVG | `.html` | `{note}_diagram.html` |
| Draw.io | `.drawio` + `.drawio.svg` + `.drawio.md` | `{note}_diagram.drawio` samen met bijbehorende bestanden voor beoordeling |
| Drawnix | `.drawnix` + `.drawnix.svg` + `.drawnix.md` | `{note}_diagram.drawnix` samen met bijbehorende bestanden voor beoordeling |
| Circuitikz | `.tex` + `.tex.svg` + `.tex.md` | `{note}_diagram.tex` samen met bijbehorende bestanden voor beoordeling |
### Voorbeeld van een diagram bekijken
1. Uitvoeren **"Notemd: Voorbeeld diagram bekijken"**
2. Een modaal venster wordt geopend met het weergegeven diagram
3. Exporteer als SVG of PNG met behulp van de knoppen op het werkbalk
3. Exporteer als SVG, PNG of PDF met behulp van de knoppen op het werkbalk
**Automatisch voorbeeld openen** is beschikbaar in de instellingen — na generatie wordt het voorbeeldmodaal venster automatisch geopend.
Het voorbeeldmodaal venster heeft ook een paneel voor diagnostiek van artefacten. Renderers en smoke checks kunnen `RenderArtifact.diagnostics` toevoegen; het venster toont een samenvatting van de diagnostiek met tellers voor fouten/waarschuwingen/informatie, gevolgd door ernst, type diagnostiek, bericht en reparatieadvies naast het voorbeeld. Dezelfde samenvatting wordt weergegeven in de historische voorbeeldingen, zodat herhaalde circuitikz smoke-pogingen vergeleken kunnen worden zonder elke ingang te openen. Voor artefacten die broninhoud hebben maar niet inline of via de HTML iframe-path kunnen worden gerenderd, valt het venster nu terug op een voorbeeld alleen van de bron in plaats van een lege iframe af te dwingen. Dit biedt circuitikz compile/render smoke, SVG tekst-token checks, PNG-blank-schermopnames checks en toekomstige overlaprapporten een zichtbare UI oppervlakte zonder TikZJax of LaTeX als harde plugin-runtimeafhankelijkheid te maken of te doen alsof brontekst een geverifieerde visuele weergave is.
Bij het exporteren van previews in PNG en PDF wordt de opgegeven preview PPI gebruikt. De standaardwaarde is 300 PPI en waarden hoger dan 600 PPI worden beperkt tot 600. SVG blijft vectorgrootte hebben. Bronbestanden zoals `.drawio`, `.drawnix` en `.tex` kunnen een `previewSvg`-bestand leveren zodat Obsidian beeldbestanden kan weergeven en exporteren die kunnen worden bekeken, zonder dat diagram.net, Drawnix, LaTeX of TikZJax in de plugin-runtime worden opgenomen.
Het voorbeeldvenster bevat ook een paneel met diagnoses van artefacten. Renderers en smoke checks kunnen `RenderArtifact.diagnostics` toevoegen; het venster toont een samenvatting van de diagnoses met tellingen van fouten/waarschuwingen/informatie, gevolgd door de ernst, het type diagnose, de boodschap en advies voor reparatie naast het voorbeeld. Hetzelfde samenvatting wordt weergegeven in historische entrys die diagnoses ondersteunen, zodat herhaalde circuitikz smoke-tests vergeleken kunnen worden zonder elke entry afzonderlijk te openen. Voor artefacten die broninhoud hebben maar niet inline of via de HTML iframe-pfad kunnen worden weergegeven, gebruikt het venster nu in plaats van een lege iframe een voorbeeld dat uitsluitend uit de bron bestaat. Hierdoor krijgen circuitikz compile/render smoke-tests, SVG-text-tokencontroles, PNG-blank-screencastcontroles, rapporten over overlap van glyphs die alleen op paden zijn gebaseerd, en toekomstige overlaprapporten een zichtbare gebruikersinterface, zonder dat TikZJax of LaTeX als strikte runtime-dependentie voor plugins moeten dienen of alsof de brontekst al als gevalideerde visuele weergave wordt beschouwd.
### Legendarische Mermaid Modus
@ -164,12 +165,12 @@ Deze doelwaarde is nog niet opzettelijk de standaardplannerroute. Het is beschik
### Draw.io en Drawnix Exportgrenzen
De huidige implementatie houdt de ondersteuning van derdeneditoren bij de artifactgrens:
De huidige implementatie houdt de ondersteuning voor derdepartijeditoren binnen de grenzen van het artefact, terwijl er toch expliciete weergave-doelwitten worden geexposeerd:
| Doelwit | Contract | Runtijdafhankelijkheid |
|--------|----------|--------------------|
| Draw.io | deterministisch ongecomprimeerd `mxfile` XML afkomstig van `SemanticFigureModel` | niets in de plugin-runtijd of CI |
| Drawnix | minimalistisch `.drawnix` JSON subset met `geometry` en `arrow-line` elementen | niets in de plugin-runtijd of CI |
| Draw.io | deterministische, ongecomprimeerde `mxfile`-XML uit `SemanticFigureModel`, plus SVG/PNG/PDF-bestanden voor review | niets in de plugin-runtime of CI |
| Drawnix | een minimale subset van JSON in `.drawnix` die `geometry` en `arrow-line`-elementen gebruikt, plus SVG/PNG/PDF-bestanden voor review | niets in de plugin-runtime of CI |
De afweging is bewust: Notemd kan zichtbare labels, stabiele IDs en ondersteunde primitieve dekking controleren zonder diagram.net Desktop, Drawnix, Plait of alleen-browser editorstatus in de plugin op te nemen.
@ -213,7 +214,11 @@ Notemd bevat nu het eerste beperkte repository-prototype voor deze richting. Het
npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-inverter.tex
```
Het prototype voegt een apart `CircuitSpec`-grensgebied en een deterministische exporter toe voor zes gouden referentiefamilies:
Het prototype voegt een beperkte `CircuitSpec`-grens toe en een deterministische exporter voor zes gouden referentiefamilies:
In het experimentele diagrampijpleid kan dit nu ook worden bereikt via `intent: "circuit"` en het weergave-doelwit `circuitikz`. Het gegenereerde `DiagramSpec` mag alleen `circuitSpec` bevatten voor een circuit-intent. `CircuitikzRenderer` genereert dezelfde deterministische `.tex`-bron en voegt een SVG-preview toe die is afgeleid van die geverifieerde circuittopologie, waardoor er een preview in Obsidian mogelijk is plus export naar SVG/PNG/PDF. De preview is geen resultaat van een LaTeX/TikZJax-compilatie; het echte renderresultaat blijft behouden in de expliciete smoke-commandos hieronder.
Voor ondersteunde gouden templates blijven `layoutHints.inputSide` en `layoutHints.outputSide` enkel controle-elementen voor presentatie. Ze kunnen de plaatsing van de deterministische invoer-/uitvoerpoorten verplaatsen, maar ze veranderen de topologische specificaties niet en maken het niet mogelijk om via een reparatieprocedure de circuittopologie opnieuw te configureren.
| Circuittype | Gouden referentie | Stroomgarantie |
|--------------|------------------|-------------------|
@ -224,7 +229,7 @@ Het prototype voegt een apart `CircuitSpec`-grensgebied en een deterministische
| `cmos-nand2` | `cmos-nand2-v1` | Controleert de parallelle PMOS pull-up, seriële NMOS pull-down, dubbele invoeren `va` / `vb` en `vout` voordat LaTeX wordt geschreven |
| `cmos-nor2` | `cmos-nor2-v1` | Controleert de seriële PMOS pull-up, parallele NMOS pull-down, dubbele invoeren `va` / `vb` en `vout` voordat LaTeX wordt geschreven |
Dit is nog geen algemene TikZ generator. Het compileert geen LaTeX, roept TikZJax niet op, inspecteert geen screenshots of voert geen geautomatiseerde afbeeldingsherstelacties uit. Die functies komen later.
Dit is geen algemene TikZ-generator. Het accepteert geen willekeurige TikZ-code, compileert geen LaTeX, roept geen TikZJax aan, inspecteert geen screenshots in de plugin-runtime en voert geen geautomatiseerde reparatie van afbeeldingen uit. Die functies maken nog deel uit van latere stappen.
De Preview diagram commando kan direct opgeslagen circuitikz bronbestanden openen wanneer de bestandsextensie `.tex` of `.tikz` is en de bron `\usepackage{circuitikz}` of `\begin{circuitikz}` bevat. Die route is een circuitikz bron-gebaseerde preview: het venster toont de bron, diagnostiek, kopieer/sla op controls en historische metadata, maar compileert geen LaTeX of roept TikZJax niet op tijdens de pluginuitvoering.
@ -350,8 +355,8 @@ Voor een CMOS-inverter moet de prompt expliciete topologie plus layoutbeperkinge
|------|----------------|-----------|
| Algemene diagrammen | Spec-first pipeline geïmplementeerd voor Mermaid, JSON Canvas, Vega-Lite, HTML | Bouw de semantische verificatieverwerking verder uit |
| Editabele figuren | `editable-html-svg`, Draw.io XML en Drawnix JSON artefactgrenzen geïmplementeerd | Voeg rijkere primitieven alleen toe nadat tests de editabiliteit hebben bewezen |
| CLI ondersteuning | `npm run diagram:export-artifact` exporteert editabele HTML/SVG, Draw.io en Drawnix vanuit één `DiagramSpec` | Voeg rookinstallaties toe die specifiek zijn voor een doel wanneer nieuwe doelen worden geleverd |
| circuitikz | `CircuitSpec -> circuitikz` prototype exporteert gemeenschappelijke bronnen, CMOS omvormer, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1`, en `cmos-nor2` / `cmos-nor2-v1` gouden templates, projecten `layoutHints.inputSide` en `layoutHints.outputSide` naar een deterministische invoer/uitvoerpoortindeling zonder de topologie te veranderen, wijst topologische afwijkingen af via `--topology-reference`, genereert topologiebehoudende reparatieverslagen via `--repair-brief-output` en schema `notemd.circuitikz.repair-brief.v1`, bevat gestructureerd `repairPrompt` overdrachtsinhoud met `diagnosticFocus`, `acceptanceCriteria`, en rol `topology-preserving-circuitikz-repair`, valideert reparatiekandidaten via `--repair-brief`, geeft `repairAcceptance` poortbewijs terug via schema `notemd.circuitikz.repair-acceptance.v1` met `readyForVisualAcceptance` en `remainingChecks`, bewaart dat bewijs via `--repair-acceptance-output`, parseert compilatielogs, kan expliciete lokale renderers uitvoeren plus `--expected-artifact`, SVG `--expected-svg-text`, controle van toegankelijkheidsmetadata via `aria-label`, `<title>`, en `<desc>`, uitsluiting van verborgen/transparante SVG elementen, `render-svg-text-path-only` / `pathOnlyGlyphUseCount` classificatie voor alleen-padlabels, controle van plaatsing van alleen-padglyphs voor `<use href="#...">`, diagnose van overlap van alleen-padglyphs via `render-svg-path-glyph-overlap`, afhandeling van huidig punt bij gesloten paden voor `Z/z`, exacte randen voor A/a boogextrema, exacte randen voor Bezier-krommeextrema voor C/S/Q/T, SVG grenzen rekening houdend met stiftbreedte en controle op labeloverlap, `polyline` / `polygon` controle van tekeningen geometrie, gepositioneerde `tspan` labelgeometrie, tekstgeometrie die `text-anchor` rekening houdt, geometrie die SVG rekening houdt met beperkte canvas/textoverlap en label versus tekening rooktests, inclusief PNG niet-leeg / afgesneden / dichte voorgrond screenshot rooktests, inclusief indexcolormap alpha, grijs/wit/RGB tRNS transparante monsters, en format-specifieke `render-png-unsupported` richtlijnen voor Adam7 gestapelde PNGs en fouten bij gecodeerde bitdiepte, via `foregroundBounds`, `foregroundDensity`, `render-png-content-clipped`, en `render-png-foreground-dense` zonder shell parsing, bevat samengestelde onderhoudsrookinstallaties via `npm run diagram:smoke-circuitikz`, registreert ontbrekende rendererconfiguratie via `rendererAvailability.status: "missing-configuration"` en `compile-executable-invalid`, en heeft algemene voorbeelddiagnosen, tellingen van diagnostische samenvattingen, historieën die rekening houden met diagnoses, en fallback alleen op bronmateriaal via `RenderArtifact.diagnostics` en het voorbeeldvenster | Voeg OCR-niveau labelherkenning toe voor alleen-pad visuele tekst, nauwkeurige pixelniveau overlapcontroles, bredere SVG paddekking waar nodig, automatische installeren/ontdekken van renderer alleen als dit optioneel kan blijven, en geautomatiseerde topologiebehoudende reparatieuitvoering |
| CLI-ondersteuning | `npm run diagram:export-artifact` exporteert bewerkbare HTML/SVG-, Draw.io-, Drawnix-, Circuitikz- en SVG/PNG/PDF-bestanden als bewijsmateriaal, afkomstig van één geverifieerde `DiagramSpec` | Voeg doelspecifieke smoke fixtures toe wanneer nieuwe doelen worden uitgebracht |
| circuitikz | `DiagramSpec(intent: "circuit", circuitSpec) -> CircuitikzRenderer -> circuitikz` exporteert gouden templates voor common-source, CMOS inverter, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1` en `cmos-nor2` / `cmos-nor2-v1`, geeft UI-intentie-/renderdoelopties weer, genereert TeX-bestanden samen met SVG/PNG/PDF-previewbestanden, valideert de topologie vóór export, analyseert compilatieloggen, kan expliciete lokale renderers gebruiken samen met `--expected-artifact`, en biedt een fallback op alleen broncode naast previewdiagnoses die zichtbaar zijn via `RenderArtifact.diagnostics` en het preview-modal | Voeg OCR-niveau labelherkenning toe voor visueel tekst dat alleen uit paden bestaat, nauwkeurige overlapcontroles op pixelniveau, een bredere dekking van SVG-paden waar nodig, automatische installatie/ontdekking van renderers alleen als deze optioneel kunnen blijven, en geautomatiseerde reparatieprocessen die de topologie behouden |
| TikZJax integratie | Kandidaat renderhost voor Obsidian-kant weergave | Houd het optioneel; maak TikZJax geen harde plugin-runtimeafhankelijkheid |
## Configuratie
@ -361,6 +366,7 @@ Voor een CMOS-inverter moet de prompt expliciete topologie plus layoutbeperkinge
| `enableExperimentalDiagramPipeline` | `false` | Schakel tussen spec-first en legacy Mermaid over |
| `experimentalDiagramCompatibilityMode` | `'legacy-mermaid'` | `'legacy-mermaid'` = Mermaid alleen; `'best-fit'` = native doelen + fallbacks |
| `preferredDiagramIntent` | `undefined` (auto) | Overtikkel automatische intentiedetectie |
| `preferredDiagramRenderTarget` | `undefined` (auto) | Renderer van het artefact overschrijven, inclusief Draw.io, Drawnix en Circuitikz |
| `summarizeToMermaidLanguage` | `'en'` | Doeltaal voor diagramlabels |
| `summarizeToMermaidProvider` / `Model` | DeepSeek | Per taak LLM voor diagramgeneratie |
| `autoMermaidFixAfterGenerate` | (uit constanten) | Auto uitvoeren van legacy fixer op Mermaid output |
@ -380,10 +386,11 @@ Wanneer geactiveerd haalt Notemd relevante contextfragmenten op uit de lokale ke
| Actie | Methode |
|--------|--------|
| SVG export | `mermaid.render()` / `vega.View.toSVG()` / SVG builder voor Canvas |
| PNG export | SVG → Afbeelding → Canvas (device pixel ratio 1x-3x) → PNG ArrayBuffer |
| Export naar PNG | SVG → Afbeelding → Canvas / rasterizer voor voorvertoning bij de ingestelde PPI → PNG ArrayBuffer |
| Export naar PDF | SVG → rasterafbeelding bij de ingestelde PPI → eendaags PDF |
| Opslaan van bron | De ruwe artefactinhoud wordt opgeslagen met een extensie die specifiek is voor het doel. |
| Alleen voorbeeldweergave van de bron | Niet-inline artefacten met broninhoud worden weergegeven als code samen met diagnostische informatie, zonder iframe-rendering. |
| Semantische audit | Mermaid, JSON Canvas, Vega-Lite en bewerkbare HTML/SVG gecontroleerd door `scripts/diagram-semantic-verification.js` |
| Semantische audit | Mermaid, JSON Canvas, Vega-Lite, bewerkbare HTML/SVG, Draw.io, Drawnix en beperkte Circuitikz worden gecontroleerd door `scripts/diagram-semantic-verification.js` samen met tests voor de renderer en CLI |
**Caching**: RenderCache gebruikt een deterministische JSON sleutel van `{spec, target, theme}`. In-flight deduplicatie voorkomt dubbele renders.

View file

@ -1,7 +1,7 @@
---
id: diagrams
title: "Diagrammer"
description: "Generer Mermaid, JSON Canvas, Vega-Lite, HTML, redigerbare figurartefakter, samt fremtidige begrænsete circuitikz-diagrammer fra dine notater med hjælp af en specifikasjonsførst architecture"
description: "Generer Mermaid, JSON Canvas, Vega-Lite, HTML, redigerbare figurartefakter, Draw.io, Drawnix og begrænsete circuitikz-diagrammer fra dine notater med en arkitektur baseret på specifikasjoner først"
author:
'@id': 'https://jacobinwwey.github.io/obsidian-NotEMD/#person-jacobinwwey'
keywords: [diagrams, mermaid, vega-lite, canvas, visualization, spec-first, drawio, drawnix, editable svg, circuitikz, TikZJax]
@ -18,7 +18,7 @@ import TLDR from '@site/src/components/TLDR';
# Diagrammer
<TLDR>
**Notemd genererer diagrammer fra dine notater gjennom en pipeline som starter med specifikasjoner.** LLM skaper en `DiagramSpec` JSON som er uavhengig av renderingsverktøy, og spesialiserte adapterer oversetter den til Mermaid, JSON Canvas, Vega-Lite, HTML, eller editerbare HTML/SVG-utdata. Støtter 8 typers intenter, automatiske fallback-kedjer, live-forhandsvisning med eksport til SVG/PNG, semantisk verifisering, og generering forstärkt med lokal kunnskap.
**Notemd genererer diagrammer fra dine notater gjennom en pipeline som prioriterer specifikasjoner først.** LLM-en producerer en renderer-uforskjellig `DiagramSpec`-JSON, og derefter oversettere spesialiserte adapter dette til Mermaid, JSON Canvas, Vega-Lite, HTML, redigerbar HTML/SVG, Draw.io, Drawnix eller begrænsete circuitikz-output. Støttes 9 type av intenter, automatiske fallback-kedjer, live-forhåndsvisning med eksport til SVG/PNG/PDF, semantisk verifisering og generering forstærkt med lokal kunnskap.
</TLDR>
Dette er en del av [Obsidian AI Knowledge Management Guide](/docs/pillar-ai-knowledge).
@ -54,6 +54,7 @@ graph LR
| `stateDiagram` | Mermaid | HTML | Stasemaskiner, livscyklemodeller |
| `canvasMap` | JSON Canvas | Mermaid → HTML | Konseptkarteler, kunnskapsgrapher |
| `dataChart` | Vega-Lite | Mermaid → HTML | Stavar, linjer, arealer, sprøkeligninger, pie-diagrammer, tabeller |
| `circuit` | circuitikz | ingen | Begrænsete circuit-diagrammer fra validerede `CircuitSpec`-data |
## Intent Detection
@ -67,6 +68,7 @@ Notemd inferer den beste diagramtypen fra innholdet i din notat ved bruk av nøk
| `stateDiagram` | Stasjon, overgang, i venting, i gang, feil (3+ matcher) | 0.76 |
| `flowchart` | Nummererte trinn (2+) eller if/then/else/workflow-ordlista | 0.74 |
| `canvasMap` | Konseptkarte, kunnskapsgraf, romlig, kluster | 0.72 |
| `circuit` | circuitikz, TikZJax, circuit, schematic, CMOS, NMOS, PMOS, MOSFET, VDD/GND, `vin`/`vout` | 0.78 |
| `mindmap` | Standardfall | 0.55 |
Øverstille med **Favoritt diagramtyp**-innstillingen, sidebarkvalgern eller en eksplisit kommandovalgmulighet.
@ -80,10 +82,9 @@ Den eksperimentelle spec-first-pipeline-en har nå to uavhengige kontroller:
| Favoritt diagramtyp | `preferredDiagramIntent` | Styrer den semantiske formen for den genererte `DiagramSpec` |
| Favoritt renderingsmål | `preferredDiagramRenderTarget` | Velger artikkelrendereren for **Generer diagram** og **Vis forhandsvisning av diagram** |
Sett **Favoritt renderingsmål** til **Auto** som standard for planeringsprogrammet, eller velg eksplisitt Mermaid, JSON Canvas, Vega-Lite, HTML eller Editable HTML/SVG. Øverstillingen gjelder kun for artikkel- og forhandsvisningskommandoen. Standardkommandot **Sammanfatt som Mermaid diagram** forblir bundet til Mermaid-kompatible utdata så at eksisterende Markdown-arbeidsfluer ikke stillehet endrer format.
Dette skilnaden er viktig fordi en `flowchart`-intensjon nå kan renderes som Mermaid for Markdown-notater, HTML som robust fallback, eller Editable HTML/SVG for videre redigering. Draw.io og Drawnix forblir CLI-artikkelexportere fremfor innbudsrenderingsmål.
Still **Preferred render target** på **Auto** for planleggers standardvalg, eller velg eksplisitt Mermaid, JSON Canvas, Vega-Lite, HTML, Editable HTML/SVG, Draw.io, Drawnix eller Circuitikz. Denne endringen gjelder kun kommandoer for artifakter og forhåndsvisning. Standardkommandot **Summarise as Mermaid diagram** forblir koblet til Mermaid-sykker output slik at eksisterende Markdown-arbeidsfluer ikke stiller formatet i bakgrunnen.
Dette skillelser er viktig fordi en `flowchart`-intent nå kan genereres som Mermaid for Markdown-notater, HTML som robust fallback, Editable HTML/SVG for videre redigering, eller Draw.io/Drawnix-kildeartefakter med SVG-forretningskomplementer. En `circuit`-intent dirigeres til Circuitikz og krever en valideret `CircuitSpec`; det er ikke en forespørsel om vilkårlig TikZ-text.
## Bruk
### Generer et diagram
@ -101,16 +102,21 @@ Dette skilnaden er viktig fordi en `flowchart`-intensjon nå kan renderes som Me
| Vega-Lite | `.json` | `{note}_diagram.json` |
| HTML | `.html` | `{note}_diagram.html` |
| Editabel HTML/SVG | `.html` | `{note}_diagram.html` |
| Draw.io | `.drawio` + `.drawio.svg` + `.drawio.md` | `{note}_diagram.drawio` sammen med forretningskomplementer |
| Drawnix | `.drawnix` + `.drawnix.svg` + `.drawnix.md` | `{note}_diagram.drawnix` sammen med forretningskomplementer |
| Circuitikz | `.tex` + `.tex.svg` + `.tex.md` | `{note}_diagram.tex` sammen med forretningskomplementer |
### Vis forhåndsvisning av diagram
1. Kør **"Notemd: Vis forhåndsvising av diagram"**
2. En modal vises med det renderede diagrammet
3. Ekspor til SVG eller PNG med hjelp av knappene på verktøylinjen
3. Eksportere som SVG, PNG eller PDF med hjelp av knappene på verktøylinjen
**Automatisk åpne forhåndsvising** er tilgjengelig i innstillingene — etter generering starter forhåndsvisingsmodalen automatisk.
Forhåndsvisingsmodalen har også en panel for diagnostikk av artefakter. Renderere og smoke-checker kan legge til `RenderArtifact.diagnostics`; modalen viser en sammanfattelse med antall feil/varninger/informeringer, deretter alvorlighetsgrad, diagnostikktype, melding og reparasjonsråd ved siden av forhåndsvisningen. Samme sammanfattelse vises i historikke for forhåndsvisninger, så man kan sammenligne gjentatte circuitikz smoke-prøver uten å åpne hver enkelt post. For artefakter som har kildetekst men ikke kan renderes inline eller gjennom HTML iframe-paden, faller modalen nå tilbake til en forhåndsvising bare med kildetekst istedet for å kreve en tom iframe. Dette gir circuitikz kompile/render smoke, SVG tekst-token-kontroller, PNG-blank-skjermutsnittskontroller og fremtidige overlappsrapporter en synlig UI ytre form uten å gjøre TikZJax eller LaTeX til en hardt plugin-runtimeavhengighet eller å simulere at kildeteksten er en verifisert visuell rendering.
Eksportering av forhåndsvisninger i PNG og PDF bruker den konfigurerte PPI-verdien for forhåndsvisning. Standardverdien er 300 PPI, og verdier over 600 PPI begrenses til 600. SVG-forblir vektorbasert. Kildeartefakter som `.drawio`, `.drawnix` og `.tex` kan leverere en `previewSvg`-komplement for at Obsidian kan vise og eksportere bilder som kan granskes, uten å embedde diagram.net, Drawnix, LaTeX eller TikZJax i pluginets kjøring.
Vurderingsmodalen har også en panel for diagnosticer av artefakter. Renderere og smoke-tests kan legge til `RenderArtifact.diagnostics`; modalen viser en sammanfattelse av diagnosticene med antall feil/varninger/informationer, samt sværenivå, typen av diagnostic, meldingen og reparasjonsråd ved siden av vurderingen. Den samme sammanfattelsen vises i historieposter som støtter diagnosticer, så man kan sammenligne gjentatte circuitikz-smoke-prøver uten å åpne hver enkelt post. For artefakter som har kildetekst men ikke kan renderes inline eller gjennom HTML-iframe-paden, faller modalen nå tilbake til en vurdering basert kun på kilden istedenfor å kreve en tom iframe. Dette gir circuitikz-compilering-/rendering-smoke-prøver, SVG-text-token-kontroller, PNG-blank-skjermutsnittskontroller, rapporter om overlapp mellom glyfer basert kun på path, og fremtidige overlappsrapporter en synlig grafisk overflate, uten å gjøre TikZJax eller LaTeX til en hardt krav på plugin-runtime eller å simulere at kildeteksten er en verifisert visuell rendering.
### Legasjons Mermaid-modus
@ -164,12 +170,12 @@ Dette målet er avsiktlig ikke den standardmessige planeringsveien ennå. Det er
### Draw.io og Drawnix Exportgränser
Den nuværende implementasjonen holder støtte for tredjepartsredaktorer ved artefaktgränsen:
Den nuværende implementeringen holder støttet for tredjeparts-redigeringsverktyg ved grænsen til artefaktet, mens den likevel exponerer eksplisite renderingsmål:
| Mål | Kontrakt | Körningsskrav |
|--------|----------|--------------------|
| Draw.io | deterministisk, ukomprimeret `mxfile` XML fra `SemanticFigureModel` | ingen i pluginkörningen eller CI |
| Drawnix | minimal `.drawnix` JSON-undermengde med `geometry` og `arrow-line`-elementer | ingen i pluginkörningen eller CI |
| Draw.io | deterministisk, ukomprimeret `mxfile`-XML fra `SemanticFigureModel`, plus SVG/PNG/PDF-granskningsfiler | ingenting i pluginets kørsel eller CI |
| Drawnix | et minimalt JSON-undersett av `.drawnix` som bruger elementer `geometry` og `arrow-line`, plus SVG/PNG/PDF-granskningsfiler | ingenting i pluginets kørsel eller CI |
Avviket er avsiktlig: Notemd kan verifisere synlige etiketter, stabile ID:er og støttet primitivdekking uten å embedde diagrams.net Desktop, Drawnix, Plait eller bare-browserredaktørstater i pluginen.
@ -213,7 +219,11 @@ Notemd inkluderer nå den første begrensete repository-prototypen for denne ret
npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-inverter.tex
```
Prototypen legger til en separat `CircuitSpec`-grænse og en deterministisk eksporter for sex gullstandardfamilier:
Prototypen tilfører en begrænset `CircuitSpec`-grænse samt en deterministisk eksporter for sex guldstandard-familier:
I den eksperimentelle diagrammepipeline er dette nu også tilgængeligt gennem `intent: "circuit"` og renderingsmål `circuitikz`. Den genererede `DiagramSpec` kan kun embede `circuitSpec` for circuit-intent. `CircuitikzRenderer` skriver samme deterministiske `.tex`-kilde og tilføjer en SVG-forhandsvisning der er afledt fra den validerede krets-topologi, hvilket muliggør forhandsvisning i Obsidian samt eksport til SVG/PNG/PDF. Denne forhandsvisning er ikke et resultat af LaTeX/TikZJax-kompilering; den virkelige rendererbevislig information findes stadig i de eksplisite smoke-commander nedenfor.
For de understøttede guldstandard-mallene forbliver `layoutHints.inputSide` og `layoutHints.outputSide` kun kontroller til præsentation. De kan flytte den deterministiske placering af ind-/udgangsporter, men de endrer ikke topologiens signatur eller tillader en reparationsgang for at omkoble kretsen.
| Kretstype | Gullstandard | Strømsgaranti |
|--------------|------------------|-------------------|
@ -224,7 +234,7 @@ Prototypen legger til en separat `CircuitSpec`-grænse og en deterministisk eksp
| `cmos-nand2` | `cmos-nand2-v1` | validerer parallell PMOS pull-up, seriell NMOS pull-down, dobbel innstillinger `va` / `vb`, og `vout` før LaTeX skrives |
| `cmos-nor2` | `cmos-nor2-v1` | validerer seriell PMOS pull-up, parallell NMOS pull-down, dobbel innstillinger `va` / `vb`, og `vout` før LaTeX skrives |
Dette er ennå ikke en generell TikZ-generer. Den kompilerer ikke LaTeX, kaller ikke TikZJax, undersøker ikke skjermutsikter, eller kjører ikke automatisert bild-feilretting. Disse funksjonene kommer senere.
Dette er ikke en generel TikZ-generator. Den accepterer ikke vilkårlig TikZ-kode, kompilere LaTeX, kalle TikZJax, undersøge skærmbilder i pluginets kørsel, eller udføre automatiseret reparationsprocess for billeder. Disse funksjoner er fortsat planlagt til senere trin.
Kommandoen Preview diagram kan åpne tilbake gemte circuitikz-kildeartefakter direkte når filendelsen er `.tex` eller `.tikz` og kilden inneholder `\usepackage{circuitikz}` eller `\begin{circuitikz}`. Denne metoden er en circuitikz-kilde-eksklusiv preview: modalen viser kilden, diagnostikk, kopier/speicherningskontroller og historiksmetadata, men den kompilerer ikke LaTeX eller kaller ikke TikZJax under pluginets kjøring.
@ -350,8 +360,8 @@ For en CMOS-inverter bør prompten forespørre en eksplisitt topologi plus layou
|------|----------------|-----------|
| Almene diagrammer | Spec-first pipeline implementeret for Mermaid, JSON Canvas, Vega-Lite, HTML | Hold på med at udvide semantisk verifiseringsskyde |
| Redigerbare figurer | `editable-html-svg`, Draw.io XML, og Drawnix JSON artefaktgrænser implementeret | Tilføj mere komplekse primitive kun efter at tester har beviset redigerbarhed |
| CLI støtte | `npm run diagram:export-artifact` eksporterer redigerbare HTML/SVG, Draw.io, og Drawnix fra én `DiagramSpec` | Legg til målspesifikke røykfikser når nye mål leveres |
| circuitikz | `CircuitSpec -> circuitikz` prototyp eksporterer common-source, CMOS inverter, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1`, og `cmos-nor2` / `cmos-nor2-v1` gyllene maller, projekter `layoutHints.inputSide` og `layoutHints.outputSide` til bestemt inn-/utgangsportplassering uten å endre topologien, avviser reparasjontopologidrift gjennom `--topology-reference`, sender topologibeholderende reparasjonsbeskrivelser gjennom `--repair-brief-output` og schema `notemd.circuitikz.repair-brief.v1`, inkluderer strukturert `repairPrompt` overføringsinnhold med `diagnosticFocus`, `acceptanceCriteria`, og rolle `topology-preserving-circuitikz-repair`, validerer reparasjonskandidater gjennom `--repair-brief`, returnerer `repairAcceptance` gatebevis gjennom schema `notemd.circuitikz.repair-acceptance.v1` med `readyForVisualAcceptance` og `remainingChecks`, beholder dette beviset gjennom `--repair-acceptance-output`, parserer kompileringsskriver, kan kjøre eksplisitte lokale renderere plus `--expected-artifact`, SVG `--expected-svg-text`, tilgjengelighetsmetadatakontroller gjennom `aria-label`, `<title>`, og `<desc>`, utelukking av skjulte/ttransparente SVG elementer, `render-svg-text-path-only` / `pathOnlyGlyphUseCount` klassifisering for bare-på-path-etiketter, kontroller for bare-på-path-glyfeplassering for `<use href="#...">`, diagnostikk for bare-på-path-glyfeoverlappelse gjennom `render-svg-path-glyph-overlap`, hantering av nøyaktig strømspunkt for close-path for `Z/z`, nøyaktige bøngegränser for A/a bøngeextrema, nøyaktige Bezier-kurvegränser for C/S/Q/T kurveextrema, SVG gränser med hensyn til penselstyrke og kontroller for etikkeoverlappelse, `polyline` / `polygon` kontroller for tegngeometri, posisjonert `tspan` etikkegeometri, `text-anchor`-bevisst posisjonert tekstgeometri, geometri med transformasjon for SVG bounded-canvas/text-overlap og label-vs-drawing røykkontroller gjennom `render-svg-label-overlap`, samt PNG ikke-blankt / klippet / tett-foregrunnsskjermutsnittsrøykkontroller, inkludert indeksert-kolorgammal alfa, gråskala/RGB tRNS transparente eksempler, og formatspesifikk `render-png-unsupported` veiledning for Adam7 interlaced PNGs og indeksert bit-dyp-fel, gjennom `foregroundBounds`, `foregroundDensity`, `render-png-content-clipped`, og `render-png-foreground-dense` uten shell-parsering, inkluderer samlede vedligeholderingsrøykfikser gjennom `npm run diagram:smoke-circuitikz`, registrerer manglende rendererkonfigurasjon gjennom `rendererAvailability.status: "missing-configuration"` og `compile-executable-invalid`, og har generiske forhåndsvisningsdiagnostikk, diagnostisk sammanfattingsantall, diagnostikkbevisst historieinnhold, og kilde-enbart fallback gjennom `RenderArtifact.diagnostics` og forhåndsvisningsmodalen | Legg til OCR-nivå-etikkeerkjenning for bare-på-path-visuell tekst, nøyaktige pixelnivå-overlappingskontroller, bredere SVG path-oversettelse dersom nødvendig, automatisk installering/oppdagelse av renderer kun dersom det kan bli valgfritt, og automatisert topologibeholderende reparasjonsutføring |
| CLI-støtte | `npm run diagram:export-artifact` eksporterer redigerbare HTML/SVG-, Draw.io-, Drawnix-, Circuitikz- og SVG/PNG/PDF-visningsbevis fra en valideret `DiagramSpec` | Tilføj målspesifikke smoke-test-fiksturer når nye mål lanseres |
| circuitikz | `DiagramSpec(intent: "circuit", circuitSpec) -> CircuitikzRenderer -> circuitikz` eksporterer guldtempler for common-source, CMOS-inverter, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1` og `cmos-nor2` / `cmos-nor2-v1`, viser UI-intent-/render-mål-valgmuligheter, skriver TeX sammen med SVG/PNG/PDF-forhandsvisningsfiler, validerer topologien før utskrift, parserer kompilationslogger, kan kjøre eksplisite lokale renderer samt `--expected-artifact`, og holder en bare-kilde-fallback samt forhandsvisningsdiagnostikk synlig gjennom `RenderArtifact.diagnostics` og forhandsvisningsmodalen | Tilføj OCR-nivåsiktighetsidentifisering for visuell tekst som kun består av pather, nøyaktige pixelbaserte overlappeskjemer, bredere SVG-path-dekking dersom nødvendig, automatisk installering/oppdagelse av renderer kun dersom det kan holdes valgfritt, og automatisert utførelse av topologibeholderende reparasjoner |
| TikZJax integrasjon | Kandidatrenderingshost for Obsidian-side visning | Hold det valgfritt; gjør ikke TikZJax til en hard plugin-runtimeavhengighet |
## Konfigurasjon
@ -361,6 +371,7 @@ For en CMOS-inverter bør prompten forespørre en eksplisitt topologi plus layou
| `enableExperimentalDiagramPipeline` | `false` | Vendel mellom spec-first og legasie Mermaid |
| `experimentalDiagramCompatibilityMode` | `'legacy-mermaid'` | `'legacy-mermaid'` = Mermaid kun; `'best-fit'` = nativ mål + fallbacker |
| `preferredDiagramIntent` | `undefined` (auto) | Overrask automatisk intent-deteksjon |
| `preferredDiagramRenderTarget` | `undefined` (auto) | Overskrive artefaktrendereren, inkludert Draw.io, Drawnix og Circuitikz |
| `summarizeToMermaidLanguage` | `'en'` | Målsspråk for diagrammetiketter |
| `summarizeToMermaidProvider` / `Model` | DeepSeek | Per-oppgave LLM for diagramgenerering |
| `autoMermaidFixAfterGenerate` | (fra konstanter) | Kjør legasiefixer automatisk på Mermaid utdata |
@ -380,10 +391,11 @@ Når det er aktiveret, henter Notemd relevante kontekstsnipp fra vaultens lokale
| Aksjon | Metode |
|--------|--------|
| SVG export | `mermaid.render()` / `vega.View.toSVG()` / SVG builder for Canvas |
| PNG-eksport | SVG → Bild → Canvas (device pixel ratio 1x-3x) → PNG ArrayBuffer |
| Ekspor til PNG | SVG → Bild → Canvas / preview-rasteriseringsverktøy ved konfigurert PPI → PNG ArrayBuffer |
| Ekspor til PDF | SVG → rasterbild ved konfigurert PPI → enkeltsids-PDF |
| Sparing av kilde | Rå artefaktinnhold spart med målspesifikk ekstensjon |
| Forskyvning kun av kilden | Ikke-inline artefakter med kildemiddel vises som kod plus diagnostikk, uten iframe-rendering |
| Semantisk audit | Mermaid, JSON Canvas, Vega-Lite, og editabel HTML/SVG kontrolleret av `scripts/diagram-semantic-verification.js` |
| Semantisk audit | Mermaid, JSON Canvas, Vega-Lite, redigerbar HTML/SVG, Draw.io, Drawnix og begrænset Circuitikz kontrolleres av `scripts/diagram-semantic-verification.js` samt renderer/CLI-tester |
**Caching**: RenderCache bruker en deterministisk JSON-klue fra `{spec, target, theme}`. In-flight deduplikasjon forhindrer dupliserte renderinger.

View file

@ -1,7 +1,7 @@
---
id: diagrams
title: "Diagramy"
description: "Tworzy Mermaid, JSON Canvas, Vega-Lite, HTML, edytowalne pliki graficzne oraz przyszłe diagramy z ograniczeniami circuitikz na podstawie Twoich notatek przy użyciu architektury opartej na specyfikacji"
description: "Generuje diagramy Mermaid, JSON Canvas, Vega-Lite, HTML, edytowalne pliki z rysunkami, Draw.io, Drawnix oraz ograniczone diagramy circuitikz na podstawie Twoich notatek, wykorzystując architekturę opartą na specyfikacjach"
author:
'@id': 'https://jacobinwwey.github.io/obsidian-NotEMD/#person-jacobinwwey'
keywords: [diagrams, mermaid, vega-lite, canvas, visualization, spec-first, drawio, drawnix, editable svg, circuitikz, TikZJax]
@ -18,7 +18,7 @@ import TLDR from '@site/src/components/TLDR';
# Diagramy
<TLDR>
**Notemd generuje diagramy na podstawie Twoich notatek poprzez pipeline oparty na specyfikacji.** LLM tworzy format `DiagramSpec` JSON niezależny od renderera, a następnie dedykowane adaptery przekształcają go w Mermaid, JSON Canvas, Vega-Lite, HTML lub edytowalny wyjście w formacie HTML/SVG. Obsługuje 8 typów intencji, automatyczne łańcuchy fallback, przeglądanie na żywo z eksportem do SVG/PNG, weryfikację semantyczną oraz generację wzbogaconą o lokalną wiedzę.
**Notemd tworzy diagramy z Twoich notatek za pomocą procesu opartego na specyfikacjach.** Sztuczna inteligencja generuje niezależny od konkretnego renderera plik JSON typu `DiagramSpec`, a następnie dedykowane adaptery przekształcają go w formaty Mermaid, JSON Canvas, Vega-Lite, HTML, edytowalny HTML/SVG, Draw.io, Drawnix lub ograniczone diagramy circuitikz. Obsługuje 9 typów zadań, automatyczne łańcuchy awaryjne, żywy przegląd wraz z eksportem do formatów SVG/PNG/PDF, weryfikację semantyczną oraz generowanie wzbogacone o lokalną wiedzę.
</TLDR>
To jest część [Obsidian Przewodnika po zarządzaniu wiedzą AI](/docs/pillar-ai-knowledge).
@ -54,6 +54,7 @@ graph LR
| `stateDiagram` | Mermaid | HTML | Maszyny stanowe, modele życiowego cyklu |
| `canvasMap` | JSON Canvas | Mermaid → HTML | Mapy koncepcyjne, grafy wiedzy |
| `dataChart` | Vega-Lite | Mermaid → HTML | Wykresy słupkowe, liniowe, powierzchniowe, rozproszone, kołowe, tabele |
| `circuit` | circuitikz | none | Ograniczone diagramy obwodów na podstawie zweryfikowanych danych wejściowych typu `CircuitSpec` |
## Rozpoznawanie intencji
@ -67,6 +68,7 @@ Notemd wyznacza najlepszy typ diagramu na podstawie treści notatki przy użyciu
| `stateDiagram` | Stan, przejście, w oczekiwaniu, w trakcie, nieudane (3+ dopasowania) | 0.76 |
| `flowchart` | Kroki numerowane (2+) lub słownictwo if/then/else/workflow | 0.74 |
| `canvasMap` | Mapa koncepcyjna, graf wiedzy, przestrzenny, klastry | 0.72 |
| `circuit` | circuitikz, TikZJax, circuit, schematic, CMOS, NMOS, PMOS, MOSFET, VDD/GND, `vin`/`vout` | 0.78 |
| `mindmap` | Domyślny fallback | 0.55 |
Przejąć kontrolę za pomocą ustawienia **Wolany typ diagramu**, selektora z paska bocznego lub wyraźnej opcji palety poleceń.
@ -80,10 +82,9 @@ Eksperymentalny pipeline oparty na specyfikacji ma teraz dwa niezależne element
| Wolany typ diagramu | `preferredDiagramIntent` | Kieruje semantyczną formą generowanego `DiagramSpec` |
| Wolany cel renderowania | `preferredDiagramRenderTarget` | Wybiera narzędzie renderowania dla **Generuj diagram** i **Przeglądaj diagram** |
Ustaw **Wolany cel renderowania** na **Auto** jako domyślną wartość dla planera, albo wybierz wyraźnie Mermaid, JSON Canvas, Vega-Lite, HTML lub Edytowalny HTML/SVG. Ta zmiana ma zastosowanie tylko do poleceń generowania artefaktów i przeglądania. Standardowe polecenie **Streszcz jako diagram Mermaid** pozostaje przywiązane do wyjścia kompatybilnego z Mermaid, aby istniejące procesy Markdown nie zmieniały formatu w tle.
Ta separacja jest ważna, ponieważ intencja `flowchart` może być teraz renderowana jako Mermaid dla notatek Markdown, jako HTML jako solidny fallback lub jako Edytowalny HTML/SVG do dalszej edycji. Draw.io i Drawnix pozostają eksporterami artefaktów w formacie CLI, a nie celami renderowania wewnątrz narzędzia.
Ustaw **Preferred render target** na **Auto**, aby zachować domyślną wartość dla planera, lub wybierz bezpośrednio Mermaid, JSON Canvas, Vega-Lite, HTML, Editable HTML/SVG, Draw.io, Drawnix lub Circuitikz. Ta zmiana ma zastosowanie wyłącznie do poleceń generowania plików i przeglądania. Standardowe polecenie **Summarise as Mermaid diagram** pozostaje przywiązane do formatu kompatybilnego z Mermaid, dzięki czemu istniejące procesy oparte na Markdown nie zmieniają ukrycie formatu.
To rozdzielenie ma znaczenie, ponieważ intencja `flowchart` może być teraz renderowana jako Mermaid dla notatek w formacie Markdown, jako HTML jako solidny fallback, jako edytowalny HTML/SVG do dalszej edycji lub jako pliki źródłowe Draw.io/Drawnix wraz z towarzyszącymi obrazami SVG do przeglądania. Intencja `circuit` kieruje na Circuitikz i wymaga zweryfikowanej specyfikacji `CircuitSpec`; nie jest to prośba o dowolny tekst w formacie TikZ.
## Zastosowanie
### Stwórz diagram
@ -101,16 +102,21 @@ Ta separacja jest ważna, ponieważ intencja `flowchart` może być teraz render
| Vega-Lite | `.json` | `{note}_diagram.json` |
| HTML | `.html` | `{note}_diagram.html` |
| Edytowalne HTML/SVG | `.html` | `{note}_diagram.html` |
| Draw.io | `.drawio` + `.drawio.svg` + `.drawio.md` | `{note}_diagram.drawio` wraz z towarzyszącymi plikami do przeglądania |
| Drawnix | `.drawnix` + `.drawnix.svg` + `.drawnix.md` | `{note}_diagram.drawnix` wraz z towarzyszącymi plikami do przeglądania |
| Circuitikz | `.tex` + `.tex.svg` + `.tex.md` | `{note}_diagram.tex` wraz z towarzyszącymi plikami do przeglądania |
### Przegląd diagramu
1. Uruchom **"Notemd: Przegląd diagramu"**
2. Otwiera się modala z wyrenderowanym diagramem
3. Eksportuj jako SVG lub PNG za pomocą przycisków paska narzędzi
3. Eksportuj jako SVG, PNG lub PDF za pomocą przycisków na pasku narzędzi
**Automatyczne otwieranie przeglądu** jest dostępne w ustawieniach — po generacji modala przeglądowa otwiera się automatycznie.
Modala przeglądowa posiada również panel diagnostyki artefaktów. Renderery i sprawdzania dymowe mogą dołączać `RenderArtifact.diagnostics`; modala pokazuje podsumowanie diagnostyczne z liczbami błędów/warnings/informacji, następnie stopień poważności, rodzaj diagnostyki, komunikat oraz sugestie naprawy obok przeglądu. To samo podsumowanie jest pokazywane w wpisach historii przeglądów, dzięki czemu można porównywać powtarzające się próby circuitikz bez otwierania każdego wpisu. W przypadku artefaktów, które mają treść źródłową, ale nie mogą być renderowane wewnątrz tekstu lub przez ścieżkę iframe HTML, modala teraz przechodzi na przegląd tylko treści źródłowej zamiast wymuszać pusty iframe. Dzięki temu circuitikz sprawdzania kompilacji/renderowania, SVG sprawdzania tokenów tekstowych, sprawdzania pustego ekranu PNG oraz przyszłe raporty o nakładaniu się dają widoczną UI powierzchnię bez konieczności czynienia z TikZJax lub LaTeXu wymaganej zależności w czasie uruchamiania pluginu ani udawania, że tekst źródłowy to zweryfikowany render wizualny.
Eksport przeglądów w formatach PNG i PDF wykorzystuje ustawioną rozdzielczość PPI. Domyślna wartość to 300 PPI, a wartości powyżej 600 PPI są ograniczane do 600. Obrazy SVG zachowują rozmiar wektorowy. Pliki źródłowe takie jak `.drawio`, `.drawnix` i `.tex` mogą zawierać plik towarzyszący o nazwie `previewSvg`, dzięki czemu Obsidian może wyświetlać i eksportować obrazy przeznaczone do przeglądania, bez konieczności włączania bibliotek diagram.net, Drawnix, LaTeX czy TikZJax podczas działania wtyczki.
Modal prezentujący wstępny widok posiada również panel diagnostyki artefaktów. Narzędzia renderujące oraz testy wstępne mogą dołączać wartość `RenderArtifact.diagnostics`; modal pokazuje podsumowanie diagnostyczne z liczbami błędów, ostrzeżeń i informacji, a następnie stopień powagi, rodzaj diagnozy, komunikat oraz sugestie naprawy obok widoku prezentacyjnego. To samo podsumowanie jest wyświetlane w wpisach historii uwzględniających diagnostykę, dzięki czemu można porównywać powtarzające się próby renderowania circuitikz bez konieczności otwierania każdego wpisu osobno. W przypadku artefaktów, które posiadają treść źródłową, ale nie mogą zostać wyrenderowane w formie wstępnej ani za pośrednictwem ścieżki iframe HTML, modal teraz korzysta z prezentacji opartej wyłącznie na treści źródłowej zamiast wymuszać użycie pustego iframe. Dzięki temu testy kompilacji/renderowania circuitikz, sprawdzania tokenów tekstowych w SVG, sprawdzania pustych skrínshotów w formacie PNG, raportowanie nakładania się glifów opartych wyłącznie na ścieżkach oraz przyszłe raporty o nakładaniu się mają widoczną interfejs użytkownika, bez konieczności czynienia z TikZJax lub LaTeX silnym wymogiem runtime dla wtyczek ani udawania, że tekst źródłowy jest już zweryfikowanym renderem wizualnym.
### Tryb Legacy Mermaid
@ -164,12 +170,12 @@ Ten cel celowo nie jest jeszcze domyślną ścieżką planera. Jest dostępny ja
### Draw.io i Drawnix Granice eksportu
Obecna implementacja utrzymuje wsparcie dla edytorów third-party na granicy artefaktu:
Obecna implementacja utrzymuje obsługę narzędzi stworzonych przez inne firmy na granicy pliku wynikowego, jednocześnie udostępniając wyraźne cele renderowania:
| Cel | Umowa | Zależność w czasie wykonywania |
|--------|----------|--------------------|
| Draw.io | deterministyczny nieskompresowany `mxfile` XML pochodzący z `SemanticFigureModel` | brak takich elementów w czasie wykonywania pluginu ani w CI |
| Drawnix | minimalny podzbiór `.drawnix` JSON wykorzystujący elementy `geometry` i `arrow-line` | brak takich elementów w czasie wykonywania pluginu ani w CI |
| Draw.io | deterministyczny, niespakowany XML typu `mxfile` pochodzący z `SemanticFigureModel`, wraz z plikami SVG/PNG/PDF służącymi do przeglądania | brak takich elementów w czasie działania wtyczki ani w procesie CI |
| Drawnix | minimalny podzbiór JSON w formacie `.drawnix`, wykorzystujący elementy `geometry` oraz `arrow-line`, wraz z plikami SVG/PNG/PDF służącymi do przeglądania | brak takich elementów w czasie działania wtyczki ani w procesie CI |
Ta kompromis jest celowy: Notemd może sprawdzać widoczne etykiety, stabilne ID oraz obsługę podstawowych elementów bez włączania diagram.net Desktop, Drawnix, Plait lub stanu edytora dostępnego tylko w przeglądarce do pluginu.
@ -213,7 +219,11 @@ Notemd obejmuje teraz pierwszy ograniczony prototyp repozytorium dla tej kierunk
npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-inverter.tex
```
Prototyp dodaje oddzielną granicę `CircuitSpec` oraz deterministycznego eksporterów dla sześciu rodzin złotych referencji:
Prototyp wprowadza ograniczoną granicę typu `CircuitSpec` oraz deterministycznego eksporterów dla sześciu rodzin wzorcowych:
W eksperymentalnym pipeline do tworzenia diagramów można teraz również uzyskać ten efekt za pomocą parametru `intent: "circuit"` oraz celu renderowania `circuitikz`. Wygenerowany plik `DiagramSpec` może zawierać element `circuitSpec` wyłącznie w przypadku zamiaru tworzenia diagramów obwodowych. `CircuitikzRenderer` zapisuje ten sam deterministyczny plik źródłowy typu `.tex` i dołącza plik przeglądania w formacie SVG, utworzony na podstawie zweryfikowanej topologii obwodu, co umożliwia przeglądanie w Obsidian oraz eksport plików w formatach SVG/PNG/PDF. Ten plik przeglądania nie jest wynikiem kompilacji LaTeX/TikZJax; rzeczywiste dowody pochodzące od renderera pozostają w postaci wyraźnych poleceń testowych podanych poniżej.
Dla obsługiwanych szablonów wzorcowych, pola `layoutHints.inputSide` oraz `layoutHints.outputSide` pozostają jedynie elementami służącymi do prezentacji. Mogą one zmieniać pozycję portów wejściowych/wyjściowych w sposób deterministyczny, ale nie modyfikują sygnatury topologii ani nie umożliwiają wykonywania kroku naprawczego służącego do przeprowadzenia przełączeń w obwodzie.
| Rodzaj obwodu | Złota referencja | Gwarancja prądu |
|--------------|------------------|-------------------|
@ -224,7 +234,7 @@ Prototyp dodaje oddzielną granicę `CircuitSpec` oraz deterministycznego ekspor
| `cmos-nand2` | `cmos-nand2-v1` | weryfikuje równoległe podciąganie PMOS, szeregowe opuszczanie NMOS, podwójne wejścia `va` / `vb` oraz `vout` przed zapisem do LaTeX |
| `cmos-nor2` | `cmos-nor2-v1` | weryfikuje szeregowe podciąganie PMOS, równoległe opuszczanie NMOS, podwójne wejścia `va` / `vb` oraz `vout` przed zapisem do LaTeX |
To nie jest jeszcze ogólny generator TikZ. Nie kompiluje LaTeX, nie wywołuje TikZJax, nie analizuje ekranów zrzutów ani nie uruchamia automatycznego naprawiania na podstawie obrazów. Te funkcje pozostają w późniejszych etapach.
Nie jest to ogólny generator kodu TikZ. Nie przyjmuje on dowolnych plików w formacie TikZ, nie kompiluje kodu LaTeX, nie wywołuje TikZJax, nie analizuje ekranówek w czasie działania wtyczki ani nie uruchamia automatycznych procesów naprawczych na podstawie informacji z obrazów. Te funkcje pozostają elementami realizowanymi w późniejszych etapach.
Polecenie Diagramu Przeglądowego może ponownie otworzyć zapisane artefakty źródłowe circuitikz bezpośrednio, gdy rozszerzenie pliku to `.tex` lub `.tikz`, a źródło zawiera `\usepackage{circuitikz}` lub `\begin{circuitikz}`. Ta ścieżka to przegląd tylko źródła typu circuitikz: okno modalne pokazuje źródło, diagnozy, kontrolery kopiowania/zapisu oraz metadane historii, ale nie kompiluje LaTeX ani nie wywołuje TikZJax w trakcie działania wtyczki.
@ -350,8 +360,8 @@ Dla inwertera CMOS prompt powinien wymagać wyraźnej topologii oraz ograniczeń
|------|----------------|-----------|
| Ogólne schematy | Zaimplementowano pipeline oparty na specyfikacji dla Mermaid, JSON Canvas, Vega-Lite, HTML | Kontynuuj rozszerzanie zakresu weryfikacji semantycznej |
| Rysunki edytowalne | Zaimplementowano granice artefaktów `editable-html-svg`, Draw.io XML oraz Drawnix JSON | Dodawaj bardziej złożone prymitywy tylko po tym, jak testy potwierdzą możliwość edycji |
| Obsługa CLI | `npm run diagram:export-artifact` eksportuje edytowalne HTML/SVG, Draw.io i Drawnix z jednego `DiagramSpec` | Dodawanie specyficznych dla celu elementów do symulacji dymu po dostarczeniu nowych celów |
| circuitikz | `CircuitSpec -> circuitikz` prototyp eksportuje wspólne źródło, inwerter CMOS, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1` oraz `cmos-nor2` / `cmos-nor2-v1` szablony złote, projekty `layoutHints.inputSide` i `layoutHints.outputSide` do deterministycznego umieszczania portów wejściowych/wyjściowych bez zmiany topologii, odrzuca odchylenia topologii naprawy za pomocą `--topology-reference`, wytwarza krótkie informacje o naprawie zachowującej topologię przez `--repair-brief-output` i schemat `notemd.circuitikz.repair-brief.v1`, zawiera ustrukturyzowany `repairPrompt` treść przekazywania z `diagnosticFocus`, `acceptanceCriteria` oraz rolą `topology-preserving-circuitikz-repair`, weryfikuje kandydatów do naprawy za pomocą `--repair-brief`, zwraca dowody bramowe przez schemat `notemd.circuitikz.repair-acceptance.v1` z `readyForVisualAcceptance` i `remainingChecks`, przechowuje te dowody przez `--repair-acceptance-output`, analizuje logi kompilacji, może uruchamiać wyraźne lokalne renderery plus `--expected-artifact`, SVG `--expected-svg-text`, sprawdzanie metadanych dostępności przez `aria-label`, `<title>` oraz `<desc>`, wykluczanie ukrytych/przezroczystych SVG elementów, klasyfikacja `render-svg-text-path-only` / `pathOnlyGlyphUseCount` dla etykiet tylko ścieżkowych, sprawdzanie umieszczania glyphów tylko ścieżkowych dla `<use href="#...">`, diagnostyka nakładania się glyphów tylko ścieżkowych przez `render-svg-path-glyph-overlap`, obsługa punktu prądu dla zamkniętych ścieżek dla `Z/z`, dokładne granice łuków dla ekstremów łuku A/a, dokładne granice krzywych Beziera dla ekstremów krzywych C/S/Q/T, sprawdzanie nakładania się etykiet z uwzględnieniem grubości linii SVG, sprawdzanie geometrii rysowania `polyline` / `polygon`, geometria etykiet umieszczonych `tspan`, geometria tekstu umieszczonego z uwzględnieniem `text-anchor`, geometria uwzględniająca transformację dla SVG ograniczonej obrazówki/nakładania się tekstu i symulacji dymu etykieta-przeciwko-rysunkowi przez `render-svg-label-overlap` oraz sprawdzanie ekranów zrzutów PNG niepustych/obciętych/gęstych tła, w tym alfa palety kolorów indeksowanych, próbki przejrzyste w szarości/RGB tRNS oraz specyficzne dla formatu `render-png-unsupported` wskazówki dotyczące PNG interlaced Adam7 i błędów głębokości bitowej indeksowanej, przez `foregroundBounds`, `foregroundDensity`, `render-png-content-clipped` oraz `render-png-foreground-dense` bez analizy shella, zawiera agregowane elementy do symulacji dymu dla utrzymywaczy przez `npm run diagram:smoke-circuitikz`, rejestruje brak konfiguracji renderera przez `rendererAvailability.status: "missing-configuration"` i `compile-executable-invalid`, posiada ogólne diagnostyki wstępne, liczbę podsumowań diagnostycznych, wpisy historii uwzględniające diagnostykę oraz fallback tylko z kodu źródłowego przez `RenderArtifact.diagnostics` i modal wstępny | Dodawanie rozpoznawania etykiet na poziomie OCR dla tekstu wizualnego tylko ścieżkowego, dokładne sprawdzanie nakładania się na poziomie pikseli, szersze pokrycie SVG ścieżek tam gdzie to konieczne, automatyczna instalacja/odkrywanie renderera tylko wtedy gdy może pozostać opcjonalne oraz automatyczne wykonywanie napraw zachowujących topologię |
| Obsługa CLI | `npm run diagram:export-artifact` eksportuje edytowalne pliki HTML/SVG, Draw.io, Drawnix, Circuitikz oraz pliki SVG/PNG/PDF jako dowody weryfikacji pochodzące z jednego zweryfikowanego `DiagramSpec` | Dodawanie specyficznych dla celu testów smoke po wprowadzeniu nowych celów |
| circuitikz | `DiagramSpec(intent: "circuit", circuitSpec) -> CircuitikzRenderer -> circuitikz` eksportuje szablony typu golden dla struktur common-source, inwertera CMOS, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1` oraz `cmos-nor2` / `cmos-nor2-v1`, udostępnia opcje intencji interfejsu i celu renderowania, zapisuje pliki TeX wraz z prewizjami w formacie SVG/PNG/PDF, weryfikuje topologię przed wygenerowaniem wyniku, analizuje logi kompilacji, może uruchamiać lokalne renderery w sposób wyraźny wraz z flagą `--expected-artifact`, a także zapewnia fallback oparty wyłącznie na źródle oraz widoczność diagnostyk prewizji poprzez `RenderArtifact.diagnostics` i moduł prewizji | Dodanie rozpoznawania etykiet na poziomie OCR dla tekstu wizualnego składającego się wyłącznie z ścieżek, dokładnych sprawdzeń nakładania się na poziomie pikseli, szerszego pokrycia ścieżek SVG tam, gdzie jest to konieczne, automatycznego instalowania lub wykrywania rendererów tylko wtedy, gdy pozostaną one opcjonalne, oraz automatycznego wykonywania napraw zachowujących topologię |
| Integracja TikZJax | Host renderowania kandydatów dla wyświetlania po stronie Obsidian | Utrzymać to jako opcjonalne; nie uczyniać TikZJax obowiązkową zależnością runtime'owej wtyczki |
## Konfiguracja
@ -361,6 +371,7 @@ Dla inwertera CMOS prompt powinien wymagać wyraźnej topologii oraz ograniczeń
| `enableExperimentalDiagramPipeline` | `false` | Przełączanie między podejściem opartym na specyfikacji a starszym Mermaid |
| `experimentalDiagramCompatibilityMode` | `'legacy-mermaid'` | `'legacy-mermaid'` = Mermaid tylko; `'best-fit'` = cele natywne + fallbacki |
| `preferredDiagramIntent` | `undefined` (automatycznie) | Przejęcie automatycznego wykrywania intencji |
| `preferredDiagramRenderTarget` | `undefined` (automatycznie) | Przezbrojenie renderera artefaktów, w tym Draw.io, Drawnix oraz Circuitikz |
| `summarizeToMermaidLanguage` | `'en'` | Język celu dla etykiet diagramu |
| `summarizeToMermaidProvider` / `Model` | DeepSeek | LLM na poziomie zadania dla generowania diagramu |
| `autoMermaidFixAfterGenerate` | (z stałych) | Automatyczne uruchomienie starszego naprawiacza na wyjściu Mermaid |
@ -380,10 +391,11 @@ Gdy jest włączone, Notemd pobiera odpowiednie fragmenty kontekstu z lokalnej b
| Działanie | Metoda |
|--------|--------|
| SVG export | Budownik `mermaid.render()` / `vega.View.toSVG()` / SVG dla Canvas |
| Eksport PNG | SVG → Obraz → Canvas (stopień rozdzielczości pikseli urządzenia 1x-3x) → PNG ArrayBuffer |
| Eksport do PNG | SVG → Obraz → Canvas / rasterizator prezentacyjny przy ustawionej rozdzielczości punktowej → Bufor danych PNG |
| Eksport do PDF | SVG → obraz rasterowy przy ustawionej rozdzielczości punktowej → pojedyncza strona PDF |
| Zapis źródła | Treść surowego artefaktu jest zapisywana z rozszerzeniem specyficznym dla celu |
| Przegląd tylko źródła | Artefakty nieinline z treścią źródłową wyświetlane jako kod wraz z diagnozami, bez renderowania iframe |
| Audyt semantyczny | Mermaid, JSON Canvas, Vega-Lite oraz edytowalny HTML/SVG sprawdzany przez `scripts/diagram-semantic-verification.js` |
| Audyt semantyczny | Mermaid, JSON Canvas, Vega-Lite, edytowalny HTML/SVG, Draw.io, Drawnix oraz ograniczony Circuitikz są sprawdzane przez plik `scripts/diagram-semantic-verification.js` w połączeniu z testami renderera i interfejsu CLI |
**Caching**: RenderCache wykorzystuje deterministyczny klucz JSON od `{spec, target, theme}`. Eliminacja duplikatów w trakcie przetwarzania zapobiega powtarzającym się renderom.

View file

@ -1,7 +1,7 @@
---
id: diagrams
title: "Diagramas"
description: "Gera Mermaid, JSON Canvas, Vega-Lite, HTML, artefatos de figura editáveis e diagramas circuitikz futuros com restrições a partir de suas anotações, utilizando uma arquitetura baseada em especificações primeiro"
description: "Gere diagramas Mermaid, JSON Canvas, Vega-Lite, HTML, artefatos de figura editáveis, Draw.io, Drawnix e diagramas circuitikz restritos a partir de suas anotações, utilizando uma arquitetura baseada em especificações primeiro"
author:
'@id': 'https://jacobinwwey.github.io/obsidian-NotEMD/#person-jacobinwwey'
keywords: [diagrams, mermaid, vega-lite, canvas, visualization, spec-first, drawio, drawnix, editable svg, circuitikz, TikZJax]
@ -18,7 +18,7 @@ import TLDR from '@site/src/components/TLDR';
# Diagramas
<TLDR>
**Notemd gera diagramas a partir de suas anotações por meio de um pipeline baseado em especificações primeiro.** O LLM produz um `DiagramSpec` JSON independente do renderizador, e então adaptadores dedicados o traduzem para Mermaid, JSON Canvas, Vega-Lite, HTML ou saída editável HTML/SVG. Suporta 8 tipos de intenção, cadeias de fallback automáticas, visualização ao vivo com exportação para SVG/PNG, verificação semântica e geração aprimorada com conhecimento local.
**Notemd gera diagramas a partir de suas anotações por meio de um pipeline baseado em especificações.** O LLM produz um JSON `DiagramSpec` independente do renderizador, e então adaptadores especializados o convertem em saídas em Mermaid, JSON Canvas, Vega-Lite, HTML, HTML/SVG editáveis, Draw.io, Drawnix ou circuitikz restrito. Suporta 9 tipos de intenção, cadeias de fallback automáticas, visualização ao vivo com exportação para SVG/PNG/PDF, verificação semântica e geração aprimorada com conhecimento local.
</TLDR>
Isso faz parte do [Obsidian Guia de Gestão de Conhecimento de IA](/docs/pillar-ai-knowledge).
@ -54,6 +54,7 @@ graph LR
| `stateDiagram` | Mermaid | HTML | Máquinas de estado, modelos de ciclo de vida |
| `canvasMap` | JSON Canvas | Mermaid → HTML | Mapas conceituais, grafos de conhecimento |
| `dataChart` | Vega-Lite | Mermaid → HTML | Barra, linha, área, dispersão, pizza, tabelas |
| `circuit` | circuitikz | none | Diagramas circuiticos restritos a partir de pacotes `CircuitSpec` validados |
## Detecção de intenção
@ -67,6 +68,7 @@ Notemd infere o melhor tipo de diagrama a partir do conteúdo da sua anotação
| `stateDiagram` | Estado, transição, pendente, em execução, falho (3+ correspondências) | 0.76 |
| `flowchart` | Passos numerados (2+) ou vocabulário if/then/else/workflow | 0.74 |
| `canvasMap` | Mapa conceitual, grafo de conhecimento, espacial, cluster | 0.72 |
| `circuit` | circuitikz, TikZJax, circuit, schematic, CMOS, NMOS, PMOS, MOSFET, VDD/GND, `vin`/`vout` | 0.78 |
| `mindmap` | Valor padrão de fallback | 0.55 |
Sobrescreva usando a configuração **Tipo de diagrama preferido**, o seletor da barra lateral ou uma opção explícita da paleta de comandos.
@ -80,10 +82,9 @@ O pipeline experimental baseado em especificações agora possui dois controles
| Tipo de diagrama preferido | `preferredDiagramIntent` | Direciona a forma semântica do `DiagramSpec` gerado |
| Alvo de renderização preferido | `preferredDiagramRenderTarget` | Escolhe o processador de artefatos para **Gerar diagrama** e **Visualizar diagrama** |
Defina **Alvo de renderização preferido** como **Auto** como padrão do planejador, ou escolha Mermaid, JSON Canvas, Vega-Lite, HTML ou Editable HTML/SVG explicitamente. A sobrescrita aplicase apenas aos comandos de artefato e visualização. O comando padrão **Resumir como diagrama Mermaid** permanece vinculado a saídas compatíveis com Mermaid, para que os fluxos de trabalho atuais em Markdown não alterem silenciosamente o formato.
Essa separação é importante porque uma intenção `flowchart` agora pode ser renderizada como Mermaid para notas em Markdown, como HTML para fallback robusto, ou como Editable HTML/SVG para edição posterior. Draw.io e Drawnix continuam sendo exportadores de artefatos CLI e não alvos de renderização dentro do plugin.
Defina **Alvo de renderização preferido** como **Auto** para o padrão do planejador, ou escolha explicitamente Mermaid, JSON Canvas, Vega-Lite, HTML, HTML/SVG editável, Draw.io, Drawnix ou Circuitikz. A substituição se aplica apenas aos comandos de artefato e visualização. O comando padrão **Resumir como diagrama Mermaid** permanece vinculado à saída compatível com Mermaid, para que os fluxos de trabalho atuais em Markdown não alterem silenciosamente o formato.
Essa separação é importante porque uma intenção `flowchart` agora pode ser renderizada como Mermaid para anotações em Markdown, como HTML para um fallback robusto, como HTML/SVG editável para edição posterior, ou como artefatos de origem Draw.io/Drawnix acompanhados de imagens SVG para revisão. Uma intenção `circuit` direciona o processo ao Circuitikz e exige um `CircuitSpec` validado; não se trata de um pedido por texto TikZ arbitrário.
## Uso
### Gerar um Diagrama
@ -101,16 +102,21 @@ Essa separação é importante porque uma intenção `flowchart` agora pode ser
| Vega-Lite | `.json` | `{note}_diagram.json` |
| HTML | `.html` | `{note}_diagram.html` |
| Editável HTML/SVG | `.html` | `{note}_diagram.html` |
| Draw.io | `.drawio` + `.drawio.svg` + `.drawio.md` | `{note}_diagram.drawio` juntamente com arquivos complementares de revisão |
| Drawnix | `.drawnix` + `.drawnix.svg` + `.drawnix.md` | `{note}_diagram.drawnix` juntamente com arquivos complementares de revisão |
| Circuitikz | `.tex` + `.tex.svg` + `.tex.md` | `{note}_diagram.tex` juntamente com arquivos complementares de revisão |
### Visualizar um Diagrama
1. Executar **"Notemd: Visualizar diagrama"**
2. Uma janela modal é aberta com o diagrama renderizado
3. Exportar como SVG ou PNG usando os botões da barra de ferramentas
3. Exporte como SVG, PNG ou PDF usando os botões da barra de ferramentas
**Abrir visualização automaticamente** está disponível nas configurações — após a geração, a janela modal de visualização é aberta automaticamente.
A janela modal de visualização também possui um painel de diagnóstico de artefatos. Os renderizadores e testes de validação podem anexar `RenderArtifact.diagnostics`; a janela mostra um resumo de diagnóstico com contagens de erros/avisos/informações, seguido da gravidade, tipo de diagnóstico, mensagem e sugestões de correção ao lado da visualização. O mesmo resumo é exibido nas entradas do histórico de visualizações, permitindo comparar tentativas repetidas de teste circuitikz sem abrir cada entrada. Para artefatos que possuem conteúdo de origem, mas não podem ser renderizados inline ou por meio do caminho do iframe HTML, a janela modal agora recorre a uma visualização apenas de código-fonte em vez de forçar um iframe vazio. Isso permite testes de compilação/renderização circuitikz, verificações de tokens de texto SVG, verificações de captura de tela em branco PNG e relatórios futuros de sobreposição com uma superfície visível UI, sem tornar o TikZJax ou o LaTeX uma dependência obrigatória em tempo de execução do plugin ou fingir que o texto de origem é uma renderização visual verificada.
A exportação de visualização em PNG e PDF utiliza a resolução PPI configurada. O valor padrão é 300 PPI, e valores acima de 600 PPI são limitados a 600. O SVG mantém seu tamanho vetorial. Artefatos de origem como `.drawio`, `.drawnix` e `.tex` podem fornecer um arquivo complementar `previewSvg`, permitindo que o Obsidian exiba e exporte imagens revisáveis sem incorporar diagram.net, Drawnix, LaTeX ou TikZJax durante a execução do plugin.
O modal de visualização prévia também possui um painel de diagnósticos de artefatos. Os processadores de renderização e os testes de funcionalidade podem anexar o objeto `RenderArtifact.diagnostics`; o modal exibe um resumo dos diagnósticos com as contagens de erros, avisos e informações, seguido da gravidade, do tipo de diagnóstico, da mensagem e de sugestões de correção ao lado da prévia. O mesmo resumo é exibido nas entradas de histórico que reconhecem diagnósticos, permitindo assim comparar tentativas repetidas de teste de funcionalidade do circuitikz sem a necessidade de abrir cada entrada individualmente. Para artefatos que possuem conteúdo de origem, mas não podem ser renderizados diretamente ou por meio do caminho do iframe HTML, o modal agora recorre a uma prévia que mostra apenas o conteúdo de origem, em vez de forçar a exibição de um iframe vazio. Isso oferece uma interface visual para testes de compilação/renderização do circuitikz, verificações de tokens de texto em SVG, verificações de capturas de tela em PNG, relatórios de sobreposição de glifos com apenas o caminho, e futuros relatórios de sobreposição, sem tornar o TikZJax ou o LaTeX uma dependência obrigatória em tempo de execução do plugin, nem fingir que o texto de origem já é uma renderização visual verificada.
### Modo Legado Mermaid
@ -164,12 +170,12 @@ Esse alvo ainda não é intencionalmente a rota padrão do planejador. Ele está
### Draw.io e Drawnix Limites de Exportação
A implementação atual mantém o suporte a editores de terceiros na fronteira do artefato:
A implementação atual mantém o suporte a editores de terceiros na fronteira do artefato, ao mesmo tempo em que expõe destinos de renderização explícitos:
| Alvo | Contrato | Dependência em Tempo de Execução |
|--------|----------|--------------------|
| Draw.io | `mxfile` XML descompactado e determinístico a partir de `SemanticFigureModel` | nenhum na execução do plugin ou no CI |
| Drawnix | subconjunto mínimo de `.drawnix` JSON usando elementos `geometry` e `arrow-line` | nenhum na execução do plugin ou no CI |
| Draw.io | XML `mxfile` descompactado e determinístico gerado a partir do `SemanticFigureModel`, além de arquivos de revisão em SVG/PNG/PDF | nenhum recurso disponível durante a execução do plugin ou no CI |
| Drawnix | Subconjunto mínimo de JSON em formato `.drawnix` que utiliza os elementos `geometry` e `arrow-line`, além de arquivos de revisão em SVG/PNG/PDF | nenhum recurso disponível durante a execução do plugin ou no CI |
O tradeoff é intencional: Notemd pode verificar rótulos visíveis, IDs estáveis e cobertura de primitivas suportadas sem incorporar o Diagrams.net Desktop, Drawnix, Plait ou o estado do editor apenas para navegador ao plugin.
@ -213,7 +219,11 @@ Notemd agora inclui o primeiro protótipo de repositório restrito para esta dir
npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-inverter.tex
```
O protótipo adiciona uma fronteira `CircuitSpec` separada e um exportador determinístico para seis famílias de referência dourada:
O protótipo adiciona uma fronteira restrita definida por `CircuitSpec` e um exportador determinístico para seis famílias de referência padrão:
No pipeline experimental de diagramas, isso também pode ser acessado agora por meio de `intent: "circuit"` e do destino de renderização `circuitikz`. O `DiagramSpec` gerado pode incluir um `circuitSpec` apenas quando o intent for circuito. O `CircuitikzRenderer` gera a mesma fonte em `.tex` determinística e anexa um arquivo de visualização em SVG derivado dessa topologia de circuito validada, permitindo visualização no Obsidian além da exportação em SVG/PNG/PDF. Esse arquivo de acompanhamento não é resultado de compilação em LaTeX/TikZJax; as evidências reais do renderizador ainda pertencem aos comandos específicos listados a seguir.
Para os modelos padrão suportados, `layoutHints.inputSide` e `layoutHints.outputSide` continuam sendo controles exclusivamente voltados para a apresentação. Eles podem mover a posição determinística das portas de entrada/saída, mas não alteram a assinatura da topologia nem permitem que uma etapa de reparo reconfigure o circuito.
| Tipo de circuito | Referência dourada | Garantia de corrente |
|--------------|------------------|-------------------|
@ -224,7 +234,7 @@ O protótipo adiciona uma fronteira `CircuitSpec` separada e um exportador deter
| `cmos-nand2` | `cmos-nand2-v1` | valida o pull-up paralelo de PMOS, o pull-down em série de NMOS, entradas duplas `va` / `vb` e `vout` antes de gerar LaTeX |
| `cmos-nor2` | `cmos-nor2-v1` | valida o pull-up em série de PMOS, o pull-down paralelo de NMOS, entradas duplas `va` / `vb` e `vout` antes de gerar LaTeX |
Este ainda não é um gerador geral de TikZ. Ele não compila LaTeX, chama TikZJax, inspeciona capturas de tela ou executa reparo automático de imagem. Essas funcionalidades ficam para fases posteriores.
Este não é um gerador genérico de TikZ. Ele não aceita código TikZ arbitrário, não compila LaTeX, não chama o TikZJax, não inspeciona capturas de tela durante a execução do plugin, nem executa processos automatizados de reparo com base em feedback visual. Essas funcionalidades permanecem como etapas futuras.
O comando Diagrama de Pré-visualização pode reabrir diretamente os artefatos de código circuitikz salvos quando a extensão do arquivo é `.tex` ou `.tikz` e o código contém `\usepackage{circuitikz}` ou `\begin{circuitikz}`. Esse modo é uma pré-visualização apenas de código: a janela modal exibe o código, diagnósticos, controles de cópia/gravar e metadados de histórico, mas não compila LaTeX nem chama TikZJax durante a execução do plugin.
@ -350,8 +360,8 @@ Para um inversor CMOS, o prompt deve solicitar explicitamente a topologia e rest
|------|----------------|-----------|
| Diagramas Gerais | Pipeline baseado em especificações implementado para Mermaid, JSON Canvas, Vega-Lite, HTML | Continue ampliando a cobertura de verificação semântica |
| Figuras Editáveis | As fronteiras dos artefatos `editable-html-svg`, Draw.io XML e Drawnix JSON foram implementadas | Adicione primitivas mais avançadas somente após testes comprovarem a editabilidade |
| Suporte a CLI | O `npm run diagram:export-artifact` exporta HTML/SVG, Draw.io e Drawnix editáveis a partir de um `DiagramSpec` | Adicionar dispositivos de fumaça específicos para cada alvo quando novos alvos forem enviados |
| circuitikz | `CircuitSpec -> circuitikz` o protótipo exporta modelos padrão de código aberto, inversor CMOS, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1` e `cmos-nor2` / `cmos-nor2-v1` modelosouro, projetos `layoutHints.inputSide` e `layoutHints.outputSide` para uma disposição determinística das portas de entrada/saída sem alterar a topologia, rejeita mudanças na topologia de reparo por meio de `--topology-reference`, emite relatórios de reparo que preservam a topologia por meio de `--repair-brief-output` e do esquema `notemd.circuitikz.repair-brief.v1`, inclui conteúdo estruturado de transferência `repairPrompt` com `diagnosticFocus`, `acceptanceCriteria` e o papel `topology-preserving-circuitikz-repair`, valida candidatos a reparo por meio de `--repair-brief`, retorna evidências da porta `repairAcceptance` por meio do esquema `notemd.circuitikz.repair-acceptance.v1` com `readyForVisualAcceptance` e `remainingChecks`, mantém essas evidências por meio de `--repair-acceptance-output`, analisa logs de compilação, pode executar renderizadores locais explícitos além de `--expected-artifact`, SVG `--expected-svg-text`, verificações de metadados de acessibilidade por meio de `aria-label`, `<title>` e `<desc>`, exclusão de elementos SVG ocultos/translúcidos, classificação `render-svg-text-path-only` / `pathOnlyGlyphUseCount` para rótulos apenas de caminho, verificações de posicionamento de glifos apenas de caminho para `<use href="#...">`, diagnósticos de sobreposição de glifos apenas de caminho por meio de `render-svg-path-glyph-overlap`, tratamento do ponto atual em caminhos fechados para `Z/z`, limites exatos dos arcos A/a nos extremos, limites exatos das curvas Bezier C/S/Q/T nos extremos, verificações de sobreposição de rótulos com consideração à espessura da linha SVG, verificações geométricas de desenho `polyline` / `polygon`, geometria de rótulos posicionados `tspan`, geometria de texto posicionado sensível a `text-anchor`, geometria sensível a transformações para SVG sobreposição de texto em canvas delimitado e fumaça de rótulo vs desenho por meio de `render-svg-label-overlap`, além de verificações de captura de tela PNG sem vazio / recortada / com fundo denso, incluindo paleta de cores indexadas com alfa, amostras transparentes em tons de cinza/RGB tRNS e orientações específicas para formatos `render-png-unsupported` em PNGs entrelaçados Adam7 e falhas de profundidade de bits indexada, por meio de `foregroundBounds`, `foregroundDensity`, `render-png-content-clipped` e `render-png-foreground-dense` sem análise de shell, inclui dispositivos de fumaça agregados para mantenedores por meio de `npm run diagram:smoke-circuitikz`, registra configurações de renderizador ausentes por meio de `rendererAvailability.status: "missing-configuration"` e `compile-executable-invalid`, e possui diagnósticos gerais de visualização, contagens de resumo de diagnósticos, entradas de histórico sensíveis a diagnósticos e fallback apenas de código-fonte por meio de `RenderArtifact.diagnostics` e do modal de visualização | Adicionar reconhecimento de rótulos em nível OCR para texto visual apenas de caminho, verificações precisas de sobreposição em nível de pixel, cobertura mais ampla de caminhos SVG quando necessário, instalação/descoberta automática de renderizadores somente se puder permanecer opcional, e execução automática de reparo que preserva a topologia |
| Suporte CLI | `npm run diagram:export-artifact` exporta evidências editáveis em HTML/SVG, Draw.io, Drawnix, Circuitikz, bem como arquivos SVG/PNG/PDF para revisão, a partir de um `DiagramSpec` validado | Adicionar testes de funcionalidade específicos para cada novo alvo ao ser lançado |
| circuitikz | `DiagramSpec(intent: "circuit", circuitSpec) -> CircuitikzRenderer -> circuitikz` exporta modelos padrão para fontes comuns, inversores CMOS, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1` e `cmos-nor2` / `cmos-nor2-v1`, exibe opções de intenção da interface e de destino de renderização, gera arquivos em TeX acompanhados de visualizações preliminares em SVG/PNG/PDF, valida a topologia antes da geração do resultado, analisa os logs de compilação, permite a execução de renderizadores locais específicos além do uso de `--expected-artifact`, e mantém uma opção de fallback apenas com o código-fonte, além de exibir diagnósticos das visualizações por meio de `RenderArtifact.diagnostics` e do modal de pré-visualização | Adicionar reconhecimento de rótulos em nível OCR para texto visual que contenha apenas caminhos, verificações precisas de sobreposição em nível de pixel, maior cobertura de caminhos SVG quando necessário, instalação e descoberta automáticas de renderizadores somente se isso puder permanecer opcional, e execução automática de reparos que preservem a topologia |
| Integração TikZJax | Host de renderização candidato para exibição do lado Obsidian | Manter como opcional; não tornar TikZJax uma dependência obrigatória em tempo de execução do plugin |
## Configuração
@ -361,6 +371,7 @@ Para um inversor CMOS, o prompt deve solicitar explicitamente a topologia e rest
| `enableExperimentalDiagramPipeline` | `false` | Alternar entre modo focado em especificações e modo legado Mermaid |
| `experimentalDiagramCompatibilityMode` | `'legacy-mermaid'` | `'legacy-mermaid'` = Mermaid apenas; `'best-fit'` = alvos nativos + alternativas |
| `preferredDiagramIntent` | `undefined` (automático) | Sobrescrever a detecção automática de intenção |
| `preferredDiagramRenderTarget` | `undefined` (automático) | Sobrescrever o processador de artefatos, incluindo Draw.io, Drawnix e Circuitikz |
| `summarizeToMermaidLanguage` | `'en'` | Idioma do alvo para rótulos de diagrama |
| `summarizeToMermaidProvider` / `Model` | DeepSeek | LLM por tarefa para geração de diagramas |
| `autoMermaidFixAfterGenerate` | (de constantes) | Executar automaticamente o corretor legado nos resultados de Mermaid |
@ -380,10 +391,11 @@ Quando ativado, Notemd busca trechos de contexto relevantes da base de conhecime
| Ação | Método |
|--------|--------|
| SVG export | Construtor `mermaid.render()` / `vega.View.toSVG()` / SVG para Canvas |
| Exportação em PNG | SVG → Imagem → Canvas (relação de pixels do dispositivo de 1x a 3x) → ArrayBuffer PNG |
| Exportação para PNG | SVG → Imagem → Canvas / rasterizador de visualização com a resolução PPI configurada → ArrayBuffer PNG |
| Exportação para PDF | SVG → imagem rasterizada com a resolução PPI configurada → PDF de página única |
| Salvar a Fonte | O conteúdo bruto do artefato é salvo com a extensão específica do destino |
| Pré-visualização apenas da Fonte | Artefatos não inline com o conteúdo da fonte são exibidos como código acompanhado de diagnósticos, sem renderização em iframe |
| Auditoria Semântica | Mermaid, JSON Canvas, Vega-Lite e HTML/SVG editável verificado por `scripts/diagram-semantic-verification.js` |
| Auditoria semântica | Mermaid, JSON Canvas, Vega-Lite, HTML/SVG editáveis, Draw.io, Drawnix e circuitikz com restrições são verificados pelo arquivo `scripts/diagram-semantic-verification.js` além de testes do processador e da CLI |
**Armazenamento em cache**: O RenderCache utiliza uma chave JSON determinística de `{spec, target, theme}`. A deduplicação em tempo real impede renderizações duplicadas.

View file

@ -1,7 +1,7 @@
---
id: diagrams
title: "Diagramas"
description: "Gerar Mermaid, JSON Canvas, Vega-Lite, HTML, artefatos de figura editáveis e diagramas circuitikz futuros restritos a partir de suas anotações, utilizando uma arquitetura baseada em especificações primeiro"
description: "Gerar diagramas Mermaid, JSON Canvas, Vega-Lite, HTML, artefatos de figura editáveis, Draw.io, Drawnix e diagramas circuitikz restritos a partir de suas anotações, utilizando uma arquitetura baseada em especificações primeiro"
author:
'@id': 'https://jacobinwwey.github.io/obsidian-NotEMD/#person-jacobinwwey'
keywords: [diagrams, mermaid, vega-lite, canvas, visualization, spec-first, drawio, drawnix, editable svg, circuitikz, TikZJax]
@ -18,7 +18,7 @@ import TLDR from '@site/src/components/TLDR';
# Diagramas
<TLDR>
**Notemd gera diagramas a partir de suas anotações por meio de um pipeline baseado em especificações primeiro.** O LLM produz um `DiagramSpec` JSON independente do renderizador, e então adaptadores dedicados o traduzem para Mermaid, JSON Canvas, Vega-Lite, HTML ou saída editável HTML/SVG. Suporta 8 tipos de intenção, cadeias de fallback automático, visualização ao vivo com exportação para SVG/PNG, verificação semântica e geração aprimorada com conhecimento local.
**Notemd gera diagramas a partir de suas anotações por meio de um pipeline baseado em especificações primeiro.** O LLM produz um JSON `DiagramSpec` independente do renderizador, e então adaptadores especializados o traduzem para saídas em Mermaid, JSON Canvas, Vega-Lite, HTML, HTML/SVG editáveis, Draw.io, Drawnix ou circuitikz restrito. Suporta 9 tipos de intenção, cadeias de fallback automáticas, visualização ao vivo com exportação para SVG/PNG/PDF, verificação semântica e geração aprimorada com conhecimento local.
</TLDR>
Isso faz parte do [Obsidian Guia de Gestão de Conhecimento de IA](/docs/pillar-ai-knowledge).
@ -54,6 +54,7 @@ graph LR
| `stateDiagram` | Mermaid | HTML | Máquinas de estado, modelos de ciclo de vida |
| `canvasMap` | JSON Canvas | Mermaid → HTML | Mapas conceituais, grafos de conhecimento |
| `dataChart` | Vega-Lite | Mermaid → HTML | Gráficos de barras, linhas, áreas, dispersão, pizza e tabelas |
| `circuit` | circuitikz | none | Diagramas circuiticos restritos a partir de pacotes `CircuitSpec` validados |
## Detecção de intenção
@ -67,6 +68,7 @@ Notemd infere o melhor tipo de diagrama a partir do conteúdo da sua anotação
| `stateDiagram` | Estado, transição, pendente, em execução, falho (3+ correspondências) | 0.76 |
| `flowchart` | Passos numerados (2+) ou vocabulário if/then/else/workflow | 0.74 |
| `canvasMap` | Mapa conceitual, grafo de conhecimento, espacial, cluster | 0.72 |
| `circuit` | circuitikz, TikZJax, circuit, schematic, CMOS, NMOS, PMOS, MOSFET, VDD/GND, `vin`/`vout` | 0.78 |
| `mindmap` | Valor padrão de fallback | 0.55 |
Sobrescreva usando a configuração **Tipo de diagrama preferido**, o seletor da barra lateral ou uma opção explícita da paleta de comandos.
@ -80,10 +82,9 @@ O pipeline experimental baseado em especificações agora possui dois controles
| Tipo de diagrama preferido | `preferredDiagramIntent` | Direciona a forma semântica do `DiagramSpec` gerado |
| Alvo de renderização preferido | `preferredDiagramRenderTarget` | Escolhe o processador de artefatos para **Gerar diagrama** e **Visualizar diagrama** |
Defina **Alvo de renderização preferido** como **Auto** como padrão do planejador, ou escolha Mermaid, JSON Canvas, Vega-Lite, HTML ou Editable HTML/SVG explicitamente. A sobrescrita aplicase apenas aos comandos de artefato e visualização. O comando padrão **Resumir como diagrama Mermaid** permanece vinculado a saídas compatíveis com Mermaid, para que os fluxos de trabalho existentes em Markdown não alterem silenciosamente o formato.
Essa separação é importante porque uma intenção `flowchart` agora pode ser renderizada como Mermaid para notas em Markdown, como HTML para fallback robusto, ou como Editable HTML/SVG para edição posterior. Draw.io e Drawnix continuam sendo exportadores de artefatos CLI e não alvos de renderização dentro do plugin.
Defina **Preferred render target** como **Auto** para o padrão do planejador, ou escolha explicitamente Mermaid, JSON Canvas, Vega-Lite, HTML, Editable HTML/SVG, Draw.io, Drawnix ou Circuitikz. A substituição se aplica apenas aos comandos de artefato e visualização. O comando padrão **Summarise as Mermaid diagram** permanece vinculado à saída compatível com Mermaid, para que os fluxos de trabalho existentes em Markdown não alterem silenciosamente o formato.
Essa separação é importante porque uma intenção `flowchart` agora pode ser renderizada como Mermaid para anotações em Markdown, como HTML para um fallback robusto, como Editable HTML/SVG para edição posterior, ou como artefatos de origem Draw.io/Drawnix acompanhados de imagens SVG para revisão. Uma intenção `circuit` direciona o processo ao Circuitikz e requer um `CircuitSpec` validado; não se trata de um pedido por texto TikZ arbitrário.
## Uso
### Gerar um Diagrama
@ -101,16 +102,21 @@ Essa separação é importante porque uma intenção `flowchart` agora pode ser
| Vega-Lite | `.json` | `{note}_diagram.json` |
| HTML | `.html` | `{note}_diagram.html` |
| Editável HTML/SVG | `.html` | `{note}_diagram.html` |
| Draw.io | `.drawio` + `.drawio.svg` + `.drawio.md` | `{note}_diagram.drawio` juntamente com arquivos de revisão |
| Drawnix | `.drawnix` + `.drawnix.svg` + `.drawnix.md` | `{note}_diagram.drawnix` juntamente com arquivos de revisão |
| Circuitikz | `.tex` + `.tex.svg` + `.tex.md` | `{note}_diagram.tex` juntamente com arquivos de revisão |
### Visualizar um Diagrama
1. Executar **"Notemd: Visualizar diagrama"**
2. Uma janela modal é aberta com o diagrama renderizado
3. Exportar como SVG ou PNG usando os botões da barra de ferramentas
3. Exporte como SVG, PNG ou PDF usando os botões da barra de ferramentas
**Abrir visualização automaticamente** está disponível nas configurações — após a geração, a janela modal de visualização é aberta automaticamente.
A janela modal de visualização também possui um painel de diagnóstico de artefatos. Os renderizadores e verificações de smoke podem anexar `RenderArtifact.diagnostics`; a janela mostra um resumo de diagnóstico com contagens de erros/avisos/informações, seguido da gravidade, tipo de diagnóstico, mensagem e sugestões de reparo ao lado da visualização. O mesmo resumo é exibido nas entradas do histórico de visualizações, permitindo comparar tentativas repetidas de circuitikz smoke sem abrir cada entrada. Para artefatos que possuem conteúdo de origem, mas não podem ser renderizados inline ou por meio do caminho de iframe HTML, a janela modal agora recorre a uma visualização apenas de código-fonte em vez de forçar um iframe vazio. Isso permite realizar verificações de compile/render smoke de circuitikz, verificações de tokens de texto de SVG, verificações de captura de tela em branco PNG e relatórios futuros de sobreposição com uma superfície visível de UI, sem tornar o TikZJax ou o LaTeX uma dependência obrigatória em tempo de execução do plugin ou fingir que o texto de origem é uma renderização visual verificada.
A exportação de visualização em PNG e PDF utiliza a resolução PPI configurada. O valor padrão é 300 PPI, e valores acima de 600 PPI são limitados a 600. O SVG mantém seu tamanho vetorial. Artefatos de origem como `.drawio`, `.drawnix` e `.tex` podem fornecer um arquivo complementar `previewSvg`, permitindo que o Obsidian exiba e exporte imagens revisáveis sem incorporar diagram.net, Drawnix, LaTeX ou TikZJax durante a execução do plugin.
O modal de visualização prévia também possui um painel de diagnósticos de artefatos. Os processadores de renderização e os testes de funcionalidade podem anexar o objeto `RenderArtifact.diagnostics`; o modal exibe um resumo dos diagnósticos com as contagens de erros, avisos e informações, seguido da gravidade, do tipo de diagnóstico, da mensagem e de sugestões de correção ao lado da prévia. O mesmo resumo é exibido nas entradas de histórico que reconhecem diagnósticos, permitindo assim comparar tentativas repetidas de teste de funcionalidade do circuitikz sem a necessidade de abrir cada entrada individualmente. Para artefatos que possuem conteúdo de origem, mas não podem ser renderizados diretamente ou por meio do caminho do iframe HTML, o modal agora recorre a uma prévia que mostra apenas o conteúdo de origem, em vez de forçar o uso de um iframe vazio. Isso oferece aos testes de compilação e renderização do circuitikz, às verificações de tokens de texto SVG, às verificações de captura de tela em PNG vazia, aos relatórios de sobreposição de glifos baseados apenas em caminhos e a futuros relatórios de sobreposição uma interface visual acessível, sem tornar o TikZJax ou o LaTeX uma dependência obrigatória em tempo de execução de plugins, nem fingir que o texto de origem já é uma renderização visual verificada.
### Modo Legado Mermaid
@ -164,12 +170,12 @@ Esse alvo ainda não é intencionalmente o caminho padrão do planejador. Ele es
### Limites de exportação Draw.io e Drawnix
A implementação atual mantém o suporte a editores de terceiros na fronteira do artefato:
A implementação atual mantém o suporte a editores de terceiros na fronteira do artefato, ao mesmo tempo em que expõe destinos de renderização explícitos:
| Alvo | Contrato | Dependência em tempo de execução |
|--------|----------|--------------------|
| Draw.io | `mxfile` XML descompactado e determinístico a partir de `SemanticFigureModel` | nenhum na execução do plugin ou no CI |
| Drawnix | subconjunto mínimo de `.drawnix` JSON usando elementos `geometry` e `arrow-line` | nenhum na execução do plugin ou no CI |
| Draw.io | XML `mxfile` descompactado e determinístico proveniente do `SemanticFigureModel`, além de arquivos complementares em SVG/PNG/PDF para revisão | nenhum recurso disponível durante a execução do plugin ou no CI |
| Drawnix | um subconjunto mínimo de JSON em formato `.drawnix` que utiliza os elementos `geometry` e `arrow-line`, além de arquivos complementares em SVG/PNG/PDF para revisão | nenhum recurso disponível durante a execução do plugin ou no CI |
O tradeoff é intencional: Notemd pode verificar rótulos visíveis, IDs estáveis e cobertura de primitivas suportadas sem incorporar o Diagrams.net Desktop, Drawnix, Plait ou o estado do editor apenas para navegador no plugin.
@ -213,7 +219,11 @@ Notemd agora inclui o primeiro protótipo de repositório restrito para esta dir
npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-inverter.tex
```
O protótipo adiciona uma fronteira `CircuitSpec` separada e um exportador determinístico para seis famílias de referência dourada:
O protótipo adiciona uma fronteira restrita definida por `CircuitSpec` e um exportador determinístico para seis famílias de referência padrão:
No pipeline experimental de diagramas, isso também pode ser acessado agora por meio de `intent: "circuit"` e do destino de renderização `circuitikz`. O `DiagramSpec` gerado pode incluir um `circuitSpec` apenas quando o intent for circuito. O `CircuitikzRenderer` gera a mesma fonte em `.tex` determinística e anexa um arquivo complementar em SVG derivado dessa topologia de circuito validada, permitindo visualização no Obsidian além da exportação em SVG/PNG/PDF. Esse arquivo complementar não é resultado de compilação em LaTeX/TikZJax; as evidências reais do renderizador ainda pertencem aos comandos específicos listados a seguir.
Para os modelos padrão suportados, `layoutHints.inputSide` e `layoutHints.outputSide` continuam sendo controles exclusivamente voltados para apresentação. Eles podem mover a posição determinística das portas de entrada/saída, mas não alteram a assinatura da topologia nem permitem uma etapa de reparo para reconfigurar o circuito.
| Tipo de circuito | Referência dourada | Garantia de corrente |
|--------------|------------------|-------------------|
@ -224,7 +234,7 @@ O protótipo adiciona uma fronteira `CircuitSpec` separada e um exportador deter
| `cmos-nand2` | `cmos-nand2-v1` | valida o pull-up paralelo de PMOS, o pull-down em série de NMOS, entradas duplas `va` / `vb` e `vout` antes de escrever LaTeX |
| `cmos-nor2` | `cmos-nor2-v1` | valida o pull-up em série de PMOS, o pull-down paralelo de NMOS, entradas duplas `va` / `vb` e `vout` antes de escrever LaTeX |
Este ainda não é um gerador geral de TikZ. Ele não compila LaTeX, chama TikZJax, inspeciona capturas de tela ou executa reparo automático de imagem com feedback. Essas funcionalidades ficam para fases posteriores.
Este não é um gerador genérico de TikZ. Ele não aceita código TikZ arbitrário, não compila LaTeX, não chama o TikZJax, não inspeciona capturas de tela durante a execução do plugin, nem executa processos automatizados de reparo com base em feedback visual. Essas funcionalidades permanecem como etapas futuras.
O comando Diagrama de Pré-visualização pode reabrir diretamente os artefatos de código circuitikz salvos quando a extensão do arquivo é `.tex` ou `.tikz` e o código contém `\usepackage{circuitikz}` ou `\begin{circuitikz}`. Esse modo é uma pré-visualização apenas de código circuitikz: a janela modal exibe o código, diagnósticos, controles de cópia/gravar e metadados de histórico, mas não compila LaTeX nem chama TikZJax durante a execução do plugin.
@ -350,8 +360,8 @@ Para um inversor CMOS, o prompt deve solicitar explicitamente a topologia e rest
|------|----------------|-----------|
| Diagramas Gerais | Pipeline baseado em especificações implementado para Mermaid, JSON Canvas, Vega-Lite, HTML | Continue ampliando a cobertura de verificação semântica |
| Figuras Editáveis | As fronteiras dos artefatos `editable-html-svg`, Draw.io XML e Drawnix JSON foram implementadas | Adicione primitivas mais ricas somente após testes comprovarem a editabilidade |
| Suporte a CLI | `npm run diagram:export-artifact` exporta HTML/SVG, Draw.io e Drawnix editáveis a partir de um `DiagramSpec` | Adicionar dispositivos de fumaça específicos para cada alvo quando novos alvos forem enviados |
| circuitikz | `CircuitSpec -> circuitikz` o protótipo exporta fontes comuns, inversor CMOS, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1` e `cmos-nor2` / `cmos-nor2-v1` modelos padrão dourados, projetos `layoutHints.inputSide` e `layoutHints.outputSide` para uma disposição determinística das portas de entrada/saída sem alterar a topologia, rejeita mudanças na topologia de reparo por meio de `--topology-reference`, emite relatórios de reparo que preservam a topologia por meio de `--repair-brief-output` e do esquema `notemd.circuitikz.repair-brief.v1`, inclui conteúdo estruturado de transferência `repairPrompt` com `diagnosticFocus`, `acceptanceCriteria` e papel de `topology-preserving-circuitikz-repair`, valida candidatos a reparo por meio de `--repair-brief`, retorna evidências da porta `repairAcceptance` por meio do esquema `notemd.circuitikz.repair-acceptance.v1` com `readyForVisualAcceptance` e `remainingChecks`, mantém essas evidências por meio de `--repair-acceptance-output`, analisa logs de compilação, pode executar renderizadores locais explícitos além de `--expected-artifact`, SVG `--expected-svg-text`, verificações de metadados de acessibilidade por meio de `aria-label`, `<title>` e `<desc>`, exclusão de elementos SVG ocultos/translúcidos, classificação `render-svg-text-path-only` / `pathOnlyGlyphUseCount` para rótulos apenas de caminho, verificações de posicionamento de glifos apenas de caminho para `<use href="#...">`, diagnósticos de sobreposição de glifos apenas de caminho por meio de `render-svg-path-glyph-overlap`, tratamento do ponto atual em caminhos fechados para `Z/z`, limites exatos dos arcos para extremos de arco A/a, limites exatos das curvas Bezier para extremos de curvas C/S/Q/T, verificações de sobreposição de rótulos com consideração à espessura da linha SVG, verificações geométricas de desenho `polyline` / `polygon`, geometria de rótulos posicionados `tspan`, geometria de texto posicionado considerando `text-anchor`, geometria sensível a transformações para SVG sobreposição de texto em canvas delimitado e fumaça de rótulo versus desenho por meio de `render-svg-label-overlap`, além de verificações de captura de tela PNG sem vazio / recortada / com fundo denso, incluindo paleta de cores indexadas com alfa, amostras transparentes em tons de cinza/RGB tRNS e orientações específicas para formatos `render-png-unsupported` para PNGs entrelaçados Adam7 e falhas de profundidade de bits indexada, por meio de `foregroundBounds`, `foregroundDensity`, `render-png-content-clipped` e `render-png-foreground-dense` sem análise de shell, inclui dispositivos de fumaça agregados para mantenedores por meio de `npm run diagram:smoke-circuitikz`, registra configurações de renderizador ausentes por meio de `rendererAvailability.status: "missing-configuration"` e `compile-executable-invalid`, e possui diagnósticos gerais de visualização, contagens de resumo de diagnósticos, entradas de histórico sensíveis a diagnósticos e fallback apenas de código-fonte por meio de `RenderArtifact.diagnostics` e do modal de visualização | Adicionar reconhecimento de rótulos em nível OCR para texto visual apenas de caminho, verificações precisas de sobreposição em nível de pixel, cobertura mais ampla de caminhos SVG quando necessário, instalação/descoberta automática de renderizadores somente se puder permanecer opcional, e execução automática de reparo que preserva a topologia |
| Suporte CLI | `npm run diagram:export-artifact` exporta evidências editáveis em HTML/SVG, Draw.io, Drawnix, Circuitikz, bem como arquivos SVG/PNG/PDF para revisão, a partir de um `DiagramSpec` validado | Adicionar testes de funcionalidade específicos para cada novo alvo ao ser lançado |
| circuitikz | `DiagramSpec(intent: "circuit", circuitSpec) -> CircuitikzRenderer -> circuitikz` exporta modelos padrão para fontes comuns, inversores CMOS, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1` e `cmos-nor2` / `cmos-nor2-v1`, exibe opções de intenção da interface e destino de renderização, gera arquivos TeX acompanhados de visualizações preliminares em SVG/PNG/PDF, valida a topologia antes da geração do resultado, analisa os logs de compilação, permite a execução de renderizadores locais específicos além do uso de `--expected-artifact`, e mantém um fallback com apenas o código-fonte, além de exibir diagnósticos das visualizações por meio de `RenderArtifact.diagnostics` e do modal de pré-visualização | Adicionar reconhecimento de rótulos em nível OCR para texto visual que contenha apenas caminhos, verificações precisas de sobreposição em nível de pixel, maior cobertura de caminhos SVG quando necessário, instalação e descoberta automáticas de renderizadores somente se isso puder permanecer opcional, e execução automática de reparos que preservam a topologia |
| Integração TikZJax | Host de renderização candidato para exibição do lado Obsidian | Manter como opcional; não tornar TikZJax uma dependência obrigatória em tempo de execução do plugin |
## Configuração
@ -361,6 +371,7 @@ Para um inversor CMOS, o prompt deve solicitar explicitamente a topologia e rest
| `enableExperimentalDiagramPipeline` | `false` | Alternar entre modo focado em especificações e modo legado Mermaid |
| `experimentalDiagramCompatibilityMode` | `'legacy-mermaid'` | `'legacy-mermaid'` = Mermaid apenas; `'best-fit'` = alvos nativos + alternativas |
| `preferredDiagramIntent` | `undefined` (automático) | Sobrescrever a detecção automática de intenção |
| `preferredDiagramRenderTarget` | `undefined` (automático) | Sobrescrever o processador de artefatos, incluindo Draw.io, Drawnix e Circuitikz |
| `summarizeToMermaidLanguage` | `'en'` | Idioma do alvo para rótulos de diagrama |
| `summarizeToMermaidProvider` / `Model` | DeepSeek | LLM por tarefa para geração de diagramas |
| `autoMermaidFixAfterGenerate` | (de constantes) | Executar automaticamente o corretor legado nos resultados de Mermaid |
@ -380,10 +391,11 @@ Quando ativado, Notemd obtém trechos de contexto relevantes da base de conhecim
| Ação | Método |
|--------|--------|
| SVG export | `mermaid.render()` / `vega.View.toSVG()` / SVG builder para Canvas |
| Exportação em PNG | SVG → Imagem → Canvas (relação de pixels do dispositivo de 1x a 3x) → ArrayBuffer PNG |
| Exportação para PNG | SVG → Imagem → Canvas / rasterizador de visualização com a resolução PPI configurada → ArrayBuffer PNG |
| Exportação para PDF | SVG → imagem rasterizada com a resolução PPI configurada → PDF de página única |
| Salvar a Fonte | O conteúdo bruto do artefato é salvo com a extensão específica do destino |
| Pré-visualização apenas da Fonte | Artefatos não inline com o conteúdo da fonte são exibidos como código além de diagnósticos, sem renderização em iframe |
| Auditoria Semântica | Mermaid, JSON Canvas, Vega-Lite e HTML/SVG editável verificado por `scripts/diagram-semantic-verification.js` |
| Auditoria semântica | Mermaid, JSON Canvas, Vega-Lite, HTML/SVG editáveis, Draw.io, Drawnix e circuitikz com restrições são verificados pelo arquivo `scripts/diagram-semantic-verification.js` além de testes do processador e da CLI |
**Armazenamento em cache**: O RenderCache utiliza uma chave JSON determinística de `{spec, target, theme}`. A deduplicação em tempo real impede renderizações duplicadas.

View file

@ -1,7 +1,7 @@
---
id: diagrams
title: "Diagrame"
description: "Generă Mermaid, JSON Canvas, Vega-Lite, HTML, artefacte de figură editabile, precum și diagrame circuitikz limitate pentru viitor din notele dumneavoastră, folosind o arhitectură bazată pe specificații"
description: "Generează diagrame Mermaid, JSON Canvas, Vega-Lite, HTML, artefacte de figură editabile, Draw.io, Drawnix și diagrame circuitikz cu restricții din notele dumneavoastră, folosind o arhitectură bazată pe specificații în primul rând"
author:
'@id': 'https://jacobinwwey.github.io/obsidian-NotEMD/#person-jacobinwwey'
keywords: [diagrams, mermaid, vega-lite, canvas, visualization, spec-first, drawio, drawnix, editable svg, circuitikz, TikZJax]
@ -18,7 +18,7 @@ import TLDR from '@site/src/components/TLDR';
# Diagrame
<TLDR>
**Notemd generează diagrame din notele dumneavoastră printr-un pipeline bazat pe specificații.** LLM produce un `DiagramSpec` JSON independent de renderer, apoi adapteri specializați îl traduc în Mermaid, JSON Canvas, Vega-Lite, HTML sau în rezultate editabile HTML/SVG. Suportă 8 tipuri de intenție, lanțuri automatice de fallback, previsualizare în timp real cu export în SVG/PNG, verificare semantică și generare îmbunătățită cu cunoștințe locale.
**Notemd generează diagrame din notele dumneavoastră printr-o pipeline bazată pe specificații.** LLM-ul produce un fișier JSON `DiagramSpec` independent de renderer, iar adaptatoarele dedicate îl traduc în formaturi Mermaid, JSON Canvas, Vega-Lite, HTML, HTML/SVG editabile, Draw.io, Drawnix sau diagrame circuitikz cu restricții. Suportă 9 tipuri de intenție, lanțuri automatice de fallback, previsualizare în timp real cu export în SVG/PNG/PDF, verificare semantică și generare îmbunătățită cu cunoștințe locale.
</TLDR>
Acesta face parte din [Obsidian Ghidul de gestionare a cunoștințelor AI](/docs/pillar-ai-knowledge).
@ -54,6 +54,7 @@ graph LR
| `stateDiagram` | Mermaid | HTML | Machinile de stare, modelele de ciclu de viață |
| `canvasMap` | JSON Canvas | Mermaid → HTML | Hărți conceptuale, grafe de cunoaștere |
| `dataChart` | Vega-Lite | Mermaid → HTML | Charte: bar, linie, zonă, dispersie, piatră, tabele |
| `circuit` | circuitikz | none | Diagrame circuitice cu restricții din datele valide `CircuitSpec` |
## Detectarea intenției
@ -67,6 +68,7 @@ Notemd inferă cel mai bun tip de diagramă din conținutul notei folosind scora
| `stateDiagram` | Stare, tranziție, așteptare, în execuție, eșuat (3+ corespondențe) | 0.76 |
| `flowchart` | Pași numerotați (2+) sau vocabular if/then/else/workflow | 0.74 |
| `canvasMap` | Hartă conceptuală, graf de cunoștințe, spațial, cluster | 0.72 |
| `circuit` | circuitikz, TikZJax, circuit, schematic, CMOS, NMOS, PMOS, MOSFET, VDD/GND, `vin`/`vout` | 0.78 |
| `mindmap` | Valoare implicită de rezervă | 0.55 |
Să se suprascrie cu setarea **Tipul preferat de diagramă**, selectorul din bara laterală sau o opțiune explicită din panoul de comenzi.
@ -80,10 +82,9 @@ Pipeline-ul experimental bazat pe specificații are acum două controale indepen
| Tipul preferat de diagramă | `preferredDiagramIntent` | Ghidează forma semantică a `DiagramSpec` generatului |
| Ținta preferată de afișare | `preferredDiagramRenderTarget` | Alege rendererul pentru artefact în funcție de opțiunile **Genera diagramă** și **Previsualizare a diagramării** |
Setați **Ținta preferată de afișare** la **Auto** ca valoare implicită pentru planificator, sau alegeți explicit Mermaid, JSON Canvas, Vega-Lite, HTML sau Editable HTML/SVG. Suprascrierea se aplică doar la comenzile de generare a artefactului și previsualizare. Comanda standard **Summarise as Mermaid diagram** rămâne legată de ieșire compatibilă cu Mermaid, astfel încât fluxurile existente în Markdown nu se schimbă fără observație de format.
Această separare este importantă deoarece o intenție `flowchart` poate fi acum afișată ca Mermaid pentru notele în Markdown, ca HTML pentru o valoare de rezervă robustă, sau ca Editable HTML/SVG pentru editare ulterioară. Draw.io și Drawnix rămân exportatori de artefacte CLI, nu ținte de afișare din interiorul pluginului.
Setați **Targetul de renderizare preferat** la **Auto** pentru valoarea implicită a planificatorului, sau alegeți explicit Mermaid, JSON Canvas, Vega-Lite, HTML, HTML/SVG editabil, Draw.io, Drawnix sau Circuitikz. Această modificare se aplică doar comandelor de generare a artefactelor și previsualizare. Comanda standard **Summarise as Mermaid diagram** rămâne fixată pe output compatibil cu Mermaid, astfel încât fluxurile existente în Markdown nu să schimbe tăcător formatul.
Această separare este importantă deoarece o intenție `flowchart` poate fi acum renderizată ca Mermaid pentru notele Markdown, ca HTML pentru un fallback robust, ca HTML/SVG editabil pentru editare ulterioară, sau ca artefacte sursă Draw.io/Drawnix cu imagini SVG pentru revizuire. O intenție `circuit` este direcționată către Circuitikz și necesită un `CircuitSpec` validat; nu reprezintă o cerere de text TikZ arbitrar.
## Utilizare
### Genera un diagramă
@ -101,16 +102,21 @@ Această separare este importantă deoarece o intenție `flowchart` poate fi acu
| Vega-Lite | `.json` | `{note}_diagram.json` |
| HTML | `.html` | `{note}_diagram.html` |
| Editable HTML/SVG | `.html` | `{note}_diagram.html` |
| Draw.io | `.drawio` + `.drawio.svg` + `.drawio.md` | `{note}_diagram.drawio` plus companioni de revizuire |
| Drawnix | `.drawnix` + `.drawnix.svg` + `.drawnix.md` | `{note}_diagram.drawnix` plus companioni de revizuire |
| Circuitikz | `.tex` + `.tex.svg` + `.tex.md` | `{note}_diagram.tex` plus companioni de revizuire |
### Previsualizare a unui diagram
1. Rulați **"Notemd: Previsualizare diagram"**
2. Se deschide o fereastră modală cu diagrama generată
3. Exportați ca SVG sau PNG folosind butoanele din bara de instrumente
3. Exportați ca SVG, PNG sau PDF folosind butoanele din bara de instrumente
**Deschiderea automată a previsualizării** este disponibilă în setările — după generare, fereastra modală de previsualizare se deschide automat.
Fereastra modală de previsualizare are și un panou de diagnostic al artefactelor. Rendererele și verificările smoke pot atașa `RenderArtifact.diagnostics`; fereastra afișează o rezumată diagnostică cu numărurile de erori/avertismente/informații, apoi severitatea, tipul diagnosticului, mesajul și sfaturile de reparare lângă previsualizare. Aceeași rezumată este afișată în intrările istoricului de previsualizare, astfel încât tentativele repetate de circuitikz smoke pot fi comparate fără a deschide fiecare intrare. Pentru artefactele care au conținut sursă dar nu pot fi renderizate inline sau prin calea iframe-ului HTML, fereastra modală recurge acum la o previsualizare doar cu sursă în loc să forțeze un iframe gol. Acest lucru oferă circuitikz de compilare/render smoke, SVG de verificare a tokenilor text, verificări PNG cu captură de ecran golă și rapoarte viabile de suprapunere viitoare fără a face din TikZJax sau LaTeX o dependență strictă la timpul rulării pluginului sau fără a pretinde că textul sursă este o renderizare vizuală verificată.
Exportul pentru previsualizare în PNG și PDF folosește PPI-ul configurat pentru previsualizare. Valoarea implicită este 300 PPI, iar valorile peste 600 PPI sunt limitate la 600. SVG rămâne de dimensiuni vectoriale. Artefactele sursă precum `.drawio`, `.drawnix` și `.tex` pot furniza un fișier `previewSvg` care permite lui Obsidian să afișeze și să exporte imagini revizuite fără a include diagram.net, Drawnix, LaTeX sau TikZJax în timpul rulării pluginului.
Modalul de previsualizare conține, de asemenea, un panou de diagnosticare a artefactelor. Rendererele și testele de funcționare pot atașa valoarea `RenderArtifact.diagnostics`; modalul afișează o rezumată a diagnosticurilor cu numărurile de erori, avertizări și informații, urmată de gradul de severitate, tipul diagnosticului, mesajul respectiv și sfaturi pentru reparare lângă previsualizare. Aceeași rezumată este afișată și în intrările istoricului care suportă diagnosticare, astfel încât tentativele repetate de testare a circuitikz pot fi comparate fără a fi nevoie să se deschidă fiecare intrare. Pentru artefactele care au conținut sursă dar nu pot fi renderizate în mod inline sau prin calea iframe-ului HTML, modalul recurge acum la o previsualizare doar cu conținutul sursă, în loc să forceze utilizarea unui iframe gol. Acest lucru oferă un interfață vizibilă pentru teste de compilare/renderizare a circuitikz, verificările de tokeni de text SVG, verificările de captură de ecran golă PNG, rapoartele privind suprapunerea glifurilor doar pe baza calelor și viitoarele rapoarte de suprapunere, fără a face din TikZJax sau LaTeX o dependență obligatorie la timpul rulării plugin-ului sau fără a pretinde că textul sursă este o reprezentare vizuală verificată.
### Modul legacy Mermaid
@ -164,12 +170,12 @@ Acest scop nu este intenționat să fie ruta implicită a planificatorului. Este
### Draw.io și Drawnix Granițele de export
Implementarea actuală păstrează suportul editorilor de terți la granița artifactului:
Implementarea actuală menține suportul pentru editori de terți la limita artefactului, oferind în același timp ținte de renderizare explicite:
| Scop | Contract | Dependență de execuție |
|--------|----------|--------------------|
| Draw.io | `mxfile` XML dezcomprimat determinist din `SemanticFigureModel` | niciunul în timpul execuției pluginului sau în CI |
| Drawnix | subset minim de `.drawnix` JSON folosind elementele `geometry` și `arrow-line` | niciunul în timpul execuției pluginului sau în CI |
| Draw.io | XML `mxfile` determinist și decompresat generat din `SemanticFigureModel`, plus fișiere de revizuire SVG/PNG/PDF | nu există niciun element în timpul rulării pluginului sau în CI |
| Drawnix | un subconjunct minim de JSON `.drawnix` care utilizează elementele `geometry` și `arrow-line`, plus fișiere de revizuire SVG/PNG/PDF | nu există niciun element în timpul rulării pluginului sau în CI |
Compromisul este intenționat: Notemd poate verifica etichete vizibile, ID stabili și acoperirea primitivelor suportate fără a integra diagram.net Desktop, Drawnix, Plait sau starea editorului doar pentru browser în plugin.
@ -213,7 +219,11 @@ Notemd include acum primul prototip de repository restricționat pentru această
npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-inverter.tex
```
Prototipul adaugă o frontieră separată `CircuitSpec` și un exporter determinist pentru șase familii de referință aurie:
Prototipul adaugă o limită restrânsă `CircuitSpec` și un exporter determinist pentru șase familii de referință „aurie“:
În pipeline-ul experimental de diagrame, acest lucru este acum accesibil și prin `intent: "circuit"` și ținta de renderizare `circuitikz`. `DiagramSpec` generat poate include doar elemente `circuitSpec` pentru intenția circuit. `CircuitikzRenderer` scrie același sursă `.tex` determinist și atașează o fișieră de previsualizare SVG derivată din acea topologie a circuitului validată, permițând previsualizarea în Obsidian precum și exportul în SVG/PNG/PDF. Această fișieră de previsualizare nu este rezultatul unei compilații LaTeX/TikZJax; dovezile reale ale rendererului rămân în comenziile specifice de test menționate mai jos.
Pentru șabloanele „aurii“ suportate, `layoutHints.inputSide` și `layoutHints.outputSide` rămân doar controale pentru prezentare. Ele pot muta pozițiile deterministe ale porturilor de intrare/ieșire, dar nu modifică semnătura topologiei și nu permittră efectuarea unei ture de reparare pentru reconfigurarea circuitului.
| Tip circuit | Referință aurie | Garanție de curent |
|--------------|------------------|-------------------|
@ -224,7 +234,7 @@ Prototipul adaugă o frontieră separată `CircuitSpec` și un exporter determin
| `cmos-nand2` | `cmos-nand2-v1` | validează tracțiunea paralelă cu PMOS, tracțiunea seri cu NMOS, intrările duble `va` / `vb` și `vout` înainte de scriere în LaTeX |
| `cmos-nor2` | `cmos-nor2-v1` | validează tracțiunea seri cu PMOS, tracțiunea paralelă cu NMOS, intrările duble `va` / `vb` și `vout` înainte de scriere în LaTeX |
Acesta nu este încă un generator general TikZ. Nu compilează LaTeX, nu apelează TikZJax, nu inspectează ecranele de captură și nu rulează reparări automate prin feedback de imagine. Aceste funcții rămân pentru etape ulterioare.
Acesta nu este un generator general TikZ. Acesta nu acceptă cod TikZ arbitrar, nu compilează LaTeX, nu apelează TikZJax, nu inspectează ecranele în timpul rulării pluginului și nu execută reparări automate pe baza feedback-urilor de imagine. Aceste funcții rămân etape ulterioare.
Comanda Diagrama de previsualizare poate redeschide direct artefactele sărate circuitikz atunci când extensia fișierului este `.tex` sau `.tikz` și sursa conține `\usepackage{circuitikz}` sau `\begin{circuitikz}`. Această rută este o previsualizare doar a sursei circuitikz: modalul afișează sursa, diagnosticele, controalele de copiere/sărit și metadatele istoricului, dar nu compilează LaTeX sau nu apelează TikZJax în timpul execuției pluginului.
@ -350,8 +360,8 @@ Pentru un inversor CMOS, instrucțiunea ar trebui să solicite o topologie expli
|------|----------------|-----------|
| Diagrame generale | Pipeline bazat pe specificații implementat pentru Mermaid, JSON Canvas, Vega-Lite, HTML | Continuă extinderea acoperirii de verificare semantică |
| Figuri editabile | Granițele artefactelor `editable-html-svg`, Draw.io XML și Drawnix JSON implementate | Adaugă primitive mai complexe doar după ce testele dovedesc editabilitatea |
| Suport CLI | `npm run diagram:export-artifact` exportează fișiere editabile HTML/SVG, Draw.io și Drawnix dintr-un singur `DiagramSpec` | Adaugă componente de fum specificate pentru ținte atunci când se livrează noi ținte |
| circuitikz | `CircuitSpec -> circuitikz` prototipul exportează surse comune, inversor CMOS, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1` și `cmos-nor2` / `cmos-nor2-v1` template-uri goldene, proiectele `layoutHints.inputSide` și `layoutHints.outputSide` într-o plasare deterministică a porturilor de intrare/ieșire fără a schimba topologia, respinge derivația topologică prin `--topology-reference`, emite briefuri de reparare care păstrează topologia prin `--repair-brief-output` și schema `notemd.circuitikz.repair-brief.v1`, include conținut structurat de transfer `repairPrompt` cu `diagnosticFocus`, `acceptanceCriteria` și rolul `topology-preserving-circuitikz-repair`, validează candidații la reparare prin `--repair-brief`, returnează dovezi de poartă `repairAcceptance` prin schema `notemd.circuitikz.repair-acceptance.v1` cu `readyForVisualAcceptance` și `remainingChecks`, păstrează acele dovezi prin `--repair-acceptance-output`, parsează jurnalele de compilare, poate rula rendereri locale explicite plus `--expected-artifact`, SVG `--expected-svg-text`, verificări de metadate de accesibilitate prin `aria-label`, `<title>` și `<desc>`, exclusiunea elementelor SVG ascunse/transparente, clasificarea `render-svg-text-path-only` / `pathOnlyGlyphUseCount` pentru etichete doar cu cale, verificări de plasare a glyph-urilor doar cu cale pentru `<use href="#...">`, diagnostice de suprapunere a glyph-urilor doar cu cale prin `render-svg-path-glyph-overlap`, gestionarea punctului curent al căilor închise pentru `Z/z`, limite exacte ale arcelor A/a la extremități, limite exacte ale curbelor Bezier pentru extremitățile curbelor C/S/Q/T, verificări de suprapunere a etichet cu limite conștiente de lățimea traseului și SVG, verificări de geometrie de desen `polyline` / `polygon`, geometria etichetelor poziționate `tspan`, geometria textului poziționat conștientă de `text-anchor`, geometrie conștientă de transformare pentru SVG bounded-canvas/text-overlap și fumul etichetă-versus-desen prin `render-svg-label-overlap`, precum și verificări de screenshot PNG nonblank / clipped / dense-foreground, inclusiv alfa din paleta de culori indexate, eșantioane transparente grayscale/RGB tRNS și ghiduri specifice formatului `render-png-unsupported` pentru PNG-uri interlaced Adam7 și eșecuri de adâncime de biți indexată, prin `foregroundBounds`, `foregroundDensity`, `render-png-content-clipped` și `render-png-foreground-dense` fără parsare în shell, include componente de fum aggregate pentru administratori prin `npm run diagram:smoke-circuitikz`, înregistrează configurația rendererului lipsă prin `rendererAvailability.status: "missing-configuration"` și `compile-executable-invalid`, și are diagnostice generice de previsualizare, numere de sumar diagnostic, intrări de istoric conștiente de diagnostice și fallback doar din sursă prin `RenderArtifact.diagnostics` și modalul de previsualizare | Adaugă recunoaștere a etichet la nivel OCR pentru textul vizual doar cu cale, verificări precise de suprapunere la nivel de pixel, acoperire mai largă a căilor SVG unde este necesar, instalare/discoverie automată a rendererului doar dacă poate rămâne opțională, și executare automată a reparărilor care păstrează topologia |
| Suport CLI | `npm run diagram:export-artifact` exportă evidențe editabile în HTML/SVG, Draw.io, Drawnix, Circuitikz, precum și fișiere SVG/PNG/PDF pentru revizuire, dintr-un `DiagramSpec` validat | Adaugă fixture-uri specifice țintelor atunci când sunt lansate noi ținte |
| circuitikz | `DiagramSpec(intent: "circuit", circuitSpec) -> CircuitikzRenderer -> circuitikz` exportă șabloane gold standard pentru surse comune, invertatoare CMOS, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1` și `cmos-nor2` / `cmos-nor2-v1`, afișează opțiunile de intent/UI și de țintă de renderizare, scrie fișiere TeX împreună cu vizualizări preliminare în SVG/PNG/PDF, validează topologia înainte de generare, parsează jurnalele de compilare, poate rula rendereri locali expliciti plus parametrul `--expected-artifact`, și păstrează o variantă doar cu sursă, precum și diagnostice de vizualizare prin `RenderArtifact.diagnostics` și modalul de previsualizare | Adaugarea recunoașterii etichet la nivel OCR pentru textul vizual format doar din trasee, verificări precise de suprapunere la nivel de pixel, o acoperire mai largă a traseelor SVG atunci când este necesar, instalarea/descoperirea automată a rendererilor doar dacă acestea pot rămâne opționale, și executarea automată a reparărilor care păstrează topologia |
| Integrare TikZJax | Host de renderizare pentru afișarea de pe partea Obsidian | Păstrați-l opțional; nu faceți din TikZJax o dependență obligatorie la timpul rulării plugin-ului |
## Configurație
@ -361,6 +371,7 @@ Pentru un inversor CMOS, instrucțiunea ar trebui să solicite o topologie expli
| `enableExperimentalDiagramPipeline` | `false` | Schimb între modul spec-first și legacy Mermaid |
| `experimentalDiagramCompatibilityMode` | `'legacy-mermaid'` | `'legacy-mermaid'` = Mermaid doar; `'best-fit'` = ținte native + fallback-uri |
| `preferredDiagramIntent` | `undefined` (auto) | Suprascrie detectarea automată a intenției |
| `preferredDiagramRenderTarget` | `undefined` (auto) | Suprascrierea rendererului de artefacte, inclusiv Draw.io, Drawnix și Circuitikz |
| `summarizeToMermaidLanguage` | `'en'` | Limbajul țintei pentru etichetele diagramelor |
| `summarizeToMermaidProvider` / `Model` | DeepSeek | LLM per sarcină pentru generarea diagramelor |
| `autoMermaidFixAfterGenerate` | (din constante) | Rulare automată a fixerului legacy pe rezultatul Mermaid |
@ -380,10 +391,11 @@ Când este activat, Notemd extrage fragmente de context relevant din baza de cun
| Acțiune | Metodă |
|--------|--------|
| SVG export | Constructor `mermaid.render()` / `vega.View.toSVG()` / SVG pentru Canvas |
| Export în PNG | SVG → Image → Canvas (ratio de pixeli a dispozitivului 1x-3x) → PNG ArrayBuffer |
| Export în PNG | SVG → Imagine → Canvas / rasterizer de previsualizare la PPI configurat → ArrayBuffer PNG |
| Export în PDF | SVG → imagine rasterizată la PPI configurat → PDF pe o singură pagină |
| Salvare a sursării | Conținutul brut al artefactului este salvat cu extensia specifică țintei |
| Prévisualizare doar a sursării | Artefactele care nu sunt inline sunt afișate ca cod împreună cu diagnostice, fără renderizare în iframe |
| Audit semantic | Mermaid, JSON Canvas, Vega-Lite, și HTML/SVG editabil verificat de `scripts/diagram-semantic-verification.js` |
| Audit semantic | Mermaid, JSON Canvas, Vega-Lite, HTML/SVG editabile, Draw.io, Drawnix și circuitikz cu restricții sunt verificate de `scripts/diagram-semantic-verification.js` plus teste pentru renderer/CLI |
**Caching**: RenderCache folosește cheia deterministică JSON a `{spec, target, theme}`. Deduplarea în timp real previne afișările duplicate.

View file

@ -1,7 +1,7 @@
---
id: diagrams
title: "Диаграммы"
description: "Генерация Mermaid, JSON Canvas, Vega-Lite, HTML, редактируемых графических объектов, а также будущих ограниченных circuitikz диаграмм на основе ваших заметок с использованием архитектуры, ориентированной на спецификации"
description: "Генерирует диаграммы Mermaid, JSON Canvas, Vega-Lite, HTML, редактируемые файлы с изображениями фигур, Draw.io, Drawnix и ограниченные диаграммы circuitikz на основе ваших заметок с использованием архитектуры, ориентированной на спецификации"
author:
'@id': 'https://jacobinwwey.github.io/obsidian-NotEMD/#person-jacobinwwey'
keywords: [diagrams, mermaid, vega-lite, canvas, visualization, spec-first, drawio, drawnix, editable svg, circuitikz, TikZJax]
@ -18,7 +18,7 @@ import TLDR from '@site/src/components/TLDR';
# Диаграммы
<TLDR>
**Notemd генерирует диаграммы из ваших заметок посредством конвейера, ориентированного на спецификации.** LLM создает независимый от рендерера `DiagramSpec` JSON, после чего специальные адаптеры преобразуют его в Mermaid, JSON Canvas, Vega-Lite, HTML или редактируемый вывод HTML/SVG. Поддерживаются 8 типов намерений, автоматические цепочки фолбэка, прямой просмотр с экспортом в SVG/PNG, семантическая проверка и генерация с усилением локальных знаний.
**Notemd генерирует диаграммы из ваших заметок посредством конвейера, ориентированного на спецификации.** Язык больших моделей создает JSON-файл `DiagramSpec`, не зависящий от конкретного рендерера, после чего специальные адаптеры преобразуют его в форматы Mermaid, JSON Canvas, Vega-Lite, HTML, редактируемый HTML/SVG, Draw.io, Drawnix или ограниченные диаграммы circuitikz. Поддерживается 9 типов намерений, автоматические цепочки фолбэка, прямой просмотр с возможностью экспорта в форматах SVG/PNG/PDF, семантическая проверка и генерация с усилением локальных знаний.
</TLDR>
Это часть [Obsidian Руководства по управлению знаниями с ИИ](/docs/pillar-ai-knowledge).
@ -54,6 +54,7 @@ graph LR
| `stateDiagram` | Mermaid | HTML | Машины состояний, модели жизненного цикла |
| `canvasMap` | JSON Canvas | Mermaid → HTML | Карты концептов, графы знаний |
| `dataChart` | Vega-Lite | Mermaid → HTML | Столбчатые, линейные, площадные, разбросные, круговые диаграммы, таблицы |
| `circuit` | circuitikz | none | Ограниченные диаграммы цепей на основе проверенных данных `CircuitSpec` |
## Обнаружение намерений
@ -67,6 +68,7 @@ Notemd определяет наилучший тип диаграммы на о
| `stateDiagram` | Состояние, переход, в ожидании, выполняется, не удалось (3+ совпадения) | 0.76 |
| `flowchart` | Нумерованные шаги (2+) или лексика if/then/else/workflow | 0.74 |
| `canvasMap` | Карта концептов, граф знаний, пространственные данные, кластеры | 0.72 |
| `circuit` | circuitikz, TikZJax, circuit, schematic, CMOS, NMOS, PMOS, MOSFET, VDD/GND, `vin`/`vout` | 0.78 |
| `mindmap` | Значение по умолчанию | 0.55 |
Переопределите его с помощью настройки **Тип диаграммы по умолчанию**, выбора в боковой панели или явного опция палитры команд.
@ -80,10 +82,9 @@ Notemd определяет наилучший тип диаграммы на о
| Тип диаграммы по умолчанию | `preferredDiagramIntent` | Определяет семантическую форму генерируемого `DiagramSpec` |
| Цель отрисовки по умолчанию | `preferredDiagramRenderTarget` | Выбирает инструмент отрисовки для операций **Сгенерировать диаграмму** и **Предварительный просмотр диаграммы** |
Установите **Цель отрисовки по умолчанию** в значение **Автоматически** для значения по умолчанию планировщика, или явно выберите Mermaid, JSON Canvas, Vega-Lite, HTML или редактируемый HTML/SVG. Это переопределение применяется только к командам создания артефактов и предварительного просмотра. Стандартная команда **Суммировать в диаграмму Mermaid** остается привязана к выводу, совместимому с Mermaid, чтобы существующие рабочие процессы в Markdown не меняли формат незаметно.
Это разделение важно, потому что намерение `flowchart` теперь может быть отрисовано в виде Mermaid для заметок в Markdown, HTML в качестве надежного запасного варианта или в редактируемом виде HTML/SVG для дальнейшей обработки. Draw.io и Drawnix остаются экспортерами артефактов в формате CLI, а не целями отрисовки внутри плагина.
Установите **Preferred render target** в значение **Auto**, чтобы использовать стандартное поведение планировщика, или явно выберите Mermaid, JSON Canvas, Vega-Lite, HTML, Editable HTML/SVG, Draw.io, Drawnix или Circuitikz. Это изменение применяется только к командам создания файлов и просмотра. Стандартная команда **Summarise as Mermaid diagram** по-прежнему генерирует вывод, совместимый с Mermaid, чтобы существующие рабочие процессы в Markdown не меняли формат без вашего ведома.
Такое разделение имеет важное значение, поскольку намерение `flowchart` теперь может отображаться в виде Mermaid для заметок в Markdown, в виде HTML для надежного фолбэка, в виде редактируемого HTML/SVG для дальнейшей правки или в виде исходных файлов Draw.io/Drawnix с сопутствующими изображениями SVG для проверки. Намерение `circuit` направляет работу на Circuitikz и требует проверенного файла `CircuitSpec`; это не запрос на произвольный текст в формате TikZ.
## Использование
### Сгенерировать диаграмму
@ -101,16 +102,21 @@ Notemd определяет наилучший тип диаграммы на о
| Vega-Lite | `.json` | `{note}_diagram.json` |
| HTML | `.html` | `{note}_diagram.html` |
| Редактируемо HTML/SVG | `.html` | `{note}_diagram.html` |
| Draw.io | `.drawio` + `.drawio.svg` + `.drawio.md` | `{note}_diagram.drawio` вместе с сопутствующими файлами для проверки |
| Drawnix | `.drawnix` + `.drawnix.svg` + `.drawnix.md` | `{note}_diagram.drawnix` вместе с сопутствующими файлами для проверки |
| Circuitikz | `.tex` + `.tex.svg` + `.tex.md` | `{note}_diagram.tex` вместе с сопутствующими файлами для проверки |
### Просмотр диаграммы
1. Запустить **"Notemd: Просмотр диаграммы"**
2. Открывается модальное окно с отрендеренной диаграммой
3. Экспортировать в SVG или PNG с помощью кнопок панели инструментов
3. Экспортируйте файлы в форматах SVG, PNG или PDF с помощью кнопок на панели инструментов
Опция **Автозапуск просмотра** доступна в настройках — после генерации модальное окно просмотра открывается автоматически.
В модальном окне просмотра также есть панель диагностики артефактов. Рендереры и проверки типа smoke могут добавлять `RenderArtifact.diagnostics`; в окне отображается краткое резюме с количеством ошибок/предупреждений/информаций, затем степень серьезности, тип диагностики, сообщение и советы по устранению рядом с просмотром. То же резюме показывается в записях истории просмотров, так что повторные попытки smoke типа circuitikz можно сравнивать без необходимости открывать каждую запись. Для артефактов, у которых есть исходный контент, но который нельзя отрендерить встроенно или через путь iframe HTML, теперь модальное окно переходит к просмотру только исходного кода вместо того, чтобы заставлять использовать пустой iframe. Это позволяет выполнять проверки компиляции/рендеринга типа circuitikz, проверки текстовых токенов SVG, проверки пустого скриншота в формате PNG и будущие отчеты о перекрытии предоставлять видимую информацию UI без необходимости делать TikZJax или LaTeX обязательной зависимостью во время выполнения плагина или притворяться, что исходный текст является проверенным визуальным отображением.
При экспорте просмотра в форматах PNG и PDF используется настроенное значение PPI для просмотра. По умолчанию оно равно 300 PPI, а значения выше 600 PPI ограничиваются значением 600. Формат SVG сохраняет векторную структуру. Исходные файлы, такие как `.drawio`, `.drawnix` и `.tex`, могут содержать сопутствующий файл `previewSvg`, что позволяет Obsidian отображать и экспортировать изображения для проверки без встраивания ресурсов из circuitikz.net, Drawnix, LaTeX или TikZJax во время работы плагина.
В модальном окне предварительного просмотра также имеется панель диагностики ошибок. Инструменты генерации изображений и тесты на корректность могут добавлять данные `RenderArtifact.diagnostics`; в этом окне отображается краткое резюме диагностики с количеством ошибок, предупреждений и сообщений о статусе, а затем — уровень серьезности, тип диагноза, само сообщение и рекомендации по устранению проблемы рядом с изображением предварительного просмотра. То же самое резюме отображается и в записях истории, поддерживающих диагностику, поэтому можно сравнивать несколько попыток выполнения тестов circuitikz без необходимости открывать каждую запись отдельно. Для объектов, у которых имеется исходный текст, но которые невозможно отобразить встроенно или через путь HTML iframe, теперь модальное окно использует предварительный просмотр только с исходным текстом вместо попытки использовать пустой iframe. Это обеспечивает видимый интерфейс для тестов компиляции/генерации circuitikz, проверок текстовых токенов SVG, проверок пустого скриншота в формате PNG, отчетов о перекрытии глифов, основанных только на путях, а также будущих отчетов об перекрытии, не делая TikZJax или LaTeX обязательной зависимостью во время выполнения плагина и не притворяясь, что исходный текст уже является проверенным визуальным изображением.
### Режим устаревшего Mermaid
@ -164,12 +170,12 @@ Notemd определяет наилучший тип диаграммы на о
### Границы экспорта Draw.io и Drawnix
В текущей реализации поддержка сторонних редакторов ограничивается границей артефакта:
Текущая реализация сохраняет поддержку сторонних редакторов на границе результатов обработки, в то же время предоставляя явные цели отрисовки:
| Цель | Контракт | Зависимость во время выполнения |
|--------|----------|--------------------|
| Draw.io | детерминированный несжатый `mxfile` XML от `SemanticFigureModel` | ничего во время работы плагина или в CI |
| Drawnix | минимальный набор `.drawnix` JSON с использованием элементов `geometry` и `arrow-line` | ничего во время работы плагина или в CI |
| Draw.io | детерминированный распакованный XML-файл формата `mxfile`, полученный из `SemanticFigureModel`, плюс файлы для просмотра в форматах SVG/PNG/PDF | ничего во время работы плагина или в процессе CI |
| Drawnix | минимальный набор JSON-данных в формате `.drawnix`, использующий элементы `geometry` и `arrow-line`, плюс файлы для просмотра в форматах SVG/PNG/PDF | ничего во время работы плагина или в процессе CI |
Этот компромисс сделан намеренно: Notemd может проверять видимые метки, стабильные ID и поддерживаемую охватность примитивов, не встраивая Diagrams.net Desktop, Drawnix, Plait или состояние редактора только для браузера в плагин.
@ -213,7 +219,11 @@ Notemd теперь включает первый ограниченный пр
npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-inverter.tex
```
Прототип добавляет отдельную границу `CircuitSpec` и детерминистичный экспортер для шести семейств золотых эталонов:
Прототип добавляет ограниченные границы типа `CircuitSpec` и детерминированный экспортер для шести стандартных семейств схем:
В экспериментальной системе обработки диаграмм это теперь также доступно через параметр `intent: "circuit"` и цель отрисовки `circuitikz`. Генерируемый файл `DiagramSpec` может включать объект `circuitSpec` только при намерении создания схемы. `CircuitikzRenderer` записывает тот же детерминированный исходный код в формате `.tex` и добавляет файл превью в формате SVG, полученный на основе проверенной топологии схемы, что позволяет использовать превью в Obsidian, а также экспортировать изображения в форматах SVG/PNG/PDF. Этот файл превью не является результатом компиляции на LaTeX/TikZJax; реальные данные от рендерера по-прежнему содержатся в указанных ниже специальных командах проверки.
Для поддерживаемых стандартных шаблонов параметры `layoutHints.inputSide` и `layoutHints.outputSide` остаются контроллерами, предназначенными исключительно для отображения. Они могут изменять местоположение входных/выходных портов на детерминированной основе, но не влияют на сигнатуру топологии и не позволяют выполнять операцию коррекции для переподключения элементов схемы.
| Тип схемы | Золотой эталон | Гарантия тока |
|--------------|------------------|-------------------|
@ -224,7 +234,7 @@ npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-in
| `cmos-nand2` | `cmos-nand2-v1` | проверяет параллельный подъемный PMOS, последовательный опускающий NMOS, двойные входы `va` / `vb` и `vout` перед записью LaTeX |
| `cmos-nor2` | `cmos-nor2-v1` | проверяет последовательный подъемный PMOS, параллельный опускающий NMOS, двойные входы `va` / `vb` и `vout` перед записью LaTeX |
Это пока не универсальный генератор TikZ. Он не компилирует LaTeX, не вызывает TikZJax, не анализирует скриншоты и не выполняет автоматическую коррекцию изображений. Эти функции остаются в будущих версиях.
Это не универсальный генератор кода TikZ. Он не принимает произвольные файлы TikZ, не компилирует LaTeX, не вызывает TikZJax, не анализирует скриншоты во время работы плагина и не выполняет автоматическую коррекцию изображений на основе обратной связи. Все эти функции реализуются на более поздних этапах.
Команда Preview diagram может снова открыть сохраненные исходные файлы circuitikz напрямую, если их расширение — `.tex` или `.tikz`, а в коде присутствуют `\usepackage{circuitikz}` или `\begin{circuitikz}`. Этот режим — предварительный просмотр только исходного кода: модальное окно показывает код, диагностику, контроллеры копирования/сохранения и метаданные истории, но не компилирует LaTeX и не вызывает TikZJax во время работы плагина.
@ -350,8 +360,8 @@ npm run diagram:smoke-circuitikz -- --output-dir docs/export/circuitikz-smoke --
|------|----------------|-----------|
| Общие схемы | Реализована схема работы, ориентированная на спецификации, для Mermaid, JSON Canvas, Vega-Lite, HTML | Продолжаем расширять охват семантической проверки |
| Редактируемые графики | Реализованы границы объектов `editable-html-svg`, Draw.io XML и Drawnix JSON | Добавляйте более сложные примитивы только после того, как тесты подтвердят возможность редактирования |
| Поддержка CLI | `npm run diagram:export-artifact` экспортирует редактируемые файлы HTML/SVG, Draw.io и Drawnix из одного `DiagramSpec` | Добавление специфичных для целей устройств дымового эффекта при поставке новых целей |
| circuitikz | `CircuitSpec -> circuitikz` прототип экспортирует общие источники, инвертор CMOS, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1`, а также `cmos-nor2` / `cmos-nor2-v1` золотые шаблоны, проекты `layoutHints.inputSide` и `layoutHints.outputSide` с определённым размещением входных/выходных портов без изменения топологии, отклоняет изменения топологии при ремонте с помощью `--topology-reference`, генерирует инструкции по ремонту с сохранением топологии через `--repair-brief-output` и схему `notemd.circuitikz.repair-brief.v1`, включает структурированный контент передачи `repairPrompt` с `diagnosticFocus`, `acceptanceCriteria` и ролью `topology-preserving-circuitikz-repair`, проверяет кандидаты на ремонт через `--repair-brief`, возвращает доказательства работы `repairAcceptance` через схему `notemd.circuitikz.repair-acceptance.v1` с `readyForVisualAcceptance` и `remainingChecks`, сохраняет эти доказательства через `--repair-acceptance-output`, парсит логи компиляции, может запускать явные локальные рендереры плюс `--expected-artifact`, SVG `--expected-svg-text`, проверки метаданных доступности через `aria-label`, `<title>` и `<desc>`, исключение скрытых/прозрачных элементов SVG, классификация `render-svg-text-path-only` / `pathOnlyGlyphUseCount` для меток только с путём, проверки размещения глифов только с путём для `<use href="#...">`, диагностика перекрытия глифов только с путём через `render-svg-path-glyph-overlap`, обработка точки тока при закрытом пути для `Z/z`, точные границы дуги для крайних точек дуги A/a, точные границы кривых Bezier для крайних точек кривых C/S/Q/T, проверки границ с учётом толщины линии SVG и перекрытия меток, проверки геометрии рисования `polyline` / `polygon`, геометрия расположенных меток `tspan`, геометрия текста с учётом `text-anchor`, геометрия с учётом преобразований для SVG ограниченной канваса/перекрытия текста и дымового эффекта меток и рисунка через `render-svg-label-overlap`, а также проверки скриншотов PNG без пустоты/обрезки/плотного фона, включая альфа-канал индексированной палитры цветов, прозрачные образцы в сером/RGB режиме tRNS и руководства `render-png-unsupported` для интерлейсированных PNG Adam7 и ошибок индексированной глубины битов через `foregroundBounds`, `foregroundDensity`, `render-png-content-clipped` и `render-png-foreground-dense` без парсинга оболочки, включает агрегированные устройства дымового эффекта для поддержания, записывает отсутствующую конфигурацию рендерера через `rendererAvailability.status: "missing-configuration"` и `compile-executable-invalid`, а также имеет универсальные диагностики превью, подсчёты краткого обзора диагностик, записи истории с учётом диагностик и резервный вариант только из исходного кода через `RenderArtifact.diagnostics` и модальное окно превью | Добавление распознавания меток на уровне OCR для визуального текста только с путём, точные проверки перекрытия на уровне пикселей, более широкое покрытие путей SVG там, где это необходимо, автоматическая установка/обнаружение рендерера только если он может оставаться факультативным, и автоматизированная реализация ремонта с сохранением топологии |
| Поддержка CLI | Команда `npm run diagram:export-artifact` экспортирует редактируемые файлы HTML/SVG, а также данные из Draw.io, Drawnix, Circuitikz и форматов SVG/PNG/PDF в качестве доказательств для проверки, при этом используется один верифицированный файл `DiagramSpec` | При выпуске новых целей добавляются специфичные тесты на корректность работы |
| circuitikz | `DiagramSpec(intent: "circuit", circuitSpec) -> CircuitikzRenderer -> circuitikz` экспортирует золотые шаблоны для схем с общим источником питания, инверторов CMOS, компонентов `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1` и `cmos-nor2` / `cmos-nor2-v1`; предоставляет опции для указания намерения интерфейса и цели отрисовки; генерирует файлы на языке TeX вместе с превью-версиями в форматах SVG/PNG/PDF; проверяет топологию перед выводом; анализирует логи компиляции; позволяет запускать специфические локальные рендереры с использованием флага `--expected-artifact`; обеспечивает работу в режиме только исходного кода в качестве запасного варианта, а также отображение диагностической информации превью через объект `RenderArtifact.diagnostics` и модальное окно превью | Добавление функции распознавания меток на уровне OCR для текста, отображаемого только в виде линий, более точных проверок перекрытия на уровне пикселей, расширенной поддержки SVG-линий там, где это необходимо, автоматической установки/обнаружения рендереров только в том случае, если они могут оставаться факультативными, а также автоматизированной коррекции структуры схемы с сохранением её первоначального вида |
| Интеграция TikZJax | Кандидат на хост рендеринга для отображения с стороны Obsidian | Сохранить его как факультативный; не делать TikZJax обязательной зависимостью времени выполнения плагина |
## Конфигурация
@ -361,6 +371,7 @@ npm run diagram:smoke-circuitikz -- --output-dir docs/export/circuitikz-smoke --
| `enableExperimentalDiagramPipeline` | `false` | Переключение между подходом, основанным на спецификации, и устаревшим вариантом Mermaid |
| `experimentalDiagramCompatibilityMode` | `'legacy-mermaid'` | `'legacy-mermaid'` = Mermaid только; `'best-fit'` = нативные цели + резервы |
| `preferredDiagramIntent` | `undefined` (автоматически) | Переопределение автоматического обнаружения намерения |
| `preferredDiagramRenderTarget` | `undefined` (автоматически) | Замена рендерера артефактов, включая Draw.io, Drawnix и Circuitikz |
| `summarizeToMermaidLanguage` | `'en'` | Язык цели для меток диаграмм |
| `summarizeToMermaidProvider` / `Model` | DeepSeek | LLM на каждой задаче для генерации диаграмм |
| `autoMermaidFixAfterGenerate` | (из констант) | Автоматический запуск устаревшего исправителя на выводе Mermaid |
@ -380,10 +391,11 @@ npm run diagram:smoke-circuitikz -- --output-dir docs/export/circuitikz-smoke --
| Действие | Метод |
|--------|--------|
| Экспорт SVG | Создатель `mermaid.render()` / `vega.View.toSVG()` / SVG для Canvas |
| Экспорт в PNG | SVG → Изображение → Canvas (коэффициент пикселей устройства 1x-3x) → PNG ArrayBuffer |
| Экспорт в PNG | SVG → Изображение → Canvas / растровый рендерер с заданным количеством точек на дюйм → массив байтов PNG |
| Экспорт в PDF | SVG → растровое изображение с заданным количеством точек на дюйм → одностраничный PDF |
| Сохранение исходника | Контент сырого артефакта сохраняется с расширением, специфичным для цели |
| Предварительный просмотр только исходника | Нелинейные артефакты с содержимым исходника отображаются в виде кода вместе с диагностикой, без отрисовки iframe |
| Семантический аудит | Mermaid, JSON Canvas, Vega-Lite, и редактируемый HTML/SVG проверяется `scripts/diagram-semantic-verification.js` |
| Семантический аудит | Проверка Mermaid, JSON Canvas, Vega-Lite, редактируемого HTML/SVG, Draw.io, Drawnix и ограниченного использования Circuitikz с помощью файла `scripts/diagram-semantic-verification.js` вместе с тестами рендерера и CLI |
**Кэширование**: RenderCache использует детерминированный ключ JSON от `{spec, target, theme}`. Удаление дубликатов во время обработки предотвращает повторные генерации.

View file

@ -1,7 +1,7 @@
---
id: diagrams
title: "Diagram"
description: "Generera Mermaid, JSON Canvas, Vega-Lite, HTML, redigerbara figurartefakter samt framtida begränsade circuitikz-diagram från dina anteckningar med hjälp av en specifikationsfokuserad arkitektur"
description: "Generera Mermaid, JSON Canvas, Vega-Lite, HTML, redigerbara figurartefakter, Draw.io, Drawnix samt begränsade circuitikz-diagram från dina anteckningar med hjälp av en arkitektur som prioriterar specifikationerna."
author:
'@id': 'https://jacobinwwey.github.io/obsidian-NotEMD/#person-jacobinwwey'
keywords: [diagrams, mermaid, vega-lite, canvas, visualization, spec-first, drawio, drawnix, editable svg, circuitikz, TikZJax]
@ -18,7 +18,7 @@ import TLDR from '@site/src/components/TLDR';
# Diagram
<TLDR>
**Notemd genererar diagram från dina anteckningar genom en spec-first-pipeline.** LLM skapar en renderer-agnostic `DiagramSpec` JSON, vilket sedan översätts till Mermaid, JSON Canvas, Vega-Lite, HTML eller redigerbar HTML/SVG-utdata av specialiserade adapter. Stöder 8 typ av avsikter, automatiserade fallback-kedjor, live-preview med export till SVG/PNG, semantisk verifiering samt generering förbättrad med lokalt kunskap.
**Notemd genererar diagram från dina anteckningar genom en pipeline som prioriterar specifikationerna.** LLM:n skapar ett renderer-otillhörigt `DiagramSpec`-JSON, vilket sedan översätts av specialiserade adapter till Mermaid, JSON Canvas, Vega-Lite, HTML, redigerbar HTML/SVG, Draw.io, Drawnix eller begränsade circuitikz-output. Stöds 9 olika syftetyper, automatiska fallback-kedjor, live-preview med export till SVG/PNG/PDF, semantisk verifiering samt generering förbättrad med lokalt känt information.
</TLDR>
Detta ingår i [Obsidian AI Knowledge Management Guide](/docs/pillar-ai-knowledge).
@ -54,6 +54,7 @@ graph LR
| `stateDiagram` | Mermaid | HTML | Statemaskiner, livscykelmodeller |
| `canvasMap` | JSON Canvas | Mermaid → HTML | Konceptkartor, kunskapsgrapher |
| `dataChart` | Vega-Lite | Mermaid → HTML | Stavar, linjer, areor, spridning, pizza, tabeller |
| `circuit` | circuitikz | inget | Begränsade circuitdiagram från validerade `CircuitSpec`-data |
## Avsiktsdetektering
@ -67,6 +68,7 @@ Notemd införder den bästa diagramtypen utifrån innehållet i din anteckning m
| `stateDiagram` | Stadium, övergång, väntande, i kö, misslyckat (3+ matchningar) | 0.76 |
| `flowchart` | Numrerade steg (2+) eller if/then/else/workflow-vokabulär | 0.74 |
| `canvasMap` | Konceptkarta, kunskapsgraph, rumslig, kluster | 0.72 |
| `circuit` | circuitikz, TikZJax, circuit, schematic, CMOS, NMOS, PMOS, MOSFET, VDD/GND, `vin`/`vout` | 0.78 |
| `mindmap` | Standardåtergång | 0.55 |
Överskriv med inställningen **Förväntad diagramtyp**, sidofältsselaren eller en explicit kommandopanelval.
@ -80,10 +82,9 @@ Den experimentella spec-first-pipelinesystemet har nu två oberoende kontroller:
| Förväntad diagramtyp | `preferredDiagramIntent` | Styr den semantiska formen av den genererade `DiagramSpec` |
| Förväntat rendermål | `preferredDiagramRenderTarget` | Väljer artefaktrenderaren för **Generera diagram** och **Förhandsvisning av diagram** |
Ställ **Förväntat rendermål** in på **Auto** som standard för planeraren, eller välj explicit Mermaid, JSON Canvas, Vega-Lite, HTML eller Editable HTML/SVG. Överskrivningen gäller endast artefakt- och förhandsvisningskommandon. Standardkommandot **Sammanfatta som Mermaid diagram** förblir fäst vid Mermaid-kompatibelt utdata så att befintliga Markdown-arbetsflöden inte tyst byter format.
Denna separation är viktig eftersom en `flowchart`-intention nu kan renderas som Mermaid för Markdown-noter, HTML som robust återgång, eller Editable HTML/SVG för efterföljande redigering. Draw.io och Drawnix förblir CLI-artefaktexporterare istället för rendermål inom pluginet.
Ställ in **Preferred render target** på **Auto** för planeringsstandarden, eller välj explicit Mermaid, JSON Canvas, Vega-Lite, HTML, Editable HTML/SVG, Draw.io, Drawnix eller Circuitikz. Överställningen gäller endast kommandon för artefakter och preview. Standardkommandot **Summarise as Mermaid diagram** förblir anpassat till Mermaid-kompatibelt output så att befintliga Markdown-arbetsflöden inte omedvetet byter format.
Denna separation är viktig eftersom ett `flowchart`-syfte nu kan renderas som Mermaid för Markdown-anteckningar, som HTML för en robust fallback, som redigerbar HTML/SVG för vidare redigering, eller som Draw.io/Drawnix-källartefakter med SVG-revisionsfiler. Ett `circuit`-syfte dirigeras till Circuitikz och kräver ett validerat `CircuitSpec`; det är inte en begäran om vilken TikZ-text som helst.
## Användning
### Generera ett diagram
@ -101,16 +102,21 @@ Denna separation är viktig eftersom en `flowchart`-intention nu kan renderas so
| Vega-Lite | `.json` | `{note}_diagram.json` |
| HTML | `.html` | `{note}_diagram.html` |
| Redigerbar HTML/SVG | `.html` | `{note}_diagram.html` |
| Draw.io | `.drawio` + `.drawio.svg` + `.drawio.md` | `{note}_diagram.drawio` tillsammans med revisionsfiler |
| Drawnix | `.drawnix` + `.drawnix.svg` + `.drawnix.md` | `{note}_diagram.drawnix` tillsammans med revisionsfiler |
| Circuitikz | `.tex` + `.tex.svg` + `.tex.md` | `{note}_diagram.tex` tillsammans med revisionsfiler |
### Visa förhandsvisning av en diagram
1. Kör **"Notemd: Preview diagram"**
2. En modalruta öppnas med den renderade diagrammet
3. Exportera som SVG eller PNG med hjälp av verktygsfältets knappar
3. Exportera som SVG, PNG eller PDF med hjälp av knapparna i verktygsfältet
**Auto-open preview** finns tillgängligt i inställningarna efter generering öppnas förhandsvisningsfönstret automatiskt.
Förhandsvisningsmodalen har också en panel för diagnostik av artefakter. Renderare och röktest kan ansluta `RenderArtifact.diagnostics`; modalen visar en sammanfattning av diagnostiken med antal fel/varningar/informationer, därefter allvarlighetsgrad, typ av diagnostik, meddelande och reparationstips bredvid förhandsvisningen. Samma sammanfattning visas i posterna i förhandsvisningshistoriken, så att upprepadra circuitikz röktest kan jämföras utan att behöva öppna varje post. För artefakter som har källinnehåll men inte kan renderas inline eller via HTML iframe-sväret faller modalen nu tillbaka till en förhandsvisning endast med källkoden istället för att tvinga en tom iframe. Detta ger circuitikz kompilerings-/renderingsröktest, SVG texttokenkontroller, PNG-blankskärmbildskontroller samt framtida överskridningsrapporter en synlig UI yta utan att göra TikZJax eller LaTeX till en strikt plugin-körningsskicklighet eller låtsas att källtexten är en verifierad visuell rendering.
Exporten av preview i formaten PNG och PDF använder den konfigurerade preview-PPI:en. Standardvärdet är 300 PPI och värden över 600 PPI begränsas till 600. SVG förblir vektorbaserat. Källartefakter som `.drawio`, `.drawnix` och `.tex` kan erbjuda en `previewSvg`-fil så att Obsidian kan visa och exportera bilder som kan reviseras, utan att embedda diagram.net, Drawnix, LaTeX eller TikZJax i plugins körning.
Förhandsvisningsmodalen har också en panel för diagnostik av artefakter. Renderare och röktest kan lägga till `RenderArtifact.diagnostics`; modalen visar en sammanfattning av diagnostiken med antal fel/varningar/informationer, därefter allvarlighetsgrad, typ av diagnostik, meddelande samt reparationstips bredvid förhandsvisningen. Samma sammanfattning visas i historiekontoinlägg som stöder diagnostik, så man kan jämföra upprepada röktest för circuitikz utan att behöva öppna varje post. För artefakter som har källinnehåll men inte kan renderas inläggssamt eller via HTML-iframe-rutan faller modalen nu tillbaka till en förhandsvisning endast med källkoden istället för att tvinga en tom iframe. Detta ger röktest för circuitikz-kompilering/rendering, kontroller av SVG-texttokener, kontroller av tomma PNG-skränskopior, rapporter om överskridanden endast baserade på vägar samt framtida överskridningsrapporter en synlig gränssnitt, utan att göra TikZJax eller LaTeX till en obligatorisk plugin-körning eller låtsas att källtexten är en verifierad visuell rendering.
### Legacy Mermaid-läge
@ -164,12 +170,12 @@ Detta mål är avsiktligt inte standardplaneringsvägen än. Det finns tillgäng
### Draw.io och Drawnix Exportgränser
Den nuvarande implementationen håller stöd för tredjepartsredigerare vid artefaktsgränsen:
Den nuvarande implementationen håller stödet för tredjepartsredigerare vid gränsen till artefakten samtidigt som den fortfarande exponerar explicita renderingsmål:
| Mål | Kontrakt | Körningssberoendighet |
|--------|----------|--------------------|
| Draw.io | deterministisk, okomprimerad `mxfile` XML från `SemanticFigureModel` | ingen i pluginkörningen eller CI |
| Drawnix | minimal `.drawnix` JSON-undermängd med `geometry` och `arrow-line`-element | ingen i pluginkörningen eller CI |
| Draw.io | deterministisk, okomprimerad `mxfile`-XML från `SemanticFigureModel`, tillsammans med SVG/PNG/PDF-granskningsfiler | inget i pluginens körning eller CI |
| Drawnix | ett minimalt JSON-undermängd av `.drawnix` som använder elementen `geometry` och `arrow-line`, tillsammans med SVG/PNG/PDF-granskningsfiler | inget i pluginens körning eller CI |
Avvägningen är avsiktlig: Notemd kan verifiera synliga etiketter, stabila ID:er och stödd primitiv täckning utan att inkludera diagrams.net Desktop, Drawnix, Plait eller endast webbläsarbaserad redigeringsstatus i pluginet.
@ -213,7 +219,11 @@ Notemd inkluderar nu den första begränsade repository-prototypen för denna ri
npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-inverter.tex
```
Prototypen lägger till en separat `CircuitSpec`-gräns samt en deterministisk exporter för sex gyllene referensfamiljer:
Prototypen lägger till en begränsad `CircuitSpec`-gräns samt en deterministisk exportator för sex guldreferensfamiljer:
I den experimentella diagrampipelinen kan detta nu också nås via `intent: "circuit"` och renderingsmålet `circuitikz`. Den genererade `DiagramSpec`-filen kan endast inbädda `circuitSpec` för circuit-intent. `CircuitikzRenderer` skriver samma deterministiska `.tex`-källkod och lägger till en SVG-previewfil som härrör från den validerade kretsktopologin, vilket möjliggör preview i Obsidian samt export till SVG/PNG/PDF. Denna previewfil är inte ett resultat av en LaTeX/TikZJax-kompilering; verkliga renderingsbevis förblir fortfarande de explicita smoke-kommandona nedan.
För de stödda guldtemplaten förblir `layoutHints.inputSide` och `layoutHints.outputSide` endast presentationella kontroller. De kan flytta den deterministiska placeringen av in-/utgångsporter, men de ändrar inte topologins signatur eller tillåter en reparationspass för att omkoppla kretsen.
| Kretstyp | Gyllen referens | Strömkompensation |
|--------------|------------------|-------------------|
@ -224,7 +234,7 @@ Prototypen lägger till en separat `CircuitSpec`-gräns samt en deterministisk e
| `cmos-nand2` | `cmos-nand2-v1` | Validerar parallell PMOS pull-up, seriell NMOS pull-down, dubbel inmatning `va` / `vb` och `vout` innan LaTeX skrivs |
| `cmos-nor2` | `cmos-nor2-v1` | Validerar seriell PMOS pull-up, parallell NMOS pull-down, dubbel inmatning `va` / `vb` och `vout` innan LaTeX skrivs |
Detta är ännu inte en allmän TikZ-generator. Den kompilerar inte LaTeX, anropar inte TikZJax, undersöker inte skärmdumpar eller kör inte automatiserad bild-feedback-reparation. Detta är fortfarande framtida funktioner.
Detta är inte en allmän TikZ-genererare. Den accepterar inte vilken TikZ-kod som helst, kompilerar inte LaTeX, anropar inte TikZJax, inspekterar inte skärmbilder under pluginens körning, och kör inte automatiserad reparering av bilder baserat på feedback. Detta är fortfarande kommandon som kommer senare.
Kommandot Preview diagram kan öppna direkt sparade circuitikz-källartefakter när filändelsen är `.tex` eller `.tikz` och källan innehåller `\usepackage{circuitikz}` eller `\begin{circuitikz}`. Denna metod är en circuitikz-källa-endast-preview: fönstret visar källan, diagnostik, kopierings/sparningskontroller och historiksmetadata, men den kompilerar inte LaTeX eller anropar inte TikZJax under plugins körning.
@ -350,8 +360,8 @@ För en CMOS-inverter bör prompten begära en explicit topologi samt layoutrest
|------|----------------|-----------|
| Allmänna diagram | Spec-first-pipeline implementerad för Mermaid, JSON Canvas, Vega-Lite, HTML | fortsätt utöka semantisk verifieringsomfattning |
| Redigerbara figurer | `editable-html-svg`, Draw.io XML, och Drawnix JSON-artefaktgränser implementerade | Lägg till mer avancerade primitiver endast efter att tester har bevisat redigerbarhet |
| CLI-stöd | `npm run diagram:export-artifact` exporterar redigerbara HTML/SVG, Draw.io, och Drawnix från ett `DiagramSpec` | Lägg till målspecifika rökinställningar när nya mål levereras |
| circuitikz | `CircuitSpec -> circuitikz` prototypexporterar gemensamma källor, CMOS-inverter, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1`, samt `cmos-nor2` / `cmos-nor2-v1` gyllene mallar, projekt `layoutHints.inputSide` och `layoutHints.outputSide` till deterministisk placering av in-/utgångsportar utan att förändra topologin, avvisar topologiförändringar genom `--topology-reference`, skickar ut topologiförvarande reparationsförslag via `--repair-brief-output` och schema `notemd.circuitikz.repair-brief.v1`, inkluderar strukturerad `repairPrompt` överlämningsinnehåll med `diagnosticFocus`, `acceptanceCriteria` och roll `topology-preserving-circuitikz-repair`, validerar reparationskandidater genom `--repair-brief`, returnerar `repairAcceptance` gränsebevis via schema `notemd.circuitikz.repair-acceptance.v1` med `readyForVisualAcceptance` och `remainingChecks`, sparar dessa bevis genom `--repair-acceptance-output`, parserar kompilationslogggar, kan köra explisita lokala renderare plus `--expected-artifact`, SVG `--expected-svg-text`, kontroller av tillgänglighetsmetadata via `aria-label`, `<title>` och `<desc>`, uteslutning av dolda/transparenta SVG element, `render-svg-text-path-only` / `pathOnlyGlyphUseCount` klassificering för endast vägsbaserade etiketter, kontroller av endast vägsbaserad glyph-placering för `<use href="#...">`, diagnostik för överlappning av endast vägsbaserade glyphar via `render-svg-path-glyph-overlap`, hantering av nulägesström för slutna vägar för `Z/z`, exakta bågargränser för A/a bågextrema, exakta Bezier-kurvigränser för C/S/Q/T kurvextrema, SVG gränser med hänsyn till strykthjuk och kontroller av etiketteröverlappning, `polyline` / `polygon` kontroller av ritgeometri, placerad `tspan` etikettgeometri, `text-anchor`-medveten placerad textgeometri, geometri med hänsyn till transformation för SVG begränsad canvas/textöverlappning och etikett-mot-ritning rökkontroller via `render-svg-label-overlap`, samt PNG-kontroller för icke-tomta/klippta/tätte framtjänster, inklusive indexerad färgpalett alfa, gråskala/RGB tRNS transparenta prover, och formatspecifik `render-png-unsupported` vägledning för Adam7 interlacerade PNG:er och indexerade bitdjupfel, via `foregroundBounds`, `foregroundDensity`, `render-png-content-clipped` och `render-png-foreground-dense` utan shell-parsing, inkluderar sammanställda underhållsinställningar via `npm run diagram:smoke-circuitikz`, registrerar saknade rendererkonfigurationer via `rendererAvailability.status: "missing-configuration"` och `compile-executable-invalid`, samt generiska förhandsvisningsdiagnostik, sammanfattning av diagnostikresultat, diagnostikmedvetna historiepostningar och fallback endast från källkoden via `RenderArtifact.diagnostics` och förhandsvisningsmodalen | Lägg till OCR-nivåsiktbarhet för endast vägsbaserad visuell text, exakta pixelnivåsöverlappningskontroller, bredare SVG väg täckning där det behövs, automatisk installering/hittande av renderer endast om det kan förbli valfritt, samt automatiserad topologiförvarande reparationsutföring |
| CLI-stöd | `npm run diagram:export-artifact` exporterar redigerbara HTML/SVG-, Draw.io-, Drawnix-, Circuitikz- och SVG/PNG/PDF-format för granskning från en validerad `DiagramSpec` | Lägg till målspecifika smoke-test-fikser när nya mål släpps |
| circuitikz | `DiagramSpec(intent: "circuit", circuitSpec) -> CircuitikzRenderer -> circuitikz` exporterar guldmallar för common-source, CMOS inverter, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1` och `cmos-nor2` / `cmos-nor2-v1`, exponerar UI-intent- och render-target-val, skriver TeX tillsammans med SVG/PNG/PDF-förhandsvisningsfiler, validerar topologin innan utskrift, parserar kompilationslogggar, kan köra explisita lokala renderer samt använda `--expected-artifact`, och behåller en fallback med endast källkod samt visar förhandsgranskningsskönläggningar via `RenderArtifact.diagnostics` och förhandsvisningsmodalen | Lägg till OCR-nivåsiktbarhet för endast textbaserad bildtext, exakta överskridningskontroller på pixelnivå, bredare SVG-path-omfattning där det behövs, automatisk installering/upptäckt av renderer endast om det kan förbli valfritt, samt automatiserad reparationsutföring som bevarar topologin |
| TikZJax integration | Kandidatrenderingsvärd för Obsidian-sida visning | Håll det valfritt; gör inte TikZJax till en obligatorisk pluginkörningsberoendighet |
## Konfiguration
@ -361,6 +371,7 @@ För en CMOS-inverter bör prompten begära en explicit topologi samt layoutrest
| `enableExperimentalDiagramPipeline` | `false` | Växla mellan specifikationstillvägagångssätt och gammaldags Mermaid |
| `experimentalDiagramCompatibilityMode` | `'legacy-mermaid'` | `'legacy-mermaid'` = Mermaid endast; `'best-fit'` = nativa mål + fallbackar |
| `preferredDiagramIntent` | `undefined` (auto) | Överskriva automatisk avsiktsdetektering |
| `preferredDiagramRenderTarget` | `undefined` (auto) | Överskriva artefaktrenderaren, inklusive Draw.io, Drawnix och Circuitikz |
| `summarizeToMermaidLanguage` | `'en'` | Måländning för diagrametiketter |
| `summarizeToMermaidProvider` / `Model` | DeepSeek | Per-uppgift LLM för diagramgenerering |
| `autoMermaidFixAfterGenerate` | (från konstanter) | Kör automatiskt gammaldags fixerare på Mermaid utdata |
@ -380,10 +391,11 @@ När det aktiveras hämtar Notemd relevanta kontextsnutdelningar från din vault
| Aktion | Metod |
|--------|--------|
| SVG export | `mermaid.render()` / `vega.View.toSVG()` / SVG builder för Canvas |
| PNG-export | SVG → Image → Canvas (device pixel ratio 1x-3x) → PNG ArrayBuffer |
| Export till PNG | SVG → Bild → Canvas / preview-rasterisator vid konfigurerad PPI → PNG ArrayBuffer |
| Export till PDF | SVG → rasterbild vid konfigurerad PPI → ensidig PDF |
| Spara källa | Rå artefaktinnehåll sparas med målspecifik extension |
| Endast källa-förhandsvisning | Icke-inline artefakter med källinnehåll visas som kod tillsammans med diagnostik, utan iframe-rendering |
| Semantisk granskning | Mermaid, JSON Canvas, Vega-Lite, och redigerbar HTML/SVG kontrollerad av `scripts/diagram-semantic-verification.js` |
| Semantisk granskning | Mermaid, JSON Canvas, Vega-Lite, redigerbar HTML/SVG, Draw.io, Drawnix samt begränsad Circuitikz kontrolleras av `scripts/diagram-semantic-verification.js` tillsammans med renderer-/CLI-test |
**Caching**: RenderCache använder en deterministisk JSON-nyckel från `{spec, target, theme}`. In-flight deduplikering förhindrar dubbla renderingar.

File diff suppressed because one or more lines are too long

View file

@ -1,7 +1,7 @@
---
id: diagrams
title: "Şemalar"
description: "Bir özellik-öncelikli mimari kullanarak notlarınızdan düzenlenebilir şekil nesneleri ve gelecekte sınırlı circuitikz şemaları oluşturmak üzere Mermaid, JSON Canvas, Vega-Lite, HTML üretir"
description: "Öncelikle tanım dosyalarını kullanan bir mimari aracılığıyla notlarınızdan Mermaid, JSON Canvas, Vega-Lite, HTML, düzenlenebilir şekil dosyaları, Draw.io, Drawnix ve sınırlı circuitikz diyagramları oluşturur."
author:
'@id': 'https://jacobinwwey.github.io/obsidian-NotEMD/#person-jacobinwwey'
keywords: [diagrams, mermaid, vega-lite, canvas, visualization, spec-first, drawio, drawnix, editable svg, circuitikz, TikZJax]
@ -18,7 +18,7 @@ import TLDR from '@site/src/components/TLDR';
# Şemalar
<TLDR>
**Notemd, özellik-öncelikli bir işlem akışı aracılığıyla notlarınızdan şemalar oluşturur.** LLM, renderörden bağımsız bir `DiagramSpec` JSON üretir; ardından özel adaptörler bunu Mermaid, JSON Canvas, Vega-Lite, HTML veya düzenlenebilir HTML/SVG çıktısına dönüştürür. 8 farklı amaç türünü, otomatik yedekleme zincirlerini, SVG/PNG dışa aktarımıyla canlı önizlemeyi, semantik doğrulamayı ve yerel bilgiyle zenginleştirilmiş üretimi destekler.
**Notemd, öncelikle tanım dosyalarına dayalı bir işlem akışı kullanarak notlarınızdan diyagramlar üretir.** LLM, render cihazından bağımsız bir `DiagramSpec` JSON dosyası oluşturur; ardından özel adaptörler bunu Mermaid, JSON Canvas, Vega-Lite, HTML, düzenlenebilir HTML/SVG, Draw.io, Drawnix veya sınırlı circuitikz çıktısına dönüştürür. 9 farklı amaç türünü, otomatik yedekleme zincirlerini, SVG/PNG/PDF dışa aktarımıyla canlı önizlemeyi, semantik doğrulamayı ve yerel bilgiyle zenginleştirilmiş üretimi destekler.
</TLDR>
Bu içerik [Obsidian AI Bilgi Yönetimi Kılavuzu](/docs/pillar-ai-knowledge) serisinin bir parçasıdır.
@ -54,6 +54,7 @@ graph LR
| `stateDiagram` | Mermaid | HTML | Durum makineleri, yaşam döngüsü modelleri |
| `canvasMap` | JSON Canvas | Mermaid → HTML | Kavram haritaları, bilgi grafikleri |
| `dataChart` | Vega-Lite | Mermaid → HTML | Çubuk, çizgi, alan, dağılım, pasta, tablolar |
| `circuit` | circuitikz | none | Doğrulanmış `CircuitSpec` verilerinden elde edilen sınırlı circuitikz diyagramları |
## Niyet Tespiti
@ -67,6 +68,7 @@ Notemd, notunuzdaki içerikten anahtar kelime puanlaması kullanarak en uygun di
| `stateDiagram` | Durum, geçiş, beklemede, çalışıyor, başarısız (3+ eşleşme) | 0.76 |
| `flowchart` | Numaralandırılmış adımlar (2+) veya if/then/else/iş akışı sözlüğü | 0.74 |
| `canvasMap` | Kavram haritası, bilgi grafiği, mekansal, küme | 0.72 |
| `circuit` | circuitikz, TikZJax, circuit, schematic, CMOS, NMOS, PMOS, MOSFET, VDD/GND, `vin`/`vout` | 0.78 |
| `mindmap` | Varsayılan geri dönüş | 0.55 |
**Tercih edilen diyagram türü** ayarı, kenar çubuğu seçici veya açık bir komut paleti seçeneği ile geçersiz kılınabilir.
@ -80,10 +82,9 @@ Deneysel özellik öncelikli iş akışı artık iki bağımsız kontrolü içer
| Tercih edilen diyagram türü | `preferredDiagramIntent` | Oluşturulan `DiagramSpec`'nun anlamsal şeklini yönlendirir |
| Tercih edilen render hedefi | `preferredDiagramRenderTarget` | **Diyagram oluştur** ve **Diyagram önizle** işlemleri için araç renderleyicisini seçer |
Planlayıcı varsayılanı için **Tercih edilen render hedefi**'ni **Otomatik** olarak ayarlayın veya Mermaid, JSON Canvas, Vega-Lite, HTML veya Düzenlenebilir HTML/SVG'yi açıkça seçin. Bu geçersiz kılma yalnızca araç ve önizleme komutları için geçerlidir. Standart **Mermaid diyagramı olarak özetle** komutu mevcut Markdown iş akışlarının sessizce format değiştirmemesi için Mermaid uyumlu çıktılara sabitlenmiştir.
Bu ayrım önemlidir çünkü bir `flowchart` amacı artık Markdown notları için Mermaid, sağlam bir geri dönüş için HTML veya sonraki düzenlemeler için Düzenlenebilir HTML/SVG olarak render edilebilir. Draw.io ve Drawnix hâlâ CLI araç ihracatçıları olarak kalır ve eklenti içi render hedefleri değildir.
Planlayıcının varsayılan ayarı için **Tercih edilen render hedefi** olarak **Auto** seçin; aksi takdirde doğrudan Mermaid, JSON Canvas, Vega-Lite, HTML, Düzenlenebilir HTML/SVG, Draw.io, Drawnix veya Circuitikz seçiminde bulunun. Bu değişiklik yalnızca dosya oluşturma ve önizleme komutları için geçerlidir. Mevcut Markdown iş akışlarının sessizce format değiştirmemesi amacıyla standart **Mermaid diyagramı olarak özetle** komutu hâlâ Mermaid uyumlu çıktıya sabitlenmiştir.
Bu ayrım önemlidir çünkü artık bir `flowchart` amaç türü, Markdown notları için Mermaid olarak, güvenilir bir yedekleme için HTML olarak, sonraki işlemler için düzenlenebilir HTML/SVG olarak veya SVG inceleme dosyalarıyla birlikte Draw.io/Drawnix kaynak dosyaları olarak render edilebilir. Bir `circuit` amaç türü ise Circuitikz kullanır ve doğrulanmış bir `CircuitSpec` gerektirir; bu, keyfi TikZ metni talebi değildir.
## Kullanım
### Bir Diyagram Oluştur
@ -101,16 +102,21 @@ Bu ayrım önemlidir çünkü bir `flowchart` amacı artık Markdown notları i
| Vega-Lite | `.json` | `{note}_diagram.json` |
| HTML | `.html` | `{note}_diagram.html` |
| Düzenlenebilir HTML/SVG | `.html` | `{note}_diagram.html` |
| Draw.io | `.drawio` + `.drawio.svg` + `.drawio.md` | `{note}_diagram.drawio` ve inceleme dosyaları |
| Drawnix | `.drawnix` + `.drawnix.svg` + `.drawnix.md` | `{note}_diagram.drawnix` ve inceleme dosyaları |
| Circuitikz | `.tex` + `.tex.svg` + `.tex.md` | `{note}_diagram.tex` ve inceleme dosyaları |
### Bir Diyagramı Önizle
1. **"Notemd: Diyagramı Önizle"** komutunu Çalıştır
2. İşlenmiş diyagramla birlikte modala bir pencere açılır
3. Arayüz düğmelerini kullanarak SVG veya PNG olarak Dışa Aktar
3. Araç çubuğundaki düğmeleri kullanarak SVG, PNG veya PDF olarak dışa aktarın
Ayarlar bölümünde **Önizlemeyi Otomatik Aç** seçeneği mevcuttur — oluşturma işleminden sonra önizleme modali otomatik olarak başlatılır.
Önizleme modali ayrıca bir hata teşhisi paneline sahiptir. İşleyiciler ve duman kontrolü işlemleri `RenderArtifact.diagnostics` ekleyebilir; modala, önizlemenin yanında hata/uyarı/bilgi sayıları, ardından ciddiyet düzeyi, teşhis türü, mesaj ve onarım önerileri içeren bir teşhis özeti gösterilir. Aynı özet önizleme geçmişi girişlerinde de görüntülenir, böylece her girişi açmadan tekrarlanan circuitikz duman kontrolü denemeleri karşılaştırılabilir. Kaynak içeriğine sahip ancak doğrudan veya HTML iframe yoluyla işlenemeyen nesneler için modala artık boş bir iframe zorlamak yerine yalnızca kaynak içeriğine dayalı bir önizleme sunar. Bu sayede circuitikz derleme/işleme duman kontrolü, SVG metin-tokenu kontrolü, PNG boş ekran görüntüsü kontrolü ve gelecekteki örtüşme raporları için görünür bir UI yüzey sağlanır; aynı zamanda TikZJax veya LaTeXi zorunlu bir eklenti çalışma zamanı bağımlılığı haline getirmez ya da kaynak metnin doğrulanmış görsel bir işlenmiş versiyon olduğunu varsaymaz.
PNG ve PDF önizleme dışa aktarımları, yapılandırılmış önizleme PPI değerini kullanır. Varsayılan değer 300 PPI'dir ve 600 PPI'nin üzerindeki değerler 600'e sınırlanır. SVG ise vektör boyutunda kalır. `.drawio`, `.drawnix` ve `.tex` gibi kaynak dosyalar, Obsidian'ın diagram.net, Drawnix, LaTeX veya TikZJax'ı eklenti çalışma zamanına dahil etmeden inceleyilebilir görüntüleri gösterebilmesi ve dışa aktarabilmesi amacıyla bir `previewSvg` dosyası sağlayabilir.
Önizleme modülü aynı zamanda bir hata teşhisi paneline de sahiptir. İşleyiciler ve sigorta kontrolleri `RenderArtifact.diagnostics` bilgisini ekleyebilir; bu modül, önizlemenin yanında hata/uyarı/bilgi sayılarını, ardından ciddiyet seviyesini, teşhis türünü, mesajı ve onarım önerilerini içeren bir teşhis özeti gösterir. Aynı özet, teşhise duyarlı geçmiş girişlerinde de görüntülenir; bu sayede her bir girişi açmadan tekrarlanan circuitikz sigorta denemeleri karşılaştırılabilir. Kaynak içeriğine sahip ancak doğrudan içeride veya HTML iframe yolu üzerinden işlenemeyen nesneler için, modül artık boş bir iframe zorlamak yerine yalnızca kaynağa dayalı bir önizleme kullanır. Bu yaklaşım, circuitikz derleme/çalıştırma sigorta testleri, SVG metin-tokenu kontrolleri, PNG boş ekran görüntüsü kontrolleri, yalnızca yol bilgilerine dayalı görsel örtüşme raporları ve gelecekteki örtüşme raporlarına, TikZJax veya LaTeX gibi zorunlu eklentilere bağımlı kalmadan veya kaynak metnin doğrulanmış bir görsel çıktı olduğunu varsaymadan görünür bir arayüz sunar.
### Eski Mermaid Modu
@ -164,12 +170,12 @@ Bu hedef henüz varsayılan planlayıcı rotası olarak tasarlanmamıştır. Ür
### Draw.io ve Drawnix Dışa Aktarım Sınırları
Mevcut uygulama, üçüncü taraf düzenleyici desteğini ürün sınırında tutar:
Mevcut uygulama, üçüncü taraf düzenleyici desteğini sanal nesne sınırları içinde tutarken yine de açık render hedeflerini sunmaya devam etmektedir:
| Hedef | Sözleşme | Çalışma Zamanı Bağımlılığı |
|--------|----------|--------------------|
| Draw.io | `SemanticFigureModel`'dan gelen belirlenmiş, sıkıştırılmamış `mxfile` XML | Eklenti çalışma zamanında veya CI'de hiçbiri yok |
| Drawnix | `geometry` ve `arrow-line` öğelerini kullanan minimal `.drawnix` JSON alt kümesi | Eklenti çalışma zamanında veya CI'de hiçbiri yok |
| Draw.io | `SemanticFigureModel`'den elde edilen belirlenmiş, sıkıştırılmamış `mxfile` XML formatı ve SVG/PNG/PDF inceleme eki dosyaları | Eklenti çalışma zamanında veya CI ortamında hiçbiri bulunmaz |
| Drawnix | `geometry` ve `arrow-line` öğelerini kullanan minimal `.drawnix` JSON alt kümesi ve SVG/PNG/PDF inceleme eki dosyaları | Eklenti çalışma zamanında veya CI ortamında hiçbiri bulunmaz |
Bu denge kasıtlıdır: Notemd, diagram.net Desktop, Drawnix, Plait veya yalnızca tarayıcı tabanlı düzenleyici durumlarını eklentiye dahil etmeden görünür etiketleri, sabit ID'leri ve desteklenen ilkel kapsamı doğrulayabilir.
@ -213,7 +219,11 @@ Notemd şu an bu yönde ilk kısıtlı depo prototipini içermektedir. Kasıtlı
npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-inverter.tex
```
Prototip, altı altın referans ailesi için ayrı bir `CircuitSpec` sınırı ve belirlenmiş bir dışa aktarıcı ekler:
Prototip, altı altın referans ailesi için kısıtlı bir `CircuitSpec` sınırı ve belirlenmiş bir dışa aktarım mekanizması ekler:
Deneysel diyagram işleme akışında bu özellik artık `intent: "circuit"` ve render hedefi olarak `circuitikz` aracılığıyla da erişilebilmektedir. Oluşturulan `DiagramSpec` dosyası yalnızca devre amaçlı kullanımlar için `circuitSpec` içerebilir. `CircuitikzRenderer`, aynı belirlenmiş `.tex` kaynağını yazar ve bu doğrulanmış devre topolojisinden türetilmiş bir SVG önizleme eki dosyası ekler; bu sayede Obsidian önizlemesi ile birlikte SVG/PNG/PDF dışa aktarımı mümkün olur. Bu eki dosya, LaTeX/TikZJax derleme sonucu değildir; gerçek render kanıtları yine aşağıdaki özel test komutlarında yer alır.
Desteklenen altın şablonlar için `layoutHints.inputSide` ve `layoutHints.outputSide` yalnızca sunum amaçlı kontrol elemanları olarak kalır. Bunlar belirlenmiş giriş/çıkış port yerleşimlerini hareket ettirebilir, ancak topoloji imzasını değiştirmez veya devreyi yeniden bağlamak için bir onarım işlemi gerçekleştiremez.
| Devre türü | Altın referans | Akım garanti |
|--------------|------------------|-------------------|
@ -224,7 +234,7 @@ Prototip, altı altın referans ailesi için ayrı bir `CircuitSpec` sınırı v
| `cmos-nand2` | `cmos-nand2-v1` | LaTeX yazmadan önce paralel PMOS çekme, seri NMOS indirme, çift giriş `va` / `vb` ve `vout`'yi doğrular |
| `cmos-nor2` | `cmos-nor2-v1` | LaTeX yazmadan önce seri PMOS çekme, paralel NMOS indirme, çift giriş `va` / `vb` ve `vout`'yi doğrular |
Bu henüz genel bir TikZ üreticisi değil. LaTeX derlemez, TikZJax'yı çağırmaz, ekran görüntülerini incelemez veya otomatik görüntü geri bildirimli onarım yapmaz. Bunlar daha sonraki aşamalarda gerçekleştirilir.
Bu araç genel bir TikZ üreticisi değildir. Keyfi TikZ kodlarını kabul etmez, LaTeX derlemez, TikZJax çağırmaz, eklenti çalışma zamanında ekran görüntülerini incelemez ve otomatik görüntü geri bildirimli onarım işlemleri yapmaz. Bunlar daha sonraki aşamalarda ele alınır.
Dosya uzantısı `.tex` veya `.tikz` olduğunda ve kaynak `\usepackage{circuitikz}` veya `\begin{circuitikz}` içerdiğinde, Önizleme diyagramı komutu kaydedilen circuitikz kaynak nesnelerini doğrudan yeniden açabilir. Bu yol sadece kaynak içeren bir circuitikz önizlemesidir: modül kaynağı, teşhisleri, kopyalama/kaydet kontrollerini ve geçmiş meta verilerini gösterir, ancak LaTeX derlemez veya eklenti çalışma zamanında TikZJax'yı çağırmaz.
@ -350,8 +360,8 @@ Bir CMOS invertörü için, istek yalnızca "CMOS invertör çizin" demek yerine
|------|----------------|-----------|
| Genel diyagramlar | Mermaid, JSON Canvas, Vega-Lite, HTML için özellik odaklı iş akışı uygulandı | Anlamsal doğrulama kapsamını genişletmeye devam edin |
| Düzenlenebilir şekiller | `editable-html-svg`, Draw.io XML ve Drawnix JSON nesne sınırları uygulandı | Testler düzenlenebilirliği kanıtladıktan sonra daha zengin temel elemanlar ekleyin |
| CLI desteği | `npm run diagram:export-artifact`, tek bir `DiagramSpec`'dan düzenlenebilir HTML/SVG, Draw.io ve Drawnix'yi dışa aktarır | Yeni hedefler gönderildiğinde hedefe özel duman düzenekleri ekleyin |
| circuitikz | `CircuitSpec -> circuitikz` prototip, ortak kaynak, CMOS invertör, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1` ve `cmos-nor2` / `cmos-nor2-v1` altın şablonlarını, projeleri `layoutHints.inputSide` ve `layoutHints.outputSide` topolojiyi değiştirmeden belirli giriş/çıkış port yerleşimine dönüştürür; `--topology-reference` aracılığıyla onarım topolojisi sapmalarını reddeder, `--repair-brief-output` ve şema `notemd.circuitikz.repair-brief.v1` aracılığıyla topolojiyi koruyan onarım özetleri üretir, `diagnosticFocus`, `acceptanceCriteria` ve rol `topology-preserving-circuitikz-repair` ile yapılandırılmış `repairPrompt` devir içeriği içerir, `--repair-brief` aracılığıyla onarım adaylarını doğrular, şema `notemd.circuitikz.repair-acceptance.v1` aracılığıyla `readyForVisualAcceptance` ve `remainingChecks` ile birlikte `repairAcceptance` kapı kanıtlarını döndürür, bu kanıtları `--repair-acceptance-output` aracılığıyla saklar, derleme günlüklerini analiz eder, açık yerel render motorları ve `--expected-artifact`, SVG `--expected-svg-text` ile çalışabilir, `aria-label`, `<title>` ve `<desc>` aracılığıyla erişilebilirlik meta verisi kontrolleri yapar, gizli/şeffaf SVG öğe dışlaması, yolsade etiketler için `render-svg-text-path-only` / `pathOnlyGlyphUseCount` sınıflandırma, `<use href="#...">` için yolsade görsel karakter yerleşim kontrolü, `render-svg-path-glyph-overlap` aracılığıyla yolsade görsel karakter örtüşme teşhisi, `Z/z` için kapalı yol akım noktası işleme, A/a yay uçları için kesin yay sınırları, C/S/Q/T eğri uçları için kesin Bezier eğri sınırları, çizgi kalınlığına duyarlı SVG sınırlar ve etiket örtüşme kontrolleri, `polyline` / `polygon` çizim geometrisi kontrolleri, konumlandırılmış `tspan` etiket geometrisi, `text-anchor`bilinçli konumlandırılmış metin geometrisi, SVG sınırlıcanvas/metinörtüşmesi ve etiketvsçizim duman kontrolleri için dönüşümbilinçli geometri, ayrıca PNG boş olmayan / kesilmiş / yoğun ön plan ekran görüntüsü duman kontrolleri; indeksli renk paleti alfası, gri tonlama/RGB tRNS şeffaf örnekleri ve Adam7 çapraz PNGler ile indeksli bit derinliği hataları için formatözgü `render-png-unsupported` rehberlikleri içerir, bunlar `foregroundBounds`, `foregroundDensity`, `render-png-content-clipped` ve `render-png-foreground-dense` aracılığıyla kabuk analizi olmadan yapılır; toplu bakımci duman düzeneklerini içerir, eksik render motoru yapılandırmalarını `rendererAvailability.status: "missing-configuration"` ve `compile-executable-invalid` ile kaydeder ve genel önizleme teşhisleri, teşhis özet sayıları, teşhisbilinçli geçmiş girişleri ve sadece kaynaktabanlı geri dönüş imkanı sağlar `RenderArtifact.diagnostics` ve önizleme modu aracılığıyla | Yolsade görsel metinler için OCR seviyesinde etiket tanıma, hassas pikselseviyesi örtüşme kontrolleri, gerektiğinde daha geniş SVG yol kapsamı, yalnızca isteğe bağlı kalabilecekse otomatik render motoru kurulumu/bulma ve otomatik topolojiyi koruyan onarım işlemleri |
| CLI desteği | `npm run diagram:export-artifact`, doğrulanmış bir `DiagramSpec` dosyasından düzenlenebilir HTML/SVG, Draw.io, Drawnix, Circuitikz ve SVG/PNG/PDF formatlarındaki inceleme kanıtlarını dışa aktarır | Yeni hedefler piyasaya sürüldüğünde hedefe özgü test senaryoları eklenir |
| circuitikz | `DiagramSpec(intent: "circuit", circuitSpec) -> CircuitikzRenderer -> circuitikz` komutu, ortak kaynak, CMOS invertör, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1` ve `cmos-nor2` / `cmos-nor2-v1` için altın şablonlar dışa aktarır; UI amaçları ve render hedefi seçeneklerini gösterir; TeX dosyalarını ve SVG/PNG/PDF önizleme dosyalarını oluşturur; çıktı verilmeden önce topolojiyi doğrular; derleme günlüklerini analiz eder; özel yerel render motorlarını ve `--expected-artifact` parametresini kullanabilir; ayrıca yalnızca kaynak dosyalarla çalışma seçeneğini ve `RenderArtifact.diagnostics` ile önizleme modülü aracılığıyla görülebilen önizleme hata bilgilerini sağlar | Yalnızca yol bilgisi içeren görsel metinler için OCR seviyesinde etiket tanıma, piksel düzeyinde hassas örtüşme kontrolü, gerektiğinde daha geniş SVG yol kapsamı, yalnızca isteğe bağlı kalabilecek durumlarda otomatik render motoru kurulumu/bulunması ve topolojiyi koruyan otomatik onarım işlemlerinin eklenmesi |
| TikZJax entegrasyonu | Obsidian tarafı ekran için aday render sunucusu | Bunu isteğe bağlı tutun; TikZJaxyu zorunlu bir eklenti çalışma zamanı bağımlılığı haline getirmeyin |
## Yapılandırma
@ -361,6 +371,7 @@ Bir CMOS invertörü için, istek yalnızca "CMOS invertör çizin" demek yerine
| `enableExperimentalDiagramPipeline` | `false` | Öncelikilk ve eski Mermaid arasında geçiş yapın |
| `experimentalDiagramCompatibilityMode` | `'legacy-mermaid'` | `'legacy-mermaid'` = yalnızca Mermaid; `'best-fit'` = yerel hedefler + geri dönüş seçenekleri |
| `preferredDiagramIntent` | `undefined` (otomatik) | Otomatik niyet algılama işlemini geçersiz kılın |
| `preferredDiagramRenderTarget` | `undefined` (otomatik) | Draw.io, Drawnix ve Circuitikz dahil olmak üzere araç renderleyicilerini geçersiz kılma |
| `summarizeToMermaidLanguage` | `'en'` | Şema etiketleri için hedef dil |
| `summarizeToMermaidProvider` / `Model` | DeepSeek | Şema oluşturma için görevözel LLM |
| `autoMermaidFixAfterGenerate` | (sabitlerden) | Mermaid çıktısı üzerinde eski düzelticiyi otomatik olarak çalıştırın |
@ -380,10 +391,11 @@ Etkinleştirildiğinde, Notemd kasanızın yerel bilgi tabanından (MiniSearch t
| Eylem | Yöntem |
|--------|--------|
| SVG export | Canvas için `mermaid.render()` / `vega.View.toSVG()` / SVG oluşturucu |
| PNG dışa aktarımı | SVG → Görüntü → Canvas (cihaz piksel oranı 1x-3x) → PNG ArrayBuffer |
| PNG dışa aktarımı | SVG → Görüntü → Ayarlanan PPI değerinde Canvas / önizleme rasterleştirici → PNG ArrayBuffer |
| PDF dışa aktarımı | SVG → Ayarlanan PPI değerinde raster görüntü → tek sayfalık PDF |
| Kaynak kaydetme | Hedefe özgü uzantıyla ham eser içeriği kaydedilir |
| Yalnızca kaynak önizleme | Kaynak içeriğine sahip, iframe olmadan kod ve teşhis bilgileriyle gösterilen doğrudan olmayan eserler |
| Anlamsal denetim | Mermaid, JSON Canvas, Vega-Lite ve HTML/SVG şeklinde düzenlenebilir olanlar `scripts/diagram-semantic-verification.js` tarafından kontrol edilir |
| Semantik denetim | `scripts/diagram-semantic-verification.js` ile birlikte renderleyici/CLI testleri aracılığıyla Mermaid, JSON Canvas, Vega-Lite, düzenlenebilir HTML/SVG, Draw.io, Drawnix ve sınırlı Circuitikz kontrol edilir |
**Önbellekleme**: RenderCache, `{spec, target, theme}`'ın belirlenmiş JSON anahtarını kullanır. Yol üzerindeki tekrar önleme, aynı görüntünün tekrar üretilmesini engeller.

View file

@ -1,7 +1,7 @@
---
id: diagrams
title: "Діаграми"
description: "Створює Mermaid, JSON Canvas, Vega-Lite, HTML, редаговані фігурні об’єкти та майбутні обмежені circuitikz діаграми з ваших нотаток за допомогою архітектури, орієнтованої на специфікацію"
description: "Створюйте діаграми Mermaid, JSON Canvas, Vega-Lite, HTML, редаговані артефакти зображень, файли Draw.io, Drawnix та обмежені діаграми circuitikz на основі ваших нотаток за допомогою архітектури, що ґрунтується на специфікаціях"
author:
'@id': 'https://jacobinwwey.github.io/obsidian-NotEMD/#person-jacobinwwey'
keywords: [diagrams, mermaid, vega-lite, canvas, visualization, spec-first, drawio, drawnix, editable svg, circuitikz, TikZJax]
@ -18,7 +18,7 @@ import TLDR from '@site/src/components/TLDR';
# Діаграми
<TLDR>
**Notemd створює діаграми з ваших нотаток через конвеєр, орієнтований на специфікацію.** LLM генерує рендерер-незалежний `DiagramSpec` JSON, після чого спеціалізовані адаптери перетворюють його на Mermaid, JSON Canvas, Vega-Lite, HTML або редагований HTML/SVG вихід. Підтримує 8 типів намірів, автоматичні ланцюги заміни, прямий перегляд з експортом у SVG/PNG, семантичну перевірку та генерацію з підсиленням місцевих знань.
**Notemd генерує діаграми з ваших нотаток через конвеєр, орієнтований на специфікації.** Штучний інтелект створює JSON-файл `DiagramSpec`, незалежний від конкретного рендерера, після чого спеціалізовані адаптери перетворюють його на формати Mermaid, JSON Canvas, Vega-Lite, HTML, редагований HTML/SVG, Draw.io, Drawnix або обмежені діаграми circuitikz. Підтримується 9 типів намірів, автоматичні ланцюги резервного виконання, прямий перегляд із експортом у форматах SVG/PNG/PDF, семантична перевірка та генерація з підсиленням локальних знань.
</TLDR>
Це частина [Obsidian Посібника з управління знаннями в ШІ](/docs/pillar-ai-knowledge).
@ -54,6 +54,7 @@ graph LR
| `stateDiagram` | Mermaid | HTML | Машини станів, моделі життєвого циклу |
| `canvasMap` | JSON Canvas | Mermaid → HTML | Карти концепцій, графи знань |
| `dataChart` | Vega-Lite | Mermaid → HTML | Стовпчасті, лінійні, площинні, розсіяні, кругові діаграми, таблиці |
| `circuit` | circuitikz | none | Обмежені діаграми схем на основі перевірених вхідних даних типу `CircuitSpec` |
## Виявлення наміру
@ -67,6 +68,7 @@ Notemd визначає найкращий тип діаграми на осно
| `stateDiagram` | Стан, перехід, у очікуванні, у роботі, збій (3+ збіги) | 0.76 |
| `flowchart` | Нумеровані кроки (2+) або лексикон if/then/else/workflow | 0.74 |
| `canvasMap` | Карта концепцій, граф знань, просторовий, кластер | 0.72 |
| `circuit` | circuitikz, TikZJax, circuit, schematic, CMOS, NMOS, PMOS, MOSFET, VDD/GND, `vin`/`vout` | 0.78 |
| `mindmap` | За замовчуванням | 0.55 |
Перевизначте за допомогою налаштування **Бажаний тип діаграми**, вибірника з бічної панелі або прямої опції палітри команд.
@ -80,10 +82,9 @@ Notemd визначає найкращий тип діаграми на осно
| Бажаний тип діаграми | `preferredDiagramIntent` | Визначає семантичну форму створеного `DiagramSpec` |
| Бажана мета відображення | `preferredDiagramRenderTarget` | Вибирає інструмент для генерації та перегляду діаграми |
Встановіть **Бажану мету відображення** як **Автоматично** для за замовчуванням планувальника, або виберіть Mermaid, JSON Canvas, Vega-Lite, HTML чи редактируваний HTML/SVG прямо. Це перевизначення застосовується лише до команд генерації та перегляду артефактів. Стандартна команда **Узагальнити як діаграму Mermaid** залишається прив’язаною до формату, сумісного з Mermaid, щоб існуючі робочі процеси з Markdown не змінювали формат без уваги.
Це розділення має значення, оскільки намір `flowchart` тепер може бути відображений як Mermaid для нотаток у Markdown, як HTML для надійного запасного варіанту або як редактируваний HTML/SVG для подальшої редагування. Draw.io та Drawnix залишаються експортерами артефактів у форматі CLI, а не метами відображення всередині плагіну.
Встановіть **Preferred render target** на **Auto** як значення за замовчуванням для планувальника, або виберіть безпосередньо Mermaid, JSON Canvas, Vega-Lite, HTML, Editable HTML/SVG, Draw.io, Drawnix чи Circuitikz. Це перевизначення застосовується лише до команд створення артефактів та перегляду. Стандартна команда **Summarise as Mermaid diagram** залишається призначеною для формату, сумісного з Mermaid, щоб існуючі робочі процеси у Markdown не мимоволі змінювали формат.
Це розділення має велике значення, оскільки тепер намір `flowchart` може бути відтворений у форматі Mermaid для нотаток у Markdown, у форматі HTML як надійний резервний варіант, у редагованому форматі HTML/SVG для подальшої редагування або у вигляді вихідних артефактів Draw.io/Drawnix із супровідними зображеннями SVG. Намір `circuit` спрямовується до Circuitikz та вимагає перевіреної специфікації `CircuitSpec`; це не є запитом на довільний текст у форматі TikZ.
## Використання
### Створити діаграму
@ -101,16 +102,21 @@ Notemd визначає найкращий тип діаграми на осно
| Vega-Lite | `.json` | `{note}_diagram.json` |
| HTML | `.html` | `{note}_diagram.html` |
| Редаговано HTML/SVG | `.html` | `{note}_diagram.html` |
| Draw.io | `.drawio` + `.drawio.svg` + `.drawio.md` | `{note}_diagram.drawio` разом із супровідними зображеннями для перегляду |
| Drawnix | `.drawnix` + `.drawnix.svg` + `.drawnix.md` | `{note}_diagram.drawnix` разом із супровідними зображеннями для перегляду |
| Circuitikz | `.tex` + `.tex.svg` + `.tex.md` | `{note}_diagram.tex` разом із супровідними зображеннями для перегляду |
### Перегляд діаграми
1. Запустити **"Notemd: Перегляд діаграми"**
2. Відкривається модальне вікно з відтвореною діаграмою
3. Експортувати у форматі SVG або PNG за допомогою кнопок інструментарію
3. Експортуйте у форматах SVG, PNG або PDF за допомогою кнопок на панелі інструментів
Функція **Автоматичний перегляд** доступна в налаштуваннях — після генерації модальне вікно перегляду відкривається автоматично.
У модальному вікні перегляду також є панель діагностики артефактів. Рендерери та перевірки можуть додавати `RenderArtifact.diagnostics`; у вікні відображається підсумок діагностики з кількістю помилок/попереджень/інформації, потім ступінь серйозності, тип діагностики, повідомлення та поради щодо виправлення поруч із переглядом. Той самий підсумок відображається у записах історії перегляду, тож можна порівнювати повторні спроби circuitikz без необхідності відкривати кожен запис. Для артефактів, які мають вихідний контент, але не можуть бути відтворені безпосередньо або через шлях iframe HTML, модальне вікно тепер переходить на перегляд лише вихідного коду замість примусового використання порожнього iframe. Це дозволяє circuitikz проводити перевірки компіляції/рендерингу, SVG перевірки текстових токенів, перевірки порожніх скріншотів у форматі PNG та майбутні звіти про перекриття матеріалу на видимій UI поверхні, не роблячи TikZJax або LaTeX обов’язковою залежністю під час виконання плагінів та не прикидаючись, що вихідний текст — це перевірений візуальний результат.
Експорт перегляду у форматах PNG та PDF використовує налаштовану роздільну здатність перегляду. За замовчуванням вона дорівнює 300 PPI, а значення вище 600 PPI обмежуються до 600. Формат SVG залишається векторним. Вихідні артефакти на кшталт `.drawio`, `.drawnix` та `.tex` можуть містити супровідний файл `previewSvg`, щоб Obsidian міг відображати та експортувати зображення для перегляду без необхідності вбудовувати сервіси diagram.net, Drawnix, LaTeX чи TikZJax під час роботи додатку.
У модалі перегляду також є панель діагностики артефактів. Засоби генерації візуалізацій та перевірки можуть додавати значення `RenderArtifact.diagnostics`; модалка відображає підсумок діагностики з кількістю помилок, попереджень та інформаційних повідомлень, а потім — рівень серйозності, тип діагностики, повідомлення та поради щодо виправлення поруч із переглядом. Той самий підсумок відображається у записах історії, які підтримують діагностику, тому можна порівнювати кілька спроб генерації візуалізацій з використанням circuitikz, не відкриваючи кожен окремий запис. Для артефактів, які мають вихідний текст, але не можуть бути відтворені безпосередньо чи через шлях HTML iframe, модалка тепер використовує перегляд лише вихідного коду замість примусового використання порожнього iframe. Це забезпечує видимий інтерфейс для перевірок компіляції/генерації візуалізацій circuitikz, перевірок текстових токенів SVG, перевірок порожніх скріншотів у форматі PNG, звітів про перекриття гліфів, що базуються лише на шляхах, та майбутніх звітів про перекриття, не роблячи TikZJax чи LaTeX обов’язковими зависимостями під час виконання плагінів та не прикидаючись, ніби вихідний текст є перевіреною візуальною реалізацією.
### Режим легасі Mermaid
@ -164,12 +170,12 @@ Notemd визначає найкращий тип діаграми на осно
### Draw.io та Drawnix Межі експорту
Текуща реалізація зберігає підтримку сторонніх редакторів на межі артефакта:
Чинна реалізація зберігає підтримку сторонніх редакторів на межі артефакта, водночас надаючи можливість використання чітко визначених цілей відтворення:
| Мета | Контракт | Залежність під час виконання |
|--------|----------|--------------------|
| Draw.io | детермінований некомпресований `mxfile` XML від `SemanticFigureModel` | жодних у часі виконання плагіна або у CI |
| Drawnix | мінімальний підмножина `.drawnix` JSON з використанням елементів `geometry` та `arrow-line` | жодних у часі виконання плагіна або у CI |
| Draw.io | детермінований розпакований XML-файл `mxfile` з моделі `SemanticFigureModel`, а також супутні файли для перегляду у форматах SVG/PNG/PDF | жодних елементів під час роботи плагіна чи у процесі CI |
| Drawnix | мінімальний набір JSON-даних у форматі `.drawnix` з елементами `geometry` та `arrow-line`, а також супутні файли для перегляду у форматах SVG/PNG/PDF | жодних елементів під час роботи плагіна чи у процесі CI |
Цей компроміс є навмисним: Notemd може перевіряти видимі мітки, стабільні ідентифікатори та покриття підтримуваних примітивів без вбудовування Diagrams.NET Desktop, Drawnix, Plait або стану редактора лише у браузері у плагін.
@ -213,7 +219,11 @@ Notemd тепер включає перший обмежений прототи
npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-inverter.tex
```
Прототип додає окрему межу `CircuitSpec` та детермінований експортер для шести сімей золотих референцій:
Прототип додає обмежену межу `CircuitSpec` та детермінований експортер для шести сімей золотих зразків:
У експериментальному потоці створення діаграм це тепер також можливо через параметр `intent: "circuit"` та ціль відтворення `circuitikz`. Створена модель `DiagramSpec` може містити елемент `circuitSpec` лише у випадку, коли метою є створення схеми. `CircuitikzRenderer` генерує той самий детермінований вихідний код у форматі `.tex` та додає супутній файл перегляду у форматі SVG, отриманий на основі перевіреної топології схеми, що дозволяє отримати перегляд у Obsidian та експорт у форматах SVG/PNG/PDF. Цей супутній файл не є результатом компіляції LaTeX/TikZJax; справжні дані від рендерера все одно походять від чітко визначених команд для перевірки, наведених нижче.
Для підтримуваних шаблонів золотих зразків параметри `layoutHints.inputSide` та `layoutHints.outputSide` залишаються лише контрольними елементами для презентації. Вони можуть зміщувати місце розташування вхідних/вихідних портів у детермінований спосіб, але не змінюють підпис топології та не дозволяють виконувати крок виправлення для перепідключення елементів схеми.
| Тип схеми | Золота референція | Гарантія струму |
|--------------|------------------|-------------------|
@ -224,7 +234,7 @@ npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-in
| `cmos-nand2` | `cmos-nand2-v1` | перевіряє паралельний підтягувальний PMOS, послідовний опускаючий NMOS, подвійні входи `va` / `vb` та `vout` перед записом у LaTeX |
| `cmos-nor2` | `cmos-nor2-v1` | перевіряє послідовний підтягувальний PMOS, паралельний опускаючий NMOS, подвійні входи `va` / `vb` та `vout` перед записом у LaTeX |
Це ще не загальний генератор TikZ. Він не компілює LaTeX, не викликає TikZJax, не перевіряє скріншоти та не запускає автоматичне виправлення за допомогою зображень. Ці функції залишаються на пізніших етапах.
Це не є загальним генератором TikZ. Він не приймає довільний код TikZ, не компілює LaTeX, не викликає TikZJax, не аналізує скріншоти під час роботи плагіна та не виконує автоматизоване виправлення на основі зображень. Ці функції залишаються на наступних етапах.
Команда Preview diagram може знову відкрити збережені об’єкти джерела circuitikz безпосередньо, якщо розширення файлу є `.tex` або `.tikz` та джерело містить `\usepackage{circuitikz}` або `\begin{circuitikz}`. Цей шлях — це перегляд лише джерела circuitikz: модальне вікно показує джерело, діагностику, контролі копіювання/збереження та метадані історії, але не компілює LaTeX та не викликає TikZJax під час роботи плагіну.
@ -350,8 +360,8 @@ npm run diagram:smoke-circuitikz -- --output-dir docs/export/circuitikz-smoke --
|------|----------------|-----------|
| Загальні діаграми | Реалізовано конвеєр з орієнтацією на специфікації для Mermaid, JSON Canvas, Vega-Lite, HTML | Продовжувати розширювати охоплення семантичної перевірки |
| Редаговані фігури | Реалізовано межі артефактів `editable-html-svg`, Draw.io XML та Drawnix JSON | Додавати більш складні примітиви лише після того, як тести підтвердять можливість редагування |
| Підтримка CLI | `npm run diagram:export-artifact` експортує редаговані HTML/SVG, Draw.io та Drawnix з одного `DiagramSpec` | Додати спеціалізовані пристрої для димування для конкретних цілей під час відправки нових цілей |
| circuitikz | `CircuitSpec -> circuitikz` прототип експортує шаблони common-source, інвертор CMOS, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1` та `cmos-nor2` / `cmos-nor2-v1` золоті шаблони, проекти `layoutHints.inputSide` та `layoutHints.outputSide` у визначене розташування вхідних/вихідних портів без зміни топології, відхиляє зміни топології під час ремонту через `--topology-reference`, генерує інструкції з ремонтом зі збереженням топології через `--repair-brief-output` та схему `notemd.circuitikz.repair-brief.v1`, містить структурований контент передачі `repairPrompt` разом із `diagnosticFocus`, `acceptanceCriteria` та роллю `topology-preserving-circuitikz-repair`, перевіряє кандидати на ремонт через `--repair-brief`, повертає докази проходження `repairAcceptance` через схему `notemd.circuitikz.repair-acceptance.v1` разом із `readyForVisualAcceptance` та `remainingChecks`, зберігає ці докази через `--repair-acceptance-output`, аналізує журнали компіляції, може запускати явні локальні рендерери та `--expected-artifact`, SVG `--expected-svg-text`, перевірки метаданих доступності через `aria-label`, `<title>` та `<desc>`, виключення прихованих/прозорих елементів SVG, класифікація `render-svg-text-path-only` / `pathOnlyGlyphUseCount` для міток лише з шляхом, перевірки розташування гліфів лише з шляхом для `<use href="#...">`, діагностика перекриття гліфів лише з шляхом через `render-svg-path-glyph-overlap`, обробка точки струму для закритих шляхів для `Z/z`, точні межі дуги для крайніх точок дуги A/a, точні межі кривої Безьє для крайніх точок кривих C/S/Q/T, перевірки меж та перекриття міток з урахуванням товщини ліній SVG, перевірки геометрії малювання `polyline` / `polygon`, геометрія розташованих міток `tspan`, геометрія тексту з урахуванням `text-anchor`, геометрія з урахуванням трансформацій для SVG bounded-canvas/text-overlap та димування міток проти малюнку через `render-svg-label-overlap`, а також перевірки скріншотів PNG без порожніх ділянок/обрізаних/щільних фонів, включаючи альфа-канал індексованої палітри кольорів, прозорі зразки у сірому/RGB форматах tRNS та специфічні для формату рекомендації `render-png-unsupported` щодо інтерлейсованих PNG Adam7 та проблем з індексованою глибиною бітів, через `foregroundBounds`, `foregroundDensity`, `render-png-content-clipped` та `render-png-foreground-dense` без аналізу шеллу, містить агреговані пристрої для димування від адміністраторів через `npm run diagram:smoke-circuitikz`, фіксує відсутню конфігурацію рендерера через `rendererAvailability.status: "missing-configuration"` та `compile-executable-invalid`, а також має загальні діагностики перегляду, підрахунок підсумків діагностик, записи історії з урахуванням діагностик та резервний варіант лише з кодом через `RenderArtifact.diagnostics` та модальне вікно перегляду | Додати розпізнавання міток на рівні OCR для візуального тексту лише з шляхом, точні перевірки перекриття на рівні пікселів, більш широке покриття SVG шляхів за потреби, автоматична установка/виявлення рендерера лише тоді, коли це може залишатися необов’язковим, та автоматизоване виконання ремонту зі збереженням топології |
| Підтримка CLI | `npm run diagram:export-artifact` експортує редаговуваний HTML/SVG, Draw.io, Drawnix, Circuitikz, а також SVG/PNG/PDF у вигляді доказів перевірки з одного підтвердженого `DiagramSpec` | Додавати специфічні тестові фікси для нових цілей під час їх випуску |
| circuitikz | `DiagramSpec(intent: "circuit", circuitSpec) -> CircuitikzRenderer -> circuitikz` експортує золоті шаблони для common-source, CMOS інвертора, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1` та `cmos-nor2` / `cmos-nor2-v1`, відображає опції UI intent/render-target, створює TeX разом із прев’ю у форматах SVG/PNG/PDF, перевіряє топологію перед виведенням, аналізує журнали компіляції, може запускати явні локальні рендерери за допомогою параметра `--expected-artifact`, а також зберігає варіант лише з вихідним кодом та діагностику прев’ю, доступну через `RenderArtifact.diagnostics` та модальне вікно прев’ю | Додати розпізнавання міток на рівні OCR для візуального тексту, що складається лише з шляхів, точні перевірки перекриття на рівні пікселів, більш повне покриття SVG-шляхів за потреби, автоматичну установку/виявлення рендерерів лише тоді, коли це можливо залишити факультативним, а також автоматизовану виконання ремонту зі збереженням топології |
| Інтеграція TikZJax | Кандидат на хост для рендерингу для відображення з боку Obsidian | Залишити це необов’язковим; не робити TikZJax обов’язковою залежністю під час виконання плагіну |
## Конфігурація
@ -361,6 +371,7 @@ npm run diagram:smoke-circuitikz -- --output-dir docs/export/circuitikz-smoke --
| `enableExperimentalDiagramPipeline` | `false` | Переключатися між підходом, орієнтованим на специфікацію, та старим підходом Mermaid |
| `experimentalDiagramCompatibilityMode` | `'legacy-mermaid'` | `'legacy-mermaid'` = Mermaid лише; `'best-fit'` = нативні цілі + резерви |
| `preferredDiagramIntent` | `undefined` (автоматично) | Перевизначити автоматичне виявлення наміру |
| `preferredDiagramRenderTarget` | `undefined` (автоматично) | Перевизначення рендерера артефактів, включаючи Draw.io, Drawnix та Circuitikz |
| `summarizeToMermaidLanguage` | `'en'` | Мова цілі для міток діаграми |
| `summarizeToMermaidProvider` / `Model` | DeepSeek | LLM на кожному завданні для генерації діаграми |
| `autoMermaidFixAfterGenerate` | (з констант) | Автоматично запустити старий фіксер на вихідних даних Mermaid |
@ -380,10 +391,11 @@ npm run diagram:smoke-circuitikz -- --output-dir docs/export/circuitikz-smoke --
| Дія | Метод |
|--------|--------|
| SVG export | Будівельник `mermaid.render()` / `vega.View.toSVG()` / SVG для Canvas |
| Експорт у форматі PNG | SVG → Image → Canvas (співвідношення пікселів пристрою 1x-3x) → PNG ArrayBuffer |
| Експорт у формат PNG | SVG → Зображення → Canvas / прев’ю-растеризатор за налаштованою щільністю пікселів → Буфер даних у форматі PNG |
| Експорт у формат PDF | SVG → растрове зображення за налаштованою щільністю пікселів → односторінковий PDF |
| Збереження вихідного коду | Контент сирого артефакту зберігається з розширенням, характерним для цільової системи |
| Попередній перегляд лише вихідного коду | Нелінійні артефакти з вмістом вихідного коду відображаються у вигляді коду разом із діагностикою, без відтворення iframe |
| Семантичний аудит | Mermaid, JSON Canvas, Vega-Lite та редагований HTML/SVG перевірений `scripts/diagram-semantic-verification.js` |
| Семантичний аудит | Mermaid, JSON Canvas, Vega-Lite, редаговуваний HTML/SVG, Draw.io, Drawnix та обмежений Circuitikz перевіряються за допомогою `scripts/diagram-semantic-verification.js` разом із тестами рендерера та CLI |
**Кешування**: RenderCache використовує детермінований ключ JSON від `{spec, target, theme}`. Видалення дублікатів під час обробки запобігає багаторазовому генеруванню.

View file

@ -1,7 +1,7 @@
---
id: diagrams
title: "Sơ đồ"
description: "Tạo ra Mermaid, JSON Canvas, Vega-Lite, HTML, các tài liệu hình ảnh có thể chỉnh sửa, và các sơ đồ circuitikz bị giới hạn trong tương lai từ ghi chú của bạn bằng cách sử dụng kiến trúc dựa trên mô tả trước"
description: "Tạo ra các đồ thị Mermaid, JSON Canvas, Vega-Lite, HTML, các tệp đồ họa có thể chỉnh sửa, Draw.io, Drawnix, cùng các sơ đồ circuitikz có giới hạn dựa trên ghi chú của bạn thông qua kiến trúc lấy mô tả làm ưu tiên"
author:
'@id': 'https://jacobinwwey.github.io/obsidian-NotEMD/#person-jacobinwwey'
keywords: [diagrams, mermaid, vega-lite, canvas, visualization, spec-first, drawio, drawnix, editable svg, circuitikz, TikZJax]
@ -18,7 +18,7 @@ import TLDR from '@site/src/components/TLDR';
# Sơ đồ
<TLDR>
**Notemd tạo sơ đồ từ ghi chú của bạn thông qua quy trình dựa trên mô tả trước.** LLM tạo ra một định dạng `DiagramSpec` JSON không phụ thuộc vào công cụ hiển thị, sau đó các bộ chuyển đổi chuyên dụng chuyển nó thành Mermaid, JSON Canvas, Vega-Lite, HTML, hoặc đầu ra HTML/SVG có thể chỉnh sửa. Hỗ trợ 8 loại mục đích, chuỗi sao lưu tự động, xem trước trực tiếp kèm xuất ra SVG/PNG, kiểm tra ngữ nghĩa, và tạo ra nội dung với việc bổ sung kiến thức cục bộ.
**Notemd tạo ra các đồ thị từ ghi chú của bạn bằng cách sử dụng quy trình lấy mô tả làm ưu tiên.** Mô hình LLM tạo ra một tệp JSON `DiagramSpec` không phụ thuộc vào công cụ hiển thị, sau đó các bộ chuyển đổi chuyên dụng sẽ chuyển đổi nó thành định dạng Mermaid, JSON Canvas, Vega-Lite, HTML, HTML/SVG có thể chỉnh sửa, Draw.io, Drawnix, hoặc các sơ đồ circuitikz có giới hạn. Hỗ trợ 9 loại mục đích sử dụng, các chuỗi phản hồi tự động, xem trước trực tiếp kèm khả năng xuất ra SVG/PNG/PDF, kiểm tra ngữ nghĩa, và khả năng tạo nội dung được tăng cường bằng kiến thức địa phương.
</TLDR>
Đây là một phần của [Obsidian Hướng dẫn Quản lý Kiến thức AI](/docs/pillar-ai-knowledge).
@ -54,6 +54,7 @@ graph LR
| `stateDiagram` | Mermaid | HTML | Máy trạng thái, mô hình vòng đời |
| `canvasMap` | JSON Canvas | Mermaid → HTML | Bản đồ khái niệm, đồ thị kiến thức |
| `dataChart` | Vega-Lite | Mermaid → HTML | Biểu đồ thanh, biểu đồ đường, biểu đồ diện tích, biểu đồ rải rác, biểu đồ tròn, bảng |
| `circuit` | circuitikz | none | Các sơ đồ mạch có giới hạn được tạo từ các dữ liệu `CircuitSpec` đã được xác thực |
## Nhận diện ý định
@ -67,6 +68,7 @@ Notemd suy luận loại sơ đồ tốt nhất từ nội dung ghi chú của b
| `stateDiagram` | Trạng thái, chuyển tiếp, chờ xử lý, đang chạy, thất bại (3+ trùng khớp) | 0.76 |
| `flowchart` | Các bước được đánh số (2+) hoặc từ vựng liên quan đến if/then/else/workflow | 0.74 |
| `canvasMap` | Bản đồ khái niệm, đồ thị kiến thức, không gian, nhóm | 0.72 |
| `circuit` | circuitikz, TikZJax, circuit, schematic, CMOS, NMOS, PMOS, MOSFET, VDD/GND, `vin`/`vout` | 0.78 |
| `mindmap` | Giá trị mặc định dự phòng | 0.55 |
Thay thế bằng thiết lập **Loại sơ đồ ưu tiên**, bộ lọc thanh bên, hoặc tùy chọn bảng lệnh cụ thể.
@ -80,10 +82,9 @@ Quy trình thử nghiệm dựa trên tiêu chuẩn hiện có hai bộ điều
| Loại sơ đồ ưu tiên | `preferredDiagramIntent` | Định hướng hình dạng ngữ nghĩa của `DiagramSpec` được tạo ra |
| Mục tiêu hiển thị ưu tiên | `preferredDiagramRenderTarget` | Chọn trình hiển thị tài liệu cho các lệnh **Tạo sơ đồ** và **Xem trước sơ đồ** |
Đặt **Mục tiêu hiển thị ưu tiên** thành **Tự động** làm giá trị mặc định cho công cụ lập kế hoạch, hoặc chọn Mermaid, JSON Canvas, Vega-Lite, HTML, hoặc HTML/SVG có thể chỉnh sửa một cách rõ ràng. Việc thay thế này chỉ áp dụng cho các lệnh tạo tài liệu và xem trước. Lệnh tiêu chuẩn **Tóm tắt thành sơ đồ Mermaid** vẫn được giữ nguyên để tương thích với đầu ra Mermaid, nhằm tránh việc các quy trình Markdown hiện có tự động chuyển đổi định dạng.
Sự phân chia này rất quan trọng vì một ý định `flowchart` giờ đây có thể được hiển thị dưới dạng Mermaid cho ghi chú Markdown, HTML cho giá trị dự phòng vững chắc, hoặc HTML/SVG có thể chỉnh sửa cho việc biên tập sau này. Draw.io và Drawnix vẫn là các công cụ xuất tài liệu CLI chứ không phải là mục tiêu hiển thị bên trong plugin.
Hãy đặt **Preferred render target** thành **Auto** để sử dụng giá trị mặc định của bộ lập kế hoạch, hoặc hãy chọn rõ ràng giữa Mermaid, JSON Canvas, Vega-Lite, HTML, Editable HTML/SVG, Draw.io, Drawnix, hoặc Circuitikz. Việc thay đổi này chỉ áp dụng cho các lệnh tạo tệp đồ họa và xem trước. Lệnh tiêu chuẩn **Summarise as Mermaid diagram** vẫn sẽ luôn tạo ra đầu ra tương thích với Mermaid để đảm bảo các quy trình làm việc dựa trên Markdown hiện có không bị chuyển đổi định dạng một cách lặng lẽ.
Sự phân biệt này rất quan trọng vì giờ đây mục đích sử dụng `flowchart` có thể được hiển thị dưới dạng Mermaid cho các ghi chú Markdown, dạng HTML để sử dụng làm giải pháp dự phòng vững chắc, dạng Editable HTML/SVG để chỉnh sửa sau này, hoặc dưới dạng các tệp nguồn Draw.io/Drawnix kèm theo các hình ảnh SVG để xem xét. Mục đích sử dụng `circuit` sẽ được chuyển hướng đến Circuitikz và yêu cầu phải có một tệp `CircuitSpec` đã được xác thực; đây không phải là yêu cầu tạo văn bản TikZ tùy ý.
## Cách sử dụng
### Tạo sơ đồ
@ -101,16 +102,21 @@ Sự phân chia này rất quan trọng vì một ý định `flowchart` giờ
| Vega-Lite | `.json` | `{note}_diagram.json` |
| HTML | `.html` | `{note}_diagram.html` |
| Có thể chỉnh sửa HTML/SVG | `.html` | `{note}_diagram.html` |
| Draw.io | `.drawio` + `.drawio.svg` + `.drawio.md` | `{note}_diagram.drawio` cùng các tệp hỗ trợ dùng để xem xét |
| Drawnix | `.drawnix` + `.drawnix.svg` + `.drawnix.md` | `{note}_diagram.drawnix` cùng các tệp hỗ trợ dùng để xem xét |
| Circuitikz | `.tex` + `.tex.svg` + `.tex.md` | `{note}_diagram.tex` cùng các tệp hỗ trợ dùng để xem xét |
### Xem trước sơ đồ
1. Chạy **"Notemd: Xem trước sơ đồ"**
2. Một cửa sổ modal hiển thị sơ đồ đã được vẽ
3. Xuất dưới dạng SVG hoặc PNG bằng các nút trên thanh công cụ
3. Sử dụng các nút trên thanh công cụ để xuất ra dưới dạng SVG, PNG, hoặc PDF
Tính năng **Mở xem trước tự động** có sẵn trong cài đặt — sau khi tạo, cửa sổ modal xem trước sẽ mở tự động.
Cửa sổ modal xem trước cũng có bảng chẩn đoán lỗi. Các công cụ vẽ và kiểm tra smoke có thể gắn `RenderArtifact.diagnostics`; cửa sổ hiển thị tóm tắt chẩn đoán với số lượng lỗi/cảnh báo/thông báo, sau đó là mức độ nghiêm trọng, loại chẩn đoán, thông điệp và gợi ý sửa chữa bên cạnh phần xem trước. Cùng một tóm tắt được hiển thị trong các mục lịch sử xem trước, vì vậy có thể so sánh các lần thử nghiệm smoke circuitikz lặp lại mà không cần mở từng mục. Đối với các tài liệu có nội dung nguồn nhưng không thể được vẽ trực tiếp hoặc qua đường dẫn iframe HTML, cửa sổ modal hiện chuyển sang xem trước chỉ dựa trên nguồn thay vì ép buộc sử dụng iframe trống. Điều này giúp các kiểm tra compile/render smoke của circuitikz, kiểm tra token văn bản của SVG, kiểm tra ảnh chụp màn hình trống PNG và các báo cáo chồng chéo trong tương lai có một giao diện UI rõ ràng mà không làm cho TikZJax hoặc LaTeX trở thành phụ thuộc bắt buộc về thời gian chạy plugin hay giả vờ rằng văn bản nguồn đã được hiển thị dưới dạng hình ảnh đã được xác minh.
Việc xuất file xem trước dạng PNG và PDF sẽ sử dụng độ phân giải màn hình (PPI) đã được cấu hình. Giá trị mặc định là 300 PPI và các giá trị lớn hơn 600 PPI sẽ bị giới hạn ở mức 600. SVG vẫn giữ nguyên kích thước vector. Các tệp nguồn như `.drawio`, `.drawnix`, và `.tex` có thể cung cấp một tệp phụ `previewSvg` để Obsidian có thể hiển thị và xuất các hình ảnh có thể xem xét mà không cần nhúng circuit.net, Drawnix, LaTeX, hoặc TikZJax vào môi trường chạy của plugin.
Modal xem trước cũng có một bảng điều khiển chẩn đoán các lỗi tạo ra artifact. Các công cụ render và bài kiểm tra smoke check có thể gắn thông tin `RenderArtifact.diagnostics`; modal sẽ hiển thị tóm tắt các thông báo lỗi, cảnh báo và thông tin, kèm theo mức độ nghiêm trọng, loại chẩn đoán, nội dung thông báo và gợi ý sửa chữa ngay bên cạnh phần xem trước. Tóm tắt tương tự cũng được hiển thị trong các mục lịch sử hỗ trợ chẩn đoán, vì vậy người dùng có thể so sánh các lần thử nghiệm smoke check với circuitikz mà không cần mở từng mục riêng lẻ. Đối với những artifact có nội dung nguồn nhưng không thể được render trực tiếp hoặc qua đường dẫn iframe HTML, modal hiện sẽ chuyển sang phương thức xem trước chỉ dựa trên nội dung nguồn thay vì ép buộc sử dụng một iframe trống. Điều này giúp các bài kiểm tra compile/render của circuitikz, kiểm tra ký tự văn bản trong SVG, kiểm tra ảnh chụp màn hình trống của PNG, báo cáo chồng chéo ký tự chỉ dựa trên đường dẫn, cùng các báo cáo chồng chéo trong tương lai có thể được hiển thị rõ ràng trên giao diện người dùng, mà không làm cho TikZJax hay LaTeX trở thành yêu cầu bắt buộc về mặt thời gian chạy plugin, cũng như không giả vờ rằng văn bản nguồn đã được render thành hình ảnh xác thực.
### Chế độ Mermaid cũ
@ -164,12 +170,12 @@ Mục tiêu này cố ý chưa phải là lộ trình lập kế hoạch mặc
### Draw.io và Drawnix Biên giới xuất
Triển khai hiện tại giữ lại sự hỗ trợ từ các trình soạn thảo bên thứ ba ở ranh giới sản phẩm:
Phiên bản triển khai hiện tại vẫn duy trì việc hỗ trợ các trình soạn thảo bên thứ ba ở ranh giới của tệp kết quả, đồng thời vẫn cung cấp các mục tiêu hiển thị rõ ràng:
| Mục tiêu | Hợp đồng | Phụ thuộc thời gian chạy |
|--------|----------|--------------------|
| Draw.io | `mxfile` XML không nén xác định từ `SemanticFigureModel` | không có gì trong thời gian chạy plugin hoặc CI |
| Drawnix | tập hợp nhỏ `.drawnix` JSON sử dụng các yếu tố `geometry` và `arrow-line` | không có gì trong thời gian chạy plugin hoặc CI |
| Draw.io | XML `mxfile` được nén gỡ bỏ tính ngẫu nhiên có thể dự đoán được từ `SemanticFigureModel`, cùng với các tệp bản xem xét dạng SVG/PNG/PDF | Không có gì trong môi trường chạy plugin hay quy trình CI |
| Drawnix | Tập hợp JSON `.drawnix` tối giản sử dụng các phần tử `geometry` và `arrow-line`, cùng với các tệp bản xem xét dạng SVG/PNG/PDF | Không có gì trong môi trường chạy plugin hay quy trình CI |
Sự đánh đổi này là cố ý: Notemd có thể kiểm tra các nhãn hiển thị, các ID ổn định và mức độ bao phủ các kiểu dữ liệu cơ bản được hỗ trợ mà không cần nhúng Diagram.net Desktop, Drawnix, Plait hoặc trạng thái trình soạn thảo chỉ dành cho trình duyệt vào plugin.
@ -213,7 +219,11 @@ Notemd hiện đã bao gồm mẫu nguyên mẫu kho lưu trữ có ràng buộc
npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-inverter.tex
```
Phiên bản nguyên mẫu thêm một rào cản `CircuitSpec` riêng biệt và bộ xuất dữ liệu có tính xác định cho sáu nhóm tài liệu tham chiếu vàng:
Mẫu nguyên mẫu này thêm vào một ranh giới `CircuitSpec` có các ràng buộc và bộ xuất dữ liệu có thể dự đoán được cho sáu nhóm mẫu chuẩn vàng:
Trong pipeline vẽ sơ đồ thí nghiệm này, người dùng giờ đây cũng có thể truy cập vào chức năng này thông qua `intent: "circuit"` và mục tiêu hiển thị `circuitikz`. Tệp `DiagramSpec` được tạo ra chỉ có thể chứa phần `circuitSpec` khi mục đích là vẽ sơ đồ mạch. `CircuitikzRenderer` sẽ viết mã nguồn `.tex` có tính ngẫu nhiên tương tự và gắn kèm một tệp xem trước dạng SVG được tạo ra từ cấu trúc mạch đã được xác thực, giúp hỗ trợ xem trước trong Obsidian cùng với việc xuất ra định dạng SVG/PNG/PDF. Tệp xem trước này không phải là kết quả biên dịch LaTeX/TikZJax; bằng chứng thực tế từ bộ hiển thị vẫn thuộc về các lệnh kiểm tra cụ thể được liệt kê bên dưới.
Đối với các mẫu chuẩn vàng được hỗ trợ, các thuộc tính `layoutHints.inputSide` và `layoutHints.outputSide` vẫn chỉ là những công cụ điều khiển dùng để trình bày. Chúng có thể di chuyển vị trí các cổng đầu vào/đầu ra một cách có thể dự đoán được, nhưng chúng không làm thay đổi thông tin ký hiệu về cấu trúc mạch và cũng không cho phép thực hiện các bước sửa chữa để điều chỉnh lại mạch.
| Loại mạch | Tài liệu tham khảo vàng | Bảo hành hiện tại |
|--------------|------------------|-------------------|
@ -224,7 +234,7 @@ Phiên bản nguyên mẫu thêm một rào cản `CircuitSpec` riêng biệt v
| `cmos-nand2` | `cmos-nand2-v1` | Kiểm tra xem có hoạt động bình thường không các mạch kéo lên loại PMOS song song, kéo xuống loại NMOS nối tiếp, hai đầu vào `va` / `vb`, và `vout` trước khi ghi vào LaTeX |
| `cmos-nor2` | `cmos-nor2-v1` | Kiểm tra xem có hoạt động bình thường không các mạch kéo lên loại PMOS, kéo xuống loại NMOS song song, hai đầu vào `va` / `vb`, và `vout` trước khi ghi vào LaTeX |
Đây vẫn chưa phải là công cụ tạo TikZ tổng quát. Nó không thể biên dịch LaTeX, gọi TikZJax, kiểm tra ảnh chụp màn hình, hay chạy chức năng sửa lỗi hình ảnh tự động. Những tính năng đó vẫn còn là những bước phát triển tiếp theo.
Đây không phải là công cụ tạo mã TikZ tổng quát. Nó không chấp nhận mã TikZ tùy ý, không biên dịch LaTeX, không gọi TikZJax, không kiểm tra hình ảnh trong môi trường chạy plugin, và cũng không thực hiện các bước sửa chữa tự động dựa trên phản hồi hình ảnh. Những chức năng đó vẫn được tích hợp ở các giai đoạn sau.
Lệnh Preview diagram có thể mở lại trực tiếp các tệp nguồn circuitikz đã lưu khi phần mở rộng tệp là `.tex` hoặc `.tikz` và nội dung tệp chứa `\usepackage{circuitikz}` hoặc `\begin{circuitikz}`. Con đường xử lý này là phiên xem trước chỉ dựa trên nguồn circuitikz: cửa sổ pop-up hiển thị nội dung nguồn, thông tin chẩn đoán, các nút sao chép/lưu, và siêu dữ liệu lịch sử, nhưng nó không biên dịch LaTeX hay gọi TikZJax trong thời gian chạy plugin.
@ -350,8 +360,8 @@ Con đường đó vẫn ghi lại các tệp artifact cố định của fixtur
|------|----------------|-----------|
| Sơ đồ tổng quát | Dòng công việc dựa trên thông số đã được triển khai cho Mermaid, JSON Canvas, Vega-Lite, HTML | Tiếp tục mở rộng phạm vi kiểm tra ngữ nghĩa |
| Hình ảnh có thể chỉnh sửa | Các ranh giới của `editable-html-svg`, Draw.io XML và Drawnix JSON đã được triển khai | Chỉ thêm các phần tử cơ bản phong phú hơn sau khi các bài kiểm tra chứng minh được khả năng chỉnh sửa |
| Hỗ trợ CLI | `npm run diagram:export-artifact` xuất các tệp HTML/SVG, Draw.io và Drawnix có thể chỉnh sửa từ một `DiagramSpec` | Thêm các thiết bị khói tùy chỉnh theo mục tiêu khi các mục tiêu mới được gửi đi |
| circuitikz | `CircuitSpec -> circuitikz` phiên bản nguyên mẫu xuất ra các mẫu vàng chung, bộ biến đổi CMOS, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1`, và `cmos-nor2` / `cmos-nor2-v1`, các dự án `layoutHints.inputSide` và `layoutHints.outputSide` vào vị trí cổng đầu vào/đầu ra xác định mà không thay đổi cấu trúc, từ chối sự lệch lạc cấu trúc thông qua `--topology-reference`, phát hành báo cáo sửa chữa giữ nguyên cấu trúc thông qua `--repair-brief-output` và mô hình `notemd.circuitikz.repair-brief.v1`, bao gồm nội dung chuyển giao có cấu trúc `repairPrompt` kèm theo `diagnosticFocus`, `acceptanceCriteria`, và vai trò `topology-preserving-circuitikz-repair`, xác thực các ứng viên sửa chữa thông qua `--repair-brief`, trả về bằng chứng cổng `repairAcceptance` thông qua mô hình `notemd.circuitikz.repair-acceptance.v1` kèm theo `readyForVisualAcceptance` và `remainingChecks`, lưu giữ bằng chứng đó thông qua `--repair-acceptance-output`, phân tích nhật ký biên dịch, có thể chạy các trình hiển thị cục bộ rõ ràng cùng với `--expected-artifact`, SVG `--expected-svg-text`, kiểm tra siêu dữ liệu khả năng truy cập thông qua `aria-label`, `<title>`, và `<desc>`, loại trừ các phần tử ẩn/đục, phân loại `render-svg-text-path-only` / `pathOnlyGlyphUseCount` cho các nhãn chỉ dựa trên đường dẫn, kiểm tra vị trí ký tự chỉ dựa trên đường dẫn cho `<use href="#...">`, chẩn đoán chồng chéo ký tự chỉ dựa trên đường dẫn thông qua `render-svg-path-glyph-overlap`, xử lý điểm dòng đóng cho `Z/z`, giới hạn đường cong chính xác cho các đầu mút đường cong A/a, giới hạn đường cong Bezier chính xác cho các đầu mút đường cong C/S/Q/T, kiểm tra chồng chéo nhãn và giới hạn dựa trên độ dày nét vẽ SVG, kiểm tra hình học vẽ `polyline` / `polygon`, hình học nhãn được đặt vị trí `tspan`, hình học văn bản được đặt vị trí nhạy `text-anchor`, hình học nhạy biến đổi cho SVG vùng hạn chế canvas/văn bản chồng chéo và khói nhãn so với vẽ thông qua `render-svg-label-overlap`, cùng với kiểm tra khói màn hình chụp PNG không trống/khớp/chất nền dày, bao gồm màu sắc chỉ mục với alpha, mẫu trong suốt grayscale/RGB tRNS, và hướng dẫn cụ thể theo định dạng `render-png-unsupported` cho PNG chồng lớp Adam7 và các lỗi độ sâu bit chỉ mục, thông qua `foregroundBounds`, `foregroundDensity`, `render-png-content-clipped`, và `render-png-foreground-dense` mà không cần phân tích shell, bao gồm các thiết bị khói duy trì tổng thể thông qua `npm run diagram:smoke-circuitikz`, ghi lại cấu hình trình hiển thị bị thiếu thông qua `rendererAvailability.status: "missing-configuration"` và `compile-executable-invalid`, và có các chẩn đoán xem trước tổng quát, số lượng tóm tắt chẩn đoán, các mục lịch sử nhạy chẩn đoán, và phương án dự phòng chỉ từ nguồn thông qua `RenderArtifact.diagnostics` và mô-đun xem trước | Thêm khả năng nhận diện nhãn ở mức OCR cho văn bản hình ảnh chỉ dựa trên đường dẫn, kiểm tra chồng chéo chính xác ở mức pixel, phạm vi đường dẫn SVG rộng hơn khi cần thiết, cài đặt/phát hiện trình hiển thị tự động chỉ khi nó vẫn có thể là tùy chọn, và thực thi sửa chữa giữ nguyên cấu trúc tự động |
| Hỗ trợ CLI | Lệnh `npm run diagram:export-artifact` sẽ xuất các tập tin HTML/SVG có thể chỉnh sửa, cùng với các bằng chứng dùng để xem xét dưới dạng Draw.io, Drawnix, Circuitikz, và SVG/PNG/PDF, từ một tệp `DiagramSpec` đã được xác thực | Thêm các bộ kiểm thử smoke riêng biệt cho từng mục tiêu khi các mục tiêu mới được phát hành |
| circuitikz | `DiagramSpec(intent: "circuit", circuitSpec) -> CircuitikzRenderer -> circuitikz` sẽ xuất các mẫu vàng dành cho các mạch nguồn chung, bộ inverter CMOS, `cmos-buffer` / `cmos-buffer-v1`, `cmos-transmission-gate` / `cmos-transmission-gate-v1`, `cmos-nand2` / `cmos-nand2-v1`, và `cmos-nor2` / `cmos-nor2-v1`, đồng thời hiển thị các tùy chọn về mục đích UI và mục tiêu hiển thị, ghi lại mã TeX cùng các tập tin xem trước dạng SVG/PNG/PDF, kiểm tra cấu trúc mạch trước khi xuất ra, phân tích nhật ký biên dịch, cho phép chạy các công cụ hiển thị địa phương cụ thể cùng tùy chọn `--expected-artifact`, và duy trì phương án dự phòng chỉ dựa trên mã nguồn cùng các thông tin chẩn đoán xem trước thông qua `RenderArtifact.diagnostics` và modal xem trước | Thêm khả năng nhận diện nhãn ở mức OCR cho văn bản hình ảnh chỉ gồm đường dẫn, các kiểm tra chồng lấp chính xác ở mức pixel, phạm vi bao phủ đường dẫn SVG rộng hơn khi cần thiết, việc cài đặt/phát hiện công cụ hiển thị tự động chỉ khi nó vẫn có thể được sử dụng một cách tùy chọn, và khả năng tự động sửa chữa để bảo toàn cấu trúc mạch |
| Sự tích hợp TikZJax | Máy chủ hiển thị ứng viên cho màn hình phía Obsidian | Giữ nó là tùy chọn; đừng biến TikZJax thành phụ thuộc thời gian chạy plugin bắt buộc |
## Cấu hình
@ -361,6 +371,7 @@ Con đường đó vẫn ghi lại các tệp artifact cố định của fixtur
| `enableExperimentalDiagramPipeline` | `false` | Chuyển đổi giữa phiên bản dựa trên tiêu chuẩn và phiên bản cũ Mermaid |
| `experimentalDiagramCompatibilityMode` | `'legacy-mermaid'` | `'legacy-mermaid'` = Mermaid thôi; `'best-fit'` = các mục tiêu gốc + các phương án dự phòng |
| `preferredDiagramIntent` | `undefined` (tự động) | Đặt lại việc phát hiện ý định tự động |
| `preferredDiagramRenderTarget` | `undefined` (tự động) | Đặt lại trình hiển thị tài liệu, bao gồm Draw.io, Drawnix và Circuitikz |
| `summarizeToMermaidLanguage` | `'en'` | Ngôn ngữ mục tiêu cho nhãn sơ đồ |
| `summarizeToMermaidProvider` / `Model` | DeepSeek | LLM theo từng nhiệm vụ để tạo sơ đồ |
| `autoMermaidFixAfterGenerate` | (từ các hằng số) | Chạy tự động công cụ sửa chữa cũ trên kết quả Mermaid |
@ -380,10 +391,11 @@ Khi được kích hoạt, Notemd sẽ lấy các đoạn nội dung bối cản
| Hành động | Phương thức |
|--------|--------|
| SVG export | `mermaid.render()` / `vega.View.toSVG()` / SVG builder for Canvas |
| Xuất dạng PNG | SVG → Image → Canvas (tỷ lệ pixel thiết bị 1x-3x) → PNG ArrayBuffer |
| Xuất sang PNG | SVG → Hình ảnh → Canvas / bộ chuyển đổi raster hóa theo PPI đã cấu hình → Mảng byte PNG |
| Xuất sang PDF | SVG → hình ảnh raster theo PPI đã cấu hình → tệp PDF một trang |
| Lưu nguồn | Nội dung tài liệu thô được lưu với phần mở rộng tương ứng với mục tiêu |
| Xem trước chỉ nguồn | Các tài liệu không nằm trong dòng mã sẽ được hiển thị dưới dạng mã cùng các thông tin chẩn đoán, không sử dụng iframe để hiển thị |
| Kiểm toán ngữ nghĩa | Mermaid, JSON Canvas, Vega-Lite, và HTML/SVG có thể chỉnh sửa được đã được `scripts/diagram-semantic-verification.js` kiểm tra |
| Kiểm toán ngữ nghĩa | Mermaid, JSON Canvas, Vega-Lite, HTML/SVG có thể chỉnh sửa, Draw.io, Drawnix và circuitikz có các ràng buộc sẽ được kiểm tra bởi `scripts/diagram-semantic-verification.js` cùng với các bài kiểm tra trình hiển thị và CLI |
**Lưu trữ đệm**: RenderCache sử dụng khóa JSON xác định rõ của `{spec, target, theme}`. Việc loại bỏ trùng lặp trong quá trình xử lý ngăn chặn việc tạo ra các kết quả hiển thị trùng lặp.

View file

@ -1,7 +1,7 @@
---
id: diagrams
title: 图表
description: 利用规范优先架构,根据笔记生成 Mermaid、JSON Canvas、Vega-Lite、HTML、可编辑图形 artifact、Draw.io、Drawnix以及受约束的 circuitikz 图表。
description: "通过以规范优先的架构,利用您的笔记生成 Mermaid、JSON Canvas、Vega-Lite、HTML、可编辑的图表文件、Draw.io、Drawnix 以及受限版的 circuitikz 图表。"
author:
'@id': 'https://jacobinwwey.github.io/obsidian-NotEMD/#person-jacobinwwey'
keywords: [diagrams, mermaid, vega-lite, canvas, visualization, spec-first, drawio, drawnix, editable svg, circuitikz, TikZJax]
@ -18,7 +18,7 @@ import TLDR from '@site/src/components/TLDR';
# 图表
<TLDR>
**Notemd** 通过规范优先流程根据您的笔记生成图表。LLM 会先创建与渲染器无关的 `DiagramSpec` JSON随后专门的适配器会将其转换为 Mermaid、JSON Canvas、Vega-Lite、HTML、可编辑 HTML/SVG、Draw.io、Drawnix或受约束的 circuitikz 输出。该工具支持 9 种意图类型、自动回退机制、带有 SVG/PNG/PDF 导出功能的实时预览、语义验证,以及基于本地知识的增强生成能。
**Notemd 通过基于规范的流程从您的笔记中生成图表。** LLM 会生成与具体渲染器无关的 `DiagramSpec` JSON随后专门的适配器会将该 JSON 转换为 Mermaid、JSON Canvas、Vega-Lite、HTML、可编辑的 HTML/SVG、Draw.io、Drawnix 或受限版的 circuitikz 输出格式。该工具支持 9 种不同的意图类型,具备自动回退机制、带有 SVG/PNG/PDF 导出功能的实时预览功能、语义验证功能,以及基于本地知识的增强生成能
</TLDR>
这是[Obsidian AI知识管理指南](/docs/pillar-ai-knowledge)的一部分。
@ -54,7 +54,7 @@ graph LR
| `stateDiagram` | Mermaid | HTML | 状态机、生命周期模型 |
| `canvasMap` | JSON Canvas | Mermaid → HTML | 概念图,知识图谱 |
| `dataChart` | Vega-Lite | Mermaid → HTML | 柱状图、折线图、面积图、散点图、饼图、表格 |
| `circuit` | circuitikz | 无 | 从已验证的 `CircuitSpec` payload 生成受约束电路图 |
| `circuit` | circuitikz | 无 | 基于经过验证的 `CircuitSpec` 数据生成的受限电路图 |
## 意图检测
@ -68,7 +68,7 @@ Notemd 会通过关键词评分从您的笔记内容中推断出最佳的图表
| `stateDiagram` | 状态、过渡、待处理、运行中、失败匹配3次及以上 | 0.76 |
| `flowchart` | 编号步骤2个以上或 if/then/else/工作流相关术语 | 0.74 |
| `canvasMap` | 概念图、知识图谱、空间结构、聚类 | 0.72 |
| `circuit` | circuitikz、TikZJax、电路、原理图、CMOS、NMOS、PMOS、MOSFET、VDD/GND、`vin`/`vout` | 0.78 |
| `circuit` | circuitikz, TikZJax, circuit, schematic, CMOS, NMOS, PMOS, MOSFET, VDD/GND, `vin`/`vout` | 0.78 |
| `mindmap` | 默认回退方案 | 0.55 |
可以使用**首选图表类型**设置、侧边栏选择器或明确的命令面板选项来覆盖它。
@ -82,10 +82,9 @@ Notemd 会通过关键词评分从您的笔记内容中推断出最佳的图表
| 首选的图表类型 | `preferredDiagramIntent` | 为生成的 `DiagramSpec` 指导语义结构 |
| 首选渲染目标 | `preferredDiagramRenderTarget` | 为“生成图表”和“预览图表”选择工件渲染器 |
将**首选渲染目标**设置为**自动**可使用规划器默认值;也可以显式选择 Mermaid、JSON Canvas、Vega-Lite、HTML、可编辑 HTML/SVG、Draw.io、Drawnix 或 Circuitikz。此覆盖设置仅适用于 artifact 生成与预览命令。标准的**汇总为 Mermaid 图表**命令仍会保持与 Mermaid 兼容的输出格式,从而避免现有 Markdown 工作流在后台自动切换格式。
这种区分很重要,因为 `flowchart` 意图现在可以渲染为用于 Markdown 笔记的 Mermaid、用于可靠备用的 HTML、用于后续编辑的可编辑 HTML/SVG或带 SVG 审查 companion 的 Draw.io/Drawnix 源 artifact。`circuit` 意图会路由到 Circuitikz并要求提供已验证的 `CircuitSpec`;它不是让模型自由输出任意 TikZ 文本。
若要使用默认规划策略,请将 **Preferred render target** 设置为 **Auto**;否则您可以明确选择 Mermaid、JSON Canvas、Vega-Lite、HTML、Editable HTML/SVG、Draw.io、Drawnix 或 Circuitikz。这些控件属于常规的图表设置和侧边栏控件而非开发者模式下的诊断工具。此类覆盖设置仅适用于生成图表文件及预览相关的命令。标准的 **Summarise as Mermaid diagram** 命令仍会固定为生成兼容 Mermaid 的输出,从而确保现有的 Markdown 工作流不会在后台悄悄更改格式。
这种区分非常重要,因为现在 `flowchart` 类型的意图既可以作为 Markdown 笔记的 Mermaid 格式输出,也可以作为稳健的回退选项生成 HTML或作为可后续编辑的 Editable HTML/SVG 格式输出,还可以生成附带 SVG 查看文件的 Draw.io/Drawnix 源文件。而 `circuit` 类型的意图则会路由至 Circuitikz并且需要符合规范的 `CircuitSpec`;它并非用于生成任意的 TikZ 文本。
## 使用方法
### 生成图表
@ -111,13 +110,13 @@ Notemd 会通过关键词评分从您的笔记内容中推断出最佳的图表
1. 运行 **“Notemd: 预览图表”**
2. 一个弹窗打开,显示已渲染的图表。
3. 使用工具栏按钮导出为 SVG、PNG 或 PDF 格式
3. 使用工具栏按钮将图表导出为 SVG、PNG 或 PDF 格式
在设置中可开启**自动打开预览**功能——生成完成后,预览弹窗会自动显示。
PNG 与 PDF 预览导出会使用配置的 preview PPI。默认值为 300 PPI超过 600 PPI 的值会被夹到 600。SVG 保持矢量尺寸。`.drawio`、`.drawnix` 与 `.tex` 等源 artifact 可以提供 `previewSvg` companion让 Obsidian 在不嵌入 diagrams.net、Drawnix、LaTeX 或 TikZJax 运行时的情况下显示并导出可审查图像。
预览模态框还包含一个缺陷诊断面板。渲染器和烟雾测试可以附加 `RenderArtifact.diagnostics`;该模态框会在预览旁边显示诊断摘要,包括错误/警告/信息数量,以及严重程度、诊断类型、消息和修复建议。同样的摘要也会显示在预览历史记录中,因此无需逐一查看每条记录即可对比重复的 circuitikz 烟雾测试结果。对于那些有源代码内容但无法通过内联方式或 HTML iframe 路径进行渲染的缺陷,该模态框现在会转而使用仅显示源代码的预览方式,而不会强制使用空 iframe。这样一来circuitikz 编译/渲染烟测试、SVG 文本标记检查、PNG 空白截图检查以及未来的重叠报告都能有可见的 UI 展示界面,同时无需让 TikZJax 或 LaTeX 成为必须的插件运行时依赖,也不会将源代码文本当作已验证的可视化渲染结果
预览模态框中也包含一个生成物诊断面板。渲染器与冒烟测试可以附加 `RenderArtifact.diagnostics` 数据;该模态框会在预览内容旁边显示诊断摘要,其中包括错误、警告和信息的数量,以及对应的严重程度、诊断类型、具体消息和修复建议。 在具备诊断功能的历史记录条目中也会显示相同的摘要,因此无需逐一打开每条记录,即可对比多次 circuitikz 冒烟测试的结果。 对于那些拥有源代码内容但无法通过内联方式或 HTML iframe 路径进行渲染的生成物,该模态框现在会退而使用仅显示源代码的预览方式,而不会强制使用空 iframe。这样一来circuitikz 编译/渲染烟测试、SVG 文本标记检查、PNG 空白截图检查、仅基于路径的符号重叠检测以及未来的各种重叠检测功能,都能拥有可视化的用户界面;同时也不必将 TikZJax 或 LaTeX 强制作为插件运行时的依赖项,也不用假装源代码文本已经经过了验证的可视化渲染
### 传统 Mermaid 模式
@ -171,12 +170,12 @@ PNG 与 PDF 预览导出会使用配置的 preview PPI。默认值为 300 PPI
### Draw.io 和 Drawnix 导出边界
当前实现仍然把第三方编辑器支持限制在 artifact 边界内,但已经暴露为显式渲染目标:
当前的实现方式将第三方编辑器的支持限制在输出文件的边界之内,同时仍会提供明确的渲染目标:
| 目标 | 合同 | 运行时依赖项 |
|--------|----------|--------------------|
| Draw.io | 来自 `SemanticFigureModel` 的确定性未压缩 `mxfile` XML并提供 SVG/PNG/PDF 审查 companion | 插件运行时或 CI 中均无。 |
| Drawnix | 使用 `geometry` 和 `arrow-line` 元素构成的最小 `.drawnix` JSON 子集,并提供 SVG/PNG/PDF 审查 companion | 插件运行时或 CI 中均无。 |
| Draw.io | 基于 `SemanticFigureModel` 生成的确定性、未压缩的 `mxfile` XML以及用于预览的 SVG/PNG/PDF 文件 | 在插件运行时或 CI 环境中均无相关支持 |
| Drawnix | 使用 `geometry` 和 `arrow-line` 元素构成的最小化 `.drawnix` JSON 子集,以及用于预览的 SVG/PNG/PDF 文件 | 在插件运行时或 CI 环境中均无相关支持 |
这种权衡是经过刻意设计的Notemd能够验证可见标签、稳定标识以及受支持的原始数据覆盖情况而无需将 diagrams.net Desktop、Drawnix、Plait 或仅适用于浏览器的编辑器状态嵌入到插件中。
@ -220,11 +219,11 @@ Notemd 现已包含该方向首个受限仓库原型。它被刻意设置为离
npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-inverter.tex
```
该原型为六个 golden-reference family 添加了受约束的 `CircuitSpec` 边界以及确定性导出器
该原型引入了受限的 `CircuitSpec` 边界,并为六种标准参考电路类型提供了确定性的导出功能
在实验性图表流水线中,这条路径现在也可以通过 `intent: "circuit"` 与 `circuitikz` render target 触发。生成的 `DiagramSpec` 只有在 circuit intent 下才允许嵌入 `circuitSpec`。`CircuitikzRenderer` 会写出同一份确定性 `.tex` 源文件,并附加从已验证电路拓扑派生出的 SVG preview companion从而支持 Obsidian 预览以及 SVG/PNG/PDF 导出。该 companion 不是 LaTeX/TikZJax 编译结果;真实 renderer 证据仍属于下文显式 smoke 命令
在实验性的图表处理流程中,现在也可以通过 `intent: "circuit"` 及渲染目标 `circuitikz` 来实现该功能。仅为电路类意图生成的 `DiagramSpec` 文件才允许嵌入 `circuitSpec` 内容。`CircuitikzRenderer` 会生成相同的确定性 `.tex` 源代码,并附加一个基于经过验证的电路拓扑结构生成的 SVG 预览文件,从而实现 Obsidian 预览以及 SVG/PNG/PDF 格式的导出。该预览文件并非 LaTeX/TikZJax 的编译结果;真正的渲染结果仍由下文中明确的测试命令决定
对于已支持的 golden templates`layoutHints.inputSide` 与 `layoutHints.outputSide` 仍然只是展示层控制。它们可以移动确定性的输入/输出端口位置,但不会改变 topology signature也不能让 repair pass 重接电路。
对于受支持的标准模板而言,`layoutHints.inputSide` 和 `layoutHints.outputSide` 仅用于控制展示效果。它们可以调整输入/输出端点的位置,但不会改变电路的拓扑结构,也无法通过修复流程重新连接电路线路。
| 电路类型 | Golden reference | 当前保证 |
|--------------|------------------|-------------------|
@ -235,7 +234,7 @@ npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-in
| `cmos-nand2` | `cmos-nand2-v1` | 在写入 LaTeX 之前,会验证并联的 PMOS 上拉电阻、串联的 NMOS 下拉电阻、双输入 `va` / `vb` 以及 `vout` 的功能。 |
| `cmos-nor2` | `cmos-nor2-v1` | 在写入 LaTeX 之前,会验证串联 PMOS 上拉、并联 NMOS 下拉、双输入 `va` / `vb` 以及 `vout` 的功能。 |
不是通用 TikZ 生成器。它不接受任意 TikZ不会在插件运行时编译 LaTeX、调用 TikZJax、检查截图也不会执行自动图像反馈修复。这些仍然是后续 gate
并非通用的 TikZ 生成工具。它不支持接收任意的 TikZ 代码、编译 LaTeX、调用 TikZJax、在插件运行时查看截图也不支持自动执行基于图像反馈的修复操作。这些功能仍属于后续阶段才会实现的特性
当文件扩展名为 `.tex` 或 `.tikz`,且源代码包含 `\usepackage{circuitikz}` 或 `\begin{circuitikz}` 时Preview diagram 命令可以直接重新打开已保存的 circuitikz 源文件。这种预览方式属于仅显示源代码的 circuitikz 预览模式:弹窗会展示源代码、诊断信息、复制/保存控件以及历史记录元数据,但不会在插件运行时编译 LaTeX 代码或调用 TikZJax。
@ -361,8 +360,8 @@ npm run diagram:smoke-circuitikz -- --output-dir docs/export/circuitikz-smoke --
|------|----------------|-----------|
| 通用图表 | 已为 Mermaid、JSON Canvas、Vega-Lite、HTML 实现以规格优先的流水线 | 持续扩大语义验证的覆盖范围 |
| 可编辑的图表 | 已实现 `editable-html-svg`、Draw.io XML 以及 Drawnix JSON 的构件边界划分。 | 只有在测试证明可编辑之后,才添加更丰富的原始数据类型。 |
| CLI 支持功能 | `npm run diagram:export-artifact` 可以从一个已验证 `DiagramSpec` 导出可编辑 HTML/SVG、Draw.io、Drawnix、Circuitikz以及 SVG/PNG/PDF 审查证据 | 在新的目标版本发布时,添加针对该目标的 smoke fixture。 |
| circuitikz | `DiagramSpec(intent: "circuit", circuitSpec) -> CircuitikzRenderer -> circuitikz` 可导出 common-source、CMOS inverter、`cmos-buffer` / `cmos-buffer-v1`、`cmos-transmission-gate` / `cmos-transmission-gate-v1`、`cmos-nand2` / `cmos-nand2-v1` 和 `cmos-nor2` / `cmos-nor2-v1` golden templates已暴露 UI intent/render-target 选项;会写出 TeX 以及 SVG/PNG/PDF preview companion会在输出前验证拓扑可解析编译日志、运行显式本地 renderer 与 `--expected-artifact`;并通过 `RenderArtifact.diagnostics` 和预览模态框保持 source-only fallback 与预览诊断可见 | 为 path-only visual text 增加 OCR 级标签识别、精确像素级重叠检测,并在需要时扩展 SVG path 覆盖;只有在能保持可选性的前提下,才考虑自动安装/发现 renderer 和自动执行 topology-preserving repair。 |
| CLI 支持 | `npm run diagram:export-artifact` 可从已验证的 `DiagramSpec` 中导出可编辑的 HTML/SVG、Draw.io、Drawnix、Circuitikz 格式的文件,以及 SVG/PNG/PDF 格式的审查用证据 | 当有新的目标平台发布时,需添加针对该平台的基准测试用例 |
| circuitikz | `DiagramSpec(intent: "circuit", circuitSpec) -> CircuitikzRenderer -> circuitikz` 可导出常用源码、CMOS 反相器、`cmos-buffer` / `cmos-buffer-v1`、`cmos-transmission-gate` / `cmos-transmission-gate-v1`、`cmos-nand2` / `cmos-nand2-v1` 以及 `cmos-nor2` / `cmos-nor2-v1` 这些标准模板;无需开启开发者模式即可设置 UI 意图与渲染目标选项;同时生成 TeX 代码以及 SVG/PNG/PDF 格式的预览文件;在输出前会对电路拓扑结构进行验证,解析编译日志;支持运行指定的本地渲染器并使用 `--expected-artifact` 参数;此外还提供仅包含源码的备用方案,并可通过 `RenderArtifact.diagnostics` 以及预览模态框查看预览相关的诊断信息 | 将为仅有路径信息的视觉文本添加类似 OCR 的标签识别功能,实现精确的像素级重叠检测,在必要时扩展 SVG 路径的覆盖范围;仅在保持可选性的前提下自动安装或发现相应的渲染器;同时实现能够保留电路拓扑结构的自动修复功能 |
| TikZJax 集成 | 用于 Obsidian 端显示的候选渲染主机 | 保持其可选性,不要让 TikZJax 成为插件运行时的强制依赖项。 |
## 配置
@ -392,11 +391,11 @@ npm run diagram:smoke-circuitikz -- --output-dir docs/export/circuitikz-smoke --
| 操作 | 方法 |
|--------|--------|
| SVG export | Canvas 的 `mermaid.render()` / `vega.View.toSVG()` / SVG 构建工具 |
| 导出为 PNG 格式 | SVG → 图像 → Canvas / 按配置 PPI 的预览栅格化器 → PNG ArrayBuffer |
| 导出为 PDF 格式 | SVG → 按配置 PPI 栅格化图像 → 单页 PDF |
| PNG 导出 | SVG -> 图像 -> 在配置的 PPI 下通过光栅化引擎生成 Canvas / 预览图像 -> PNG 数组缓冲区 |
| PDF 导出 | SVG -> 在配置的 PPI 下转换为光栅图像 -> 单页 PDF |
| 源文件保存 | 原始工件内容已使用特定目标扩展名保存 |
| 仅源代码预览 | 非内联的工件,其源代码内容以代码形式显示并附带诊断信息,不会使用 iframe 渲染。 |
| 语义审计 | Mermaid、JSON Canvas、Vega-Lite、可编辑 HTML/SVG、Draw.io、Drawnix 与受约束 circuitikz 由 renderer/CLI tests 覆盖 |
| 语义审计 | 由 `scripts/diagram-semantic-verification.js` 以及渲染器/CLI 测试对 Mermaid、JSON Canvas、Vega-Lite、可编辑的 HTML/SVG、Draw.io、Drawnix 以及受限版本的 Circuitikz 进行检查 |
**缓存**RenderCache 使用 `{spec, target, theme}` 的确定性 JSON 键。传输过程中的去重功能可避免重复渲染。

View file

@ -1,7 +1,7 @@
---
id: diagrams
title: 圖表
description: 使用以規格為先的架構,根據您的筆記生成 Mermaid、JSON Canvas、Vega-Lite、HTML 等可編輯的圖表檔案,以及未來受限形式的 circuitikz 圖表。
description: "運用以規格為先的架構,從您的筆記中產生 Mermaid、JSON Canvas、Vega-Lite、HTML、可編輯的圖表檔案、Draw.io、Drawnix以及受限形式的 circuitikz 圖表。"
author:
'@id': 'https://jacobinwwey.github.io/obsidian-NotEMD/#person-jacobinwwey'
keywords: [diagrams, mermaid, vega-lite, canvas, visualization, spec-first, drawio, drawnix, editable svg, circuitikz, TikZJax]
@ -18,7 +18,7 @@ import TLDR from '@site/src/components/TLDR';
# 圖表
<TLDR>
**Notemd** 透過以規格為先的流程,從您的筆記中生成圖表。**LLM** 會產生一個與渲染器無關的 **`DiagramSpec`** **JSON**,接著專用的轉換器會將其轉換為 **Mermaid**、**JSON Canvas**、**Vega-Lite**、**HTML**,或是可編輯的 **HTML**/**SVG** 格式輸出。它支援 8 種意圖類型、自動回退機制、搭配 **SVG**/PNG 的即時預覽功能、語意驗證,以及以本地知識增強的生成方式
**Notemd 透過以規格為先的處理流程,從您的筆記中產生圖表。** LLM 會產生與渲染器無關的 `DiagramSpec` JSON之後再由專用的轉換器將其轉換為 Mermaid、JSON Canvas、Vega-Lite、HTML、可編輯的 HTML/SVG、Draw.io、Drawnix或是受限形式的 circuitikz 输出。該工具支援 9 種意圖類型、自動回退機制、具 SVG/PNG/PDF 匯出功能的即時預覽、語意驗證,以及可增強本地知識的生成功能
</TLDR>
這是[Obsidian AI知識管理指南](/docs/pillar-ai-knowledge)的一部分。
@ -54,6 +54,7 @@ graph LR
| `stateDiagram` | Mermaid | HTML | 狀態機、生命週期模型 |
| `canvasMap` | JSON Canvas | Mermaid → HTML | 概念圖、知識圖譜 |
| `dataChart` | Vega-Lite | Mermaid → HTML | 條形圖、折線圖、面積圖、散點圖、餅圖、表格 |
| `circuit` | circuitikz | none | 從經過驗證的 `CircuitSpec` 資料中產生的受限形式電路圖表 |
## 意圖偵測
@ -67,6 +68,7 @@ Notemd 會根據關鍵字分數,從您的筆記內容中判斷出最適合的
| `stateDiagram` | 狀態、轉換中、待處理、執行中、失敗3 次以上匹配) | 0.76 |
| `flowchart` | 編號步驟2+)或 if/then/else/工作流程相關術語 | 0.74 |
| `canvasMap` | 概念圖、知識圖譜、空間、群集 | 0.72 |
| `circuit` | circuitikz, TikZJax, circuit, schematic, CMOS, NMOS, PMOS, MOSFET, VDD/GND, `vin`/`vout` | 0.78 |
| `mindmap` | 預設的回退值 | 0.55 |
以**Preferred diagram type**設定、側邊欄選擇器,或明確的命令選單選項來覆寫。
@ -80,10 +82,9 @@ Notemd 會根據關鍵字分數,從您的筆記內容中判斷出最適合的
| 預設的圖表類型 | `preferredDiagramIntent` | 引導所產生之 `DiagramSpec` 的語意結構 |
| 預設的渲染目標 | `preferredDiagramRenderTarget` | 為 **Generate diagram** 與 **Preview diagram** 選擇工件渲染器 |
將規劃器的預設 **Preferred render target** 設定為 **Auto**,或明確選擇 Mermaid、JSON Canvas、Vega-Lite、HTML或是可編輯的 HTML/SVG。此覆寫僅適用於 artifact 與 preview 指令。標準的 **Summarise as Mermaid diagram** 指令仍會固定為與 Mermaid 相容的輸出格式,如此一來現有的 Markdown 工作流程就不會在不知情的情況下改變格式。
這種區分很重要,因為現在 `flowchart` 的意圖可以作為 Markdown 註釋時呈現為 Mermaid作為強大的備用方案時呈現為 HTML或作為可編輯的 HTML/SVG 以供後續編輯使用。而 Draw.io 和 Drawnix 仍屬於 CLI 的物件匯出工具,而非內建在插件中的呈現目標。
若要讓規劃器使用預設值,請將 **Preferred render target** 設定為 **Auto**;否則可明確選擇 Mermaid、JSON Canvas、Vega-Lite、HTML、Editable HTML/SVG、Draw.io、Drawnix 或 Circuitikz。這些控制項屬於一般的圖表設定與側邊欄控制而非開發者模式下的診斷功能。此覆寫僅適用於產生檔案及預覽相關的指令。標準的 **Summarise as Mermaid diagram** 指令仍會固定產生相容於 Mermaid 的輸出,如此就不會讓現有的 Markdown 工作流程在不知情的情況下改變格式。
這種區分非常重要,因為現在 `flowchart` 意圖可以根據不同的需求被渲染為適用於 Markdown 笔記的 Mermaid 格式、穩定的 HTML 格式、可供後續編輯的 Editable HTML/SVG 格式,或是搭配 SVG 回顧檔案的 Draw.io/Drawnix 源碼檔案。而 `circuit` 意圖則會傳送給 Circuitikz 並需要經過驗證的 `CircuitSpec`;它並非用於產生隨意的 TikZ 文本。
## 使用方式
### 產生圖表
@ -101,16 +102,21 @@ Notemd 會根據關鍵字分數,從您的筆記內容中判斷出最適合的
| Vega-Lite | `.json` | `{note}_diagram.json` |
| HTML | `.html` | `{note}_diagram.html` |
| 可編輯的 HTML/SVG | `.html` | `{note}_diagram.html` |
| Draw.io | `.drawio` + `.drawio.svg` + `.drawio.md` | `{note}_diagram.drawio` 以及相關的回顧檔案 |
| Drawnix | `.drawnix` + `.drawnix.svg` + `.drawnix.md` | `{note}_diagram.drawnix` 以及相關的回顧檔案 |
| Circuitikz | `.tex` + `.tex.svg` + `.tex.md` | `{note}_diagram.tex` 以及相關的回顧檔案 |
### 預覽圖表
1. 執行 **"Notemd: Preview diagram"**
2. 一個模態視窗會隨著渲染完成的圖表而開啟
3. 使用工具列按鈕將其匯出為 SVG 或 PNG 格式
3. 使用工具列按鈕將其匯出為 SVG、PNG 或 PDF 格式
在設定中可開啟**自動開啟預覽**功能——生成後,預覽視窗會自動顯示。
預覽模態視窗還包含一個錯誤診斷面板。渲染器與煙霧測試可以附加 `RenderArtifact.diagnostics`;該模態視窗會顯示診斷摘要,包括錯誤/警告/資訊的數量,以及嚴重性、診斷類型、訊息和修復建議,這些內容都位於預覽結果旁邊。相同的摘要也會出現在預覽歷史記錄中,因此不必打開每一條記錄,就能比較重複的 circuitikz 煙霧測試結果。對於那些有原始內容但無法以內聯方式或透過 HTML iframe 路徑進行渲染的錯誤,該模態視窗現在會改為僅顯示原始內容的預覽,而非強制使用空的 iframe。這樣一來 circuitikz 編譯/渲染煙霧測試、SVG 文本代碼檢查、PNG 空白截圖檢查,以及未來的重疊報告都能有可視化的 UI 顯示方式,同時不必讓 TikZJax 或 LaTeX 成為必須的插件運行時依賴,也不會將原始文字假裝成已經驗證過的視覺渲染結果。
PNG 與 PDF 的預覽匯出會使用所設定的預覽 PPI 值。預設值為 300 PPI而高於 600 PPI 的數值會被限制在 600。SVG 則維持向量尺寸。像 `.drawio`、`.drawnix` 和 `.tex` 這樣的原始檔案可以提供一個 `previewSvg` 回顧檔,如此 Obsidian 即可在不將 diagram.net、Drawnix、LaTeX 或 TikZJax 嵌入插件執行環境的情況下,顯示並匯出可供檢視的圖片。
預覽模視窗也包含一個產品瑕疵診斷面板。渲染工具與煙霧測試可以附加 `RenderArtifact.diagnostics`;該模視窗會在預覽旁顯示診斷摘要,列出自訂錯誤、警告及資訊的數量,接著是嚴重性等級、診斷類型、詳細訊息以及修復建議。 在具備診斷功能的歷史記錄中亦會顯示相同的摘要,因此無需逐一開啟每個記錄,即可比較多次執行的 circuitikz 煙霧測試結果。 對於那些雖有原始內容,卻無法以內嵌方式或透過 HTML iframe 路徑進行渲染的產品瑕疵,該模視窗現在會改為僅顯示原始內容的預覽,而非強制使用空的 iframe。如此一來circuitikz 的編譯/渲染煙霧測試、SVG 文字代碼檢查、PNG 空白螢幕截圖檢查、僅路徑的符號重疊報告,以及未來推出的各種重疊報告,都能有可視化的使用者介面,同時也不會將 TikZJax 或 LaTeX 轉變為必須的插件運行時依賴,或是假裝原始文字已經是經過驗證的視覺渲染結果。
### 舊版 Mermaid 模式
@ -164,12 +170,12 @@ Notemd 會根據關鍵字分數,從您的筆記內容中判斷出最適合的
### Draw.io 與 Drawnix 導出邊界
目前的實作將第三方編輯器支援限制在工件邊界上
目前的實作將第三方編輯器的支援限制在產品檔案的邊界內,同時仍會提供明確的渲染目標
| 目標 | 合約 | 執行時依賴項目 |
|--------|----------|--------------------|
| Draw.io | 來自 `SemanticFigureModel` 的決定性未壓縮 `mxfile` XML | 插件執行階段或 CI 中均無。 |
| Drawnix | 使用 `geometry` 與 `arrow-line` 元素所構成的最小 `.drawnix` JSON 子集 | 插件執行階段或 CI 中均無。 |
| Draw.io | 來自 `SemanticFigureModel` 的確定性、未壓縮的 `mxfile` XML以及用於 SVG/PNG/PDF 校驗的配套檔案 | 在插件執行階段或 CI 環境中均無相關內容 |
| Drawnix | 使用 `geometry` 與 `arrow-line` 元素所構成的最小化 `.drawnix` JSON 子集,以及用於 SVG/PNG/PDF 校驗的配套檔案 | 在插件執行階段或 CI 環境中均無相關內容 |
這種取捨是刻意為之的: Notemd 可以驗證可見的標籤、穩定的 ID 以及受支援的原始資料覆蓋率,而無需將 diagrams.net Desktop、Drawnix、Plait 或僅適用於瀏覽器的編輯器狀態嵌入到插件中。
@ -213,7 +219,11 @@ Notemd 現在已包含此方向的第一個受限儲存庫原型。它刻意設
npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-inverter.tex
```
該原型為六個黃金參考系列增加了獨立的 `CircuitSpec` 边界以及確定的導出機制:
此原型加入了一個受限制的 `CircuitSpec`邊界,並為六種黃金參考類別提供了確定性的匯出功能:
在這個實驗性的圖表處理流程中,現在也可以透過 `intent: "circuit"` 與渲染目標 `circuitikz` 來達成相同效果。所生成的 `DiagramSpec` 只有在處理電路相關的意圖時才會內嵌 `circuitSpec`。`CircuitikzRenderer` 會寫入相同的確定性 `.tex` 源碼,並附加一個根據經過驗證的電路拓撲所產生的 SVG 預覽檔案,從而實現在 Obsidian 中的預覽功能以及 SVG/PNG/PDF 的匯出。該預覽檔並非 LaTeX/TikZJax 的編譯結果;真正的渲染結果仍屬於下方那些明確指定的測試指令。
對於受支援的黃金模板而言,`layoutHints.inputSide` 與 `layoutHints.outputSide` 仍然僅用於展示目的。它們可以調整確定性的輸入/輸出端點位置,但無法改變拓撲結構的簽名,也不允許透過修復流程來重新連接電路。
| 電路類型 | 金色參考手冊 | 目前的保固期 |
|--------------|------------------|-------------------|
@ -224,7 +234,7 @@ npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-in
| `cmos-nand2` | `cmos-nand2-v1` | 在寫入 LaTeX 之前,會先驗證並聯的 PMOS 上拉電路、串聯的 NMOS 下拉電路、雙輸入 `va` / `vb`,以及 `vout`。 |
| `cmos-nor2` | `cmos-nor2-v1` | 在寫入 LaTeX 之前,會先驗證串聯式 PMOS 上拉、並聯式 NMOS 下拉、雙輸入 `va` / `vb` 以及 `vout` 的功能。 |
還不是通用的 TikZ 生成器。它無法編譯 LaTeX、呼叫 TikZJax、檢視螢幕截圖或執行自動化的圖像回饋修復功能。這些都還是後續需要實現的階段。
並非一個通用的 TikZ 產生器。它不接受任意的 TikZ 檔案、不會編譯 LaTeX、不會呼叫 TikZJax、不在插件執行階段檢視螢幕截圖也不會執行自動化的圖像回饋修復功能。這些功能都屬於後續的階段。
Preview diagram 指令在檔案副檔名為 `.tex` 或 `.tikz`,且原始碼包含 `\usepackage{circuitikz}` 或 `\begin{circuitikz}` 時,可直接重新開啟已儲存的 circuitikz 原始碼檔案。此方式屬於僅顯示原始碼的 circuitikz 預覽模式:視窗會顯示原始碼、診斷資訊、複製/儲存控制項以及歷史記錄元資料,但不會在插件執行期間編譯 LaTeX 或呼叫 TikZJax。
@ -350,8 +360,8 @@ npm run diagram:smoke-circuitikz -- --output-dir docs/export/circuitikz-smoke --
|------|----------------|-----------|
| 一般圖表 | 已為 Mermaid、JSON Canvas、Vega-Lite、HTML 實作以規格為優先的管道流程 | 持續擴展語意驗證的覆蓋範圍 |
| 可編輯的圖表 | 已實作 `editable-html-svg`、Draw.io XML 以及 Drawnix JSON 的工件邊界。 | 只有在測試證明可編輯之後,才加入更豐富的原始資料型態。 |
| CLI 支援 | `npm run diagram:export-artifact` 會從一個 `DiagramSpec` 導出可編輯的 HTML/SVG、Draw.io 與 Drawnix | 當新的目標版本發布時,加入針對該目標的煙霧裝置。 |
| circuitikz | `CircuitSpec -> circuitikz`原型會輸出通用來源、CMOS反相器、`cmos-buffer` / `cmos-buffer-v1`、`cmos-transmission-gate` / `cmos-transmission-gate-v1`、`cmos-nand2` / `cmos-nand2-v1`以及`cmos-nor2` / `cmos-nor2-v1`的黃金模板,將專案`layoutHints.inputSide`和`layoutHints.outputSide`以確定的輸入/輸出端口配置方式處理,且不會改變拓撲結構,透過`--topology-reference`排除拓撲結構的偏移問題,並透過`--repair-brief-output`與架構`notemd.circuitikz.repair-brief.v1`產生能保留拓撲結構的修復說明文件,其中包含帶有 `diagnosticFocus`、`acceptanceCriteria`以及角色 `topology-preserving-circuitikz-repair` 的結構化`repairPrompt`交接內容,透過`--repair-brief`驗證可用的修復方案,並透過架構`notemd.circuitikz.repair-acceptance.v1`搭配 `readyForVisualAcceptance`和`remainingChecks`回傳`repairAcceptance`的閘極相關證據,透過`--repair-acceptance-output`保存該等證據,能解析編譯日誌,可運行明確的本地渲染器以及 `--expected-artifact`、SVG `--expected-svg-text`,還能透過`aria-label`、`<title>`和`<desc>`進行無障礙元數據檢查,可排除隱藏/透明型SVG元素對僅包含路徑的標籤進行 `render-svg-text-path-only` / `pathOnlyGlyphUseCount`分類,針對`<use href="#...">`進行僅含路徑的圖形放置檢查,透過`render-svg-path-glyph-overlap`進行僅含路徑的圖形重疊診斷,為`Z/z`處理閉合路徑的電流點問題為A/a弧的極值確定精確的弧線範圍為C/S/Q/T曲線的極值確定精確的貝氏曲線範圍考慮筆觸寬度後進行SVG範圍及標籤重疊檢查進行`polyline` / `polygon`繪圖幾何形狀檢查,處理已定位的`tspan`標籤幾何形狀,考慮 `text-anchor`因素的已定位文字幾何形狀,為 SVG受限畫布/文字重疊以及標籤與繪圖內容的比對情況提供考慮變換因素的幾何形狀分析並進行PNG非空白/裁切/密集前景的截圖檢查,其中包含索引顏色調色板的透明度資料、灰階/RGB tRNS透明樣本以及針對Adam7交錯式PNG及索引位元深度故障的格式特定`render-png-unsupported`指引,透過`foregroundBounds`、`foregroundDensity`、`render-png-content-clipped`和`render-png-foreground-dense`實現此功能且無需進行殼層解析,還包含通用的維護人員測試用例,能記錄缺失的渲染器配置資訊,並具備通用預覽診斷功能、診斷摘要統計、考慮診斷結果的歷史記錄,以及透過`RenderArtifact.diagnostics`和預覽模式實現僅使用原始資料的備用方案。 | 為僅包含路徑的視覺文字添加 OCR 級別的標籤辨識功能,實現精確的像素級重疊檢查,在需要時擴大 SVG 路徑的覆蓋範圍;僅在仍可保持選用性的情況下自動安裝或偵測渲染器,並自動執行能保留拓撲結構的修復作業。 |
| CLI 支援 | `npm run diagram:export-artifact` 可從一個已驗證的 `DiagramSpec` 中匯出可編輯的 HTML/SVG、Draw.io、Drawnix、Circuitikz以及 SVG/PNG/PDF 格式的審核憑證 | 當有新的目標版本發布時,會新增針對該目標的測試用例 |
| circuitikz | `DiagramSpec(intent: "circuit", circuitSpec) -> CircuitikzRenderer -> circuitikz` 可匯出常用電路、CMOS 開關、`cmos-buffer` / `cmos-buffer-v1`、`cmos-transmission-gate` / `cmos-transmission-gate-v1`、`cmos-nand2` / `cmos-nand2-v1` 與 `cmos-nor2` / `cmos-nor2-v1` 的參考模板,且在不開啟開發者模式的前提下即可顯示 UI 意圖與渲染目標選項,同時會產生 TeX 代碼以及 SVG/PNG/PDF 格式的預覽檔案,在輸出前會先驗證電路拓撲結構、解析編譯日誌,能夠執行明確指定的本地渲染器並搭配 `--expected-artifact` 參數使用,此外還提供僅包含原始程式碼的備用方案,且可透過 `RenderArtifact.diagnostics` 與預覽模態視窗查看預覽相關的診斷資訊 | 將為僅包含路徑的視覺文字加入 OCR 級別的標籤辨識功能、更精確的像素級重疊檢查、在必要時擴大 SVG 路徑的覆蓋範圍,僅在仍可保持選用性的情況下才自動安裝或探索適用的渲染器,並實現自動化的、能保留拓撲結構的修復功能 |
| TikZJax 整合 | 用於 Obsidian 端顯示的候選渲染主機 | 保持其為選用項;不要讓 TikZJax 成為必須的插件運行時依賴。 |
## 設定
@ -361,6 +371,7 @@ npm run diagram:smoke-circuitikz -- --output-dir docs/export/circuitikz-smoke --
| `enableExperimentalDiagramPipeline` | `false` | 在以規格為先與舊版模式之間切換 Mermaid |
| `experimentalDiagramCompatibilityMode` | `'legacy-mermaid'` | `'legacy-mermaid'` 只能是 Mermaid`'best-fit'` 為原生目標加上備用選項 |
| `preferredDiagramIntent` | `undefined`(自動) | 覆寫自動意圖偵測功能 |
| `preferredDiagramRenderTarget` | `undefined` (自動) | 覆寫元件渲染器,包括 Draw.io、Drawnix 與 Circuitikz |
| `summarizeToMermaidLanguage` | `'en'` | 圖表標籤的目標語言 |
| `summarizeToMermaidProvider` / `Model` | DeepSeek | 每個任務的 LLM 用於圖表生成 |
| `autoMermaidFixAfterGenerate` | (來自常數) | 在 Mermaid 的輸出上自動執行舊版修復工具 |
@ -380,10 +391,11 @@ npm run diagram:smoke-circuitikz -- --output-dir docs/export/circuitikz-smoke --
| 動作 | 方法 |
|--------|--------|
| SVG export | Canvas 用 `mermaid.render()` / `vega.View.toSVG()` / SVG 构建工具 |
| PNG 實體化 | SVG → 圖像 → 畫布(裝置像素比 1x-3x→ PNG ArrayBuffer |
| PNG 導出 | SVG -> 圖像 -> 在設定的 PPI 下的 Canvas / 預覽光柵化處理器 -> PNG ArrayBuffer |
| PDF 導出 | SVG → 在設定的 PPI 下的光柵圖像 → 單頁 PDF |
| 儲存來源 | 以目標特定的副檔名儲存的原始工件內容 |
| 僅來源預覽 | 非內聯的工件,其原始內容以程式碼形式顯示並附上診斷資訊,且不會透過 iframe 來呈現 |
| 語意審計 | Mermaid、JSON Canvas、Vega-Lite以及可編輯的 HTML/SVG已由 `scripts/diagram-semantic-verification.js` 檢查過 |
| 意義審核 | 由 `scripts/diagram-semantic-verification.js` 以及渲染器/CLI 測試,對 Mermaid、JSON Canvas、Vega-Lite、可編輯的 HTML/SVG、Draw.io、Drawnix 與受限版的 Circuitikz 進行檢查 |
**快取**RenderCache 使用 `{spec, target, theme}` 的確定性 JSON 金鑰。在處理過程中的去重機制可避免重複產生渲染結果。

View file

@ -1,7 +1,7 @@
---
id: diagrams
title: "圖表"
description: "利用以規格為先的架構,根據您的筆記產生 Mermaid、JSON Canvas、Vega-Lite、HTML 等可編輯的圖表檔案,以及未來受限形式的 circuitikz 圖表。"
description: "運用以規格為先的架構,從您的筆記中產生 Mermaid、JSON Canvas、Vega-Lite、HTML、可編輯的圖表檔案、Draw.io、Drawnix以及受限形式的 circuitikz 圖表。"
author:
'@id': 'https://jacobinwwey.github.io/obsidian-NotEMD/#person-jacobinwwey'
keywords: [diagrams, mermaid, vega-lite, canvas, visualization, spec-first, drawio, drawnix, editable svg, circuitikz, TikZJax]
@ -18,7 +18,7 @@ import TLDR from '@site/src/components/TLDR';
# 圖表
<TLDR>
**Notemd** 可透過以規格為優先的流程,從您的筆記中生成圖表。**LLM** 會產生一種與渲染器無關的 `DiagramSpec` JSON接著再由專用的轉換器將其轉換為 Mermaid、JSON Canvas、Vega-Lite、HTML或是可編輯的 HTML/SVG 格式輸出。此功能支援 8 種意圖類型、自動備用流程、搭配 SVG/PNG 格式進行的即時預覽、語意驗證,以及可增強本地知識的生成功能。
**Notemd 透過以規格為先的處理流程,從您的筆記中產生圖表。** LLM 會產生一個與渲染器無關的 `DiagramSpec` JSON 檔,接著由專用的轉換介面將其轉換為 Mermaid、JSON Canvas、Vega-Lite、HTML、可編輯的 HTML/SVG、Draw.io、Drawnix或是受限形式的 circuitikz 输出。它支援 9 種不同的意圖類型、自動備用轉換流程、具 SVG/PNG/PDF 匯出功能的即時預覽、語意驗證,以及可增強本地知識的生成功能。
</TLDR>
這是[Obsidian AI知識管理指南](/docs/pillar-ai-knowledge)的一部分。
@ -54,6 +54,7 @@ graph LR
| `stateDiagram` | Mermaid | HTML | 狀態機、生命週期模型 |
| `canvasMap` | JSON Canvas | Mermaid → HTML | 概念圖、知識圖譜 |
| `dataChart` | Vega-Lite | Mermaid → HTML | 條形圖、折線圖、面積圖、散點圖、餅圖、表格 |
| `circuit` | circuitikz | none | 從經過驗證的 `CircuitSpec` 資料中產生的受限形式電路圖表 |
## 意圖偵測
@ -67,6 +68,7 @@ Notemd 會根據關鍵字分數,從您的筆記內容中判斷出最適合的
| `stateDiagram` | 狀態、轉換中、待處理、執行中、失敗3次以上匹配 | 0.76 |
| `flowchart` | 編號步驟2+)或 if/then/else/工作流程相關術語 | 0.74 |
| `canvasMap` | 概念圖、知識圖譜、空間、群集 | 0.72 |
| `circuit` | circuitikz, TikZJax, circuit, schematic, CMOS, NMOS, PMOS, MOSFET, VDD/GND, `vin`/`vout` | 0.78 |
| `mindmap` | 預設的回退值 | 0.55 |
以 **Preferred diagram type** 設定、側邊欄選擇器,或明確的指令選單選項來覆寫。
@ -80,10 +82,9 @@ Notemd 會根據關鍵字分數,從您的筆記內容中判斷出最適合的
| 預設的圖表類型 | `preferredDiagramIntent` | 引導所產生之 `DiagramSpec` 的語意結構 |
| 預設的渲染目標 | `preferredDiagramRenderTarget` | 為 **Generate diagram** 與 **Preview diagram** 選擇物件渲染器 |
將規劃器的預設 **Preferred render target** 設定為 **Auto**,或明確選擇 Mermaid、JSON Canvas、Vega-Lite、HTML或是可編輯的 HTML/SVG。此覆寫僅適用於 artifact 與 preview 指令。標準的 **Summarise as Mermaid diagram** 指令仍會固定為與 Mermaid 相容的輸出格式,如此一來現有的 Markdown 工作流程就不會在不知情的情況下改變格式。
這種區分很重要,因為現在 `flowchart` 的意圖可以轉換為 Markdown 註釋的 Mermaid、強大的備用方案的 HTML或是用於後續編輯的可編輯 HTML/SVG。而 Draw.io 和 Drawnix 仍屬於 CLI 的檔案匯出工具,而非內建插件的渲染目標。
若要讓規劃器使用預設值,請將 **Preferred render target** 設定為 **Auto**;否則可明確選擇 Mermaid、JSON Canvas、Vega-Lite、HTML、Editable HTML/SVG、Draw.io、Drawnix 或 Circuitikz。這些控制項屬於一般的圖表設定與側邊欄控制而非開發者模式下的診斷功能。此覆寫僅適用於產生檔案及預覽相關的指令。標準的 **Summarise as Mermaid diagram** 指令仍會固定產生相容於 Mermaid 的輸出,如此一來現有的 Markdown 工作流程就不會在不知情的情況下改變格式。
這種區分非常重要,因為現在 `flowchart` 意圖可以根據不同的需求被轉換為適用於 Markdown 笔記的 Mermaid 格式、穩定的備用格式 HTML、可供後續編輯的 Editable HTML/SVG或是搭配 SVG 回顧檔案的 Draw.io/Drawnix 源碼檔案。而 `circuit` 意圖則會傳送給 Circuitikz 處理,且必須提供經過驗證的 `CircuitSpec`;它並非用於產生隨意的 TikZ 文本。
## 使用說明
### 產生圖表
@ -101,16 +102,21 @@ Notemd 會根據關鍵字分數,從您的筆記內容中判斷出最適合的
| Vega-Lite | `.json` | `{note}_diagram.json` |
| HTML | `.html` | `{note}_diagram.html` |
| 可編輯的 HTML/SVG | `.html` | `{note}_diagram.html` |
| Draw.io | `.drawio` + `.drawio.svg` + `.drawio.md` | `{note}_diagram.drawio` 以及相關的回顧檔案 |
| Drawnix | `.drawnix` + `.drawnix.svg` + `.drawnix.md` | `{note}_diagram.drawnix` 以及相關的回顧檔案 |
| Circuitikz | `.tex` + `.tex.svg` + `.tex.md` | `{note}_diagram.tex` 以及相關的回顧檔案 |
### 預覽圖表
1. 執行 **"Notemd: Preview diagram"**
2. 一個模態視窗會隨著渲染完成的圖表而開啟
3. 使用工具列按鈕將其匯出為 SVG 或 PNG 格式
3. 使用工具列按鈕將其匯出為 SVG、PNG 或 PDF 格式
在設定中可開啟**自動開啟預覽**功能——生成完成後,預覽視窗會自動顯示。
預覽模視窗還設有瑕疵診斷面板。渲染器與煙霧測試可附加 `RenderArtifact.diagnostics`;該模視窗會在預覽旁顯示診斷摘要,包括錯誤/警告/資訊的數量,以及嚴重性、診斷類型、訊息和修復建議。相同的摘要也會出現在預覽歷史記錄中,如此便可在不逐一打開每個記錄的情況下,比較重複的 circuitikz 煙霧測試結果。對於有原始內容但無法以內嵌方式或透過 HTML iframe 路徑進行渲染的瑕疵,該模視窗現在會改為僅顯示原始內容的預覽,而非強制使用空的 iframe。這讓 circuitikz 編譯/渲染煙霧測試、SVG 文本代碼檢查、PNG 空白螢幕截圖檢查,以及未來的重疊報告都能有可視化的 UI 顯示方式,同時不必依賴 TikZJax 或 LaTeX 作為硬體式的插件運行時依賴,也不必假裝原始文字就是已驗證的視覺渲染結果。
PNG 與 PDF 的預覽匯出會使用所設定的預覽 PPI 值。預設值為 300 PPI而高於 600 PPI 的數值會被限制在 600。SVG 則維持向量尺寸。像 `.drawio`、`.drawnix` 和 `.tex` 這樣的原始檔案可以提供一個 `previewSvg` 回顧檔,如此 Obsidian 即可在不將 diagram.net、Drawnix、LaTeX 或 TikZJax 嵌入插件執行環境的情況下,顯示並匯出可供檢視的圖片。
預覽模視窗同樣配備了產品診斷面板。渲染工具與煙霧測試能夠附加 `RenderArtifact.diagnostics`;該模視窗會在預覽畫面旁顯示診斷摘要,內含錯誤、警告與資訊的數量,接著是嚴重性等級、診斷類型、詳細訊息以及修復建議。 在具備診斷功能的歷史記錄中亦會顯示相同的摘要,因此無需逐一開啟每個記錄,即可比較多次執行的 circuitikz 煙霧測試結果。 對於那些雖有原始內容,卻無法以內嵌方式或透過 HTML iframe 路徑進行渲染的產品,該模視窗現在會改用僅顯示原始內文的預覽方式,而非強制使用空的 iframe。如此一來circuitikz 的編譯/渲染煙霧測試、SVG 文字代碼檢查、PNG 空白螢幕截圖檢查、僅路徑的符號重疊報告,以及未來推出的各種重疊報告,都能有可視化的使用者介面,同時也不會將 TikZJax 或 LaTeX 轉變為必須的插件運行時依賴,或是假裝原始文字已經是經過驗證的視覺渲染結果。
### 舊版 Mermaid 模式
@ -164,12 +170,12 @@ Notemd 會根據關鍵字分數,從您的筆記內容中判斷出最適合的
### Draw.io 與 Drawnix 導出邊界
目前的實作將第三方編輯器支援限制在工件邊界上
目前的實作將第三方編輯器的支援限制在產品檔案的邊界內,同時仍會提供明確的渲染目標
| Target | 合約 | 執行時依賴項目 |
|--------|----------|--------------------|
| Draw.io | 決定性未壓縮的 `mxfile` XML來自 `SemanticFigureModel` | 插件執行階段或 CI 中均無。 |
| Drawnix | 使用 `geometry` 與 `arrow-line` 元素所構成的最小 `.drawnix` JSON 子集 | 插件執行階段或 CI 中均無。 |
| Draw.io | 來自 `SemanticFigureModel` 的確定性且未壓縮的 `mxfile` XML以及用於 SVG/PNG/PDF 校驗的配套檔案 | 在插件執行階段或 CI 環境中均無相關內容 |
| Drawnix | 使用 `geometry` 與 `arrow-line` 元素所構成的最小化 `.drawnix` JSON 子集,以及用於 SVG/PNG/PDF 校驗的配套檔案 | 在插件執行階段或 CI 環境中均無相關內容 |
這種取捨是經過刻意考量的: Notemd 可以驗證可見的標籤、穩定的 ID 以及受支援的原始碼覆蓋率,而無需將 diagrams.net Desktop、Drawnix、Plait 或僅適用於瀏覽器的編輯器狀態嵌入到外掛程式中。
@ -213,7 +219,11 @@ Notemd 現在已包含此方向的第一個受限儲存庫原型。它刻意設
npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-inverter.tex
```
此原型為六個黃金參考系列增加了獨立的 `CircuitSpec` 边界以及確定的匯出機制:
此原型加入了受限制的 `CircuitSpec`邊界,並為六種黃金參考類別提供了確定性的匯出功能:
在這個實驗性的圖表處理流程中,現在也可以透過 `intent: "circuit"` 與渲染目標 `circuitikz` 來達成相同效果。所生成的 `DiagramSpec` 只有在處理電路相關的意圖時,才會內嵌 `circuitSpec`。`CircuitikzRenderer` 會寫入相同的確定性 `.tex` 源碼,並附加一個根據經過驗證的電路拓撲所產生的 SVG 預覽檔案,如此即可實現在 Obsidian 中的預覽功能,同時也能匯出 SVG/PNG/PDF 格式。該預覽檔並非 LaTeX/TikZJax 的編譯結果;真正的渲染證據仍屬於下方那些明確指定的測試指令。
對於受支援的黃金範本而言,`layoutHints.inputSide` 與 `layoutHints.outputSide` 仍然僅用於展示目的。它們可以調整確定性的輸入/輸出端點位置,但無法改變拓撲結構的簽章,也不允許透過修復流程來重新連接電路。
| 電路類型 | 金色參考手冊 | 現行保固期間 |
|--------------|------------------|-------------------|
@ -224,7 +234,7 @@ npm run diagram:export-circuitikz -- --input cmos-inverter.json --output cmos-in
| `cmos-nand2` | `cmos-nand2-v1` | 在寫入 LaTeX 之前,會先驗證並聯的 PMOS 上拉電路、串聯的 NMOS 下拉電路、雙輸入 `va` / `vb`,以及 `vout`。 |
| `cmos-nor2` | `cmos-nor2-v1` | 在寫入 LaTeX 之前,會先驗證串聯式 PMOS 上拉、並聯式 NMOS 下拉、雙輸入 `va` / `vb` 以及 `vout` 的功能。 |
還不是通用的 TikZ 產生器。它無法編譯 LaTeX、呼叫 TikZJax、檢視螢幕截圖或執行自動化的圖片回饋修復功能。這些都還是後續要實現的階段
並非一個通用的 TikZ 產生器。它不接受任意的 TikZ 檔案、不會編譯 LaTeX、不會呼叫 TikZJax、不在插件執行階段檢視螢幕截圖也不會執行自動化的圖像回饋修復功能。這些功能都屬於後續的階段任務
Preview diagram 指令在檔案副檔名為 `.tex` 或 `.tikz`,且原始碼包含 `\usepackage{circuitikz}` 或 `\begin{circuitikz}` 時,可直接重新開啟已儲存的 circuitikz 原始碼檔案。此方式屬於僅顯示原始碼的 circuitikz 預覽模式:視窗會顯示原始碼、診斷資訊、複製/儲存控制項以及歷史記錄元資料,但不會在插件執行期間編譯 LaTeX 或呼叫 TikZJax。
@ -350,8 +360,8 @@ npm run diagram:smoke-circuitikz -- --output-dir docs/export/circuitikz-smoke --
|------|----------------|-----------|
| 一般圖表 | 已為 Mermaid、JSON Canvas、Vega-Lite、HTML 實作以規格優先的處理流程 | 持續擴大語意驗證的覆蓋範圍 |
| 可編輯的圖表 | 已實作 `editable-html-svg`、Draw.io XML 以及 Drawnix JSON 的工件邊界。 | 只有在測試證明可編輯之後,才加入更豐富的原始元素 |
| CLI 支援功能 | `npm run diagram:export-artifact` 會從一個 `DiagramSpec` 導出可編輯的 HTML/SVG、Draw.io 與 Drawnix | 當新的目標版本發布時,加入針對該目標的煙霧裝置。 |
| circuitikz | `CircuitSpec -> circuitikz` 原型會匯出 common-source、CMOS 非反相器、`cmos-buffer` / `cmos-buffer-v1`、`cmos-transmission-gate` / `cmos-transmission-gate-v1`、`cmos-nand2` / `cmos-nand2-v1` 以及 `cmos-nor2` / `cmos-nor2-v1` 這些金標準模板,並將專案 `layoutHints.inputSide` 與 `layoutHints.outputSide` 轉換為確定的輸入/輸出接點配置,且不會改變拓撲結構;透過 `--topology-reference` 拒絕因拓撲偏移而產生的修復需求,並透過 `--repair-brief-output` 與架構 `notemd.circuitikz.repair-brief.v1` 產生能保留拓撲結構的修復說明文件;其中還包含結構化的 `repairPrompt` 交接內容,並附有 `diagnosticFocus`、`acceptanceCriteria` 與角色 `topology-preserving-circuitikz-repair` 的相關資訊;透過 `--repair-brief` 驗證各個修復候選方案,並透過架構 `notemd.circuitikz.repair-acceptance.v1` 伴隨 `readyForVisualAcceptance` 與 `remainingChecks` 回傳 `repairAcceptance` 關於閘極的證據,且會透過 `--repair-acceptance-output` 保存該等證據;能解析編譯日誌,可執行明確的本機渲染器以及 `--expected-artifact`、SVG `--expected-svg-text`,並透過 `aria-label`、`<title>` 與 `<desc>` 進行無障礙性元資料檢查;可排除隱藏/透明型態的 SVG 元素,對僅包含路徑的標籤進行 `render-svg-text-path-only` / `pathOnlyGlyphUseCount` 分類,針對 `<use href="#...">` 進行僅含路徑的圖形放置檢查,透過 `render-svg-path-glyph-overlap` 進行僅含路徑的圖形重疊診斷,為 `Z/z` 處理閉合路徑的電流點問題,為 A/a 曲線的極值點確定精確的弧線範圍,為 C/S/Q/T 曲線的極值點確定精確的貝氏曲線範圍,進行考慮筆觸寬度的 SVG 範圍檢查以及標籤重疊檢查,進行 `polyline` / `polygon` 的繪圖幾何形狀檢查,處理已定位的 `tspan` 標籤幾何形狀,以及考慮 `text-anchor` 的已定位文字幾何形狀;還有為 SVG 有限範圍畫布/文字重疊以及標籤與繪圖之間的問題而設的、考慮變換效果的幾何形狀處理機制,並透過 `render-svg-label-overlap` 進行 PNG 非空白/裁切/密集前景的截圖檢查;其中還包含索引顏色調色板的透明度資料、灰階/RGB tRNS 透明樣本,以及針對 Adam7 交錯式 PNG 與索引位元深度故障所設的格式特定 `render-png-unsupported` 指引,且所有這些功能皆透過 `foregroundBounds`、`foregroundDensity`、`render-png-content-clipped` 與 `render-png-foreground-dense` 完成,無需進行殼層解析;此外還包含用於綜合測試的維護人員專用測試套件,透過 `npm run diagram:smoke-circuitikz` 記錄缺失的渲染器設定資訊,並透過 `rendererAvailability.status: "missing-configuration"` 與 `compile-executable-invalid` 進行相關記錄,同時還具備通用預覽診斷功能、診斷摘要統計數據、考慮診斷結果的歷史記錄,以及透過 `RenderArtifact.diagnostics` 與預覽模式實現的僅使用原始資料的備用方案。 | 為僅包含路徑的視覺文字加入 OCR 級別的標籤辨識功能,實現精確的像素級重疊檢查,在需要時擴大 SVG 路徑的覆蓋範圍;僅在仍可保持選用性的情況下自動安裝或偵測渲染器,並自動執行能保留拓撲結構的修復作業。 |
| CLI 支援 | `npm run diagram:export-artifact` 可從已驗證的 `DiagramSpec` 中匯出可編輯的 HTML/SVG、Draw.io、Drawnix、Circuitikz以及 SVG/PNG/PDF 格式的審核憑證 | 當有新的目標版本推出時,會新增針對該目標的測試用例 |
| circuitikz | `DiagramSpec(intent: "circuit", circuitSpec) -> CircuitikzRenderer -> circuitikz` 可匯出常用電路、CMOS 開關、`cmos-buffer` / `cmos-buffer-v1`、`cmos-transmission-gate` / `cmos-transmission-gate-v1`、`cmos-nand2` / `cmos-nand2-v1` 與 `cmos-nor2` / `cmos-nor2-v1` 的範本,且在不開啟開發者模式的前提下即可顯示 UI 意圖與渲染目標選項,同時會產生 TeX 代碼以及 SVG/PNG/PDF 格式的預覽檔案,在輸出前先驗證電路拓撲結構、解析編譯日誌,能夠執行明確指定的本機渲染器並搭配 `--expected-artifact` 參數使用,同時還保留僅含原始程式碼的備用方案,且可透過 `RenderArtifact.diagnostics` 與預覽視窗查看預覽相關的診斷資訊 | 將為僅包含路徑的視覺文字加入 OCR 級別的標籤辨識功能、更精確的像素級重疊檢查、在需要時擴大 SVG 路徑的覆蓋範圍,僅在仍可保持選用性的情況下才自動安裝或探索適用的渲染器,並實現自動化的、能保留拓撲結構的修復功能 |
| TikZJax 整合 | 用於 Obsidian 端顯示的候選渲染主機 | 保持其為選用項;不要讓 TikZJax 成為必須的插件運行時依賴項。 |
## 設定
@ -361,6 +371,7 @@ npm run diagram:smoke-circuitikz -- --output-dir docs/export/circuitikz-smoke --
| `enableExperimentalDiagramPipeline` | `false` | 在 spec-first 與 legacy Mermaid 之間切換 |
| `experimentalDiagramCompatibilityMode` | `'legacy-mermaid'` | `'legacy-mermaid'` 只能是 Mermaid`'best-fit'` 為原生目標加上備用選項 |
| `preferredDiagramIntent` | `undefined` (自動) | 覆寫自動意圖偵測功能 |
| `preferredDiagramRenderTarget` | `undefined` (自動) | 覆寫元件渲染器,包括 Draw.io、Drawnix 與 Circuitikz |
| `summarizeToMermaidLanguage` | `'en'` | 圖表標籤的目標語言 |
| `summarizeToMermaidProvider` / `Model` | DeepSeek | 每個任務的 LLM 用於圖表生成 |
| `autoMermaidFixAfterGenerate` | (來自常數) | 在 Mermaid 的輸出上自動執行舊版修復工具 |
@ -380,10 +391,11 @@ npm run diagram:smoke-circuitikz -- --output-dir docs/export/circuitikz-smoke --
| 動作 | 方法 |
|--------|--------|
| SVG export | Canvas 的 `mermaid.render()` / `vega.View.toSVG()` / SVG 建構工具 |
| PNG 實體化 | SVG → 圖像 → 畫布(裝置像素比 1x-3x→ PNG ArrayBuffer |
| PNG 導出 | SVG -> 圖像 -> 在設定的 PPI 下的 Canvas / 預覽光柵化處理器 -> PNG ArrayBuffer |
| PDF 導出 | SVG → 在設定的 PPI 下的光柵圖像 → 單頁 PDF |
| 來源儲存 | 以目標系統專用的副檔名儲存的原始工件內容 |
| 僅來源預覽 | 非內聯的物件,其原始內容以程式碼形式顯示並附上診斷資訊,且不會透過 iframe 來呈現 |
| 語意審計 | Mermaid、JSON Canvas、Vega-Lite以及可編輯的 HTML/SVG已由 `scripts/diagram-semantic-verification.js` 檢查過 |
| 意義審核 | 由 `scripts/diagram-semantic-verification.js` 以及渲染器/CLI 測試,對 Mermaid、JSON Canvas、Vega-Lite、可編輯的 HTML/SVG、Draw.io、Drawnix 與受限版的 Circuitikz 進行檢查 |
**快取**RenderCache 會使用 `{spec, target, theme}` 的確定性 JSON 金鑰。在處理過程中的去重機制可避免產生重複的渲染結果。

File diff suppressed because it is too large Load diff