46 lines
1.2 KiB
Markdown
46 lines
1.2 KiB
Markdown
Create an interactive diagram for: {{title}}
|
|
|
|
## Diagram Type
|
|
{{diagramType}}
|
|
|
|
## Description
|
|
{{description}}
|
|
|
|
## Key Points
|
|
{{keyPoints}}
|
|
|
|
{{#if hasNodeCount}}
|
|
## Node Count Constraint
|
|
|
|
- Maximum node count: {{nodeCount}}
|
|
- When no prescribed node list is provided, the `widget-config.nodes` array MUST NOT contain more nodes than this limit.
|
|
- When prescribed nodes are provided, that list is authoritative.
|
|
{{/if}}
|
|
|
|
{{#if hasPrescribedNodes}}
|
|
## Prescribed Nodes
|
|
|
|
{{prescribedNodes}}
|
|
|
|
- Use every prescribed node exactly once.
|
|
- Preserve each node's `id`, `label`, `icon`, and `details` when present.
|
|
- Do not add, remove, or replace prescribed nodes.
|
|
- Derive hierarchy edges from `parentId` when it is present.
|
|
{{/if}}
|
|
|
|
## Language
|
|
{{languageDirective}}
|
|
|
|
---
|
|
|
|
Generate a complete HTML diagram with:
|
|
|
|
1. **SVG nodes** with icons, labels, and click-to-show details
|
|
2. **Edges with arrows** connecting nodes (calculate endpoints from node dimensions)
|
|
3. **Step-by-step reveal** (下一步/上一步)
|
|
4. **High contrast**: White nodes on dark background, light edge labels
|
|
5. **Mobile-friendly**: Collapsible sidebar, doesn't block diagram
|
|
6. **First node visible** on load
|
|
|
|
Embed config in `<script type="application/json" id="widget-config">`.
|