GB 1526 Flowchart Designer

What problem it solves

Flowcharts are often drawn as ad hoc boxes: branches lack conditions, loops are shown with back arrows, and the same process becomes hard to maintain. For engineers preparing technical docs, reviews, or demo pages, the issue is not only whether it renders, but whether the result follows GB 1526-89 symbols and conventions and fits Mermaid, SVG, or HTML delivery.

How the skill works

The skill identifies the flowchart type and output format, then generates the diagram. It prefers Mermaid by default: graph TD or graph LR, node shapes defined on first use, branch edges labeled with |condition|, and start/end terminal nodes. For formal output, it produces SVG with terminal shapes, process rectangles, decision diamonds, data parallelograms, file symbols, connectors, and pre-defined process symbols, while controlling canvas width, spacing, colors, fonts, and arrow direction. HTML output embeds the SVG and adds hover and click highlighting. It also self-checks start/end nodes, branch labels, direction, dangling nodes, symbol scope, and text centering.

Boundaries and notes

It is suited for program, data, system, business, and resource flowcharts, especially when Chinese engineering docs need readable rendering or formal SVG output. It does not replace a modeling tool and cannot infer missing key logic. If inputs, outputs, branch conditions, or role swimlanes are absent, the user should supply them first. The output is engineering-oriented rather than decorative.