Pikchr
repository·master·Indexed 41 days ago
https://github.com/drhsqlite/pikchrA PIC-inspired markup language for generating diagrams in technical documentation, designed for embedding within Markdown fenced code blocks. It provides a text-based way to render SVG diagrams with support for box and circle objects, boundary points, and a C-API for integration into larger applications.
What's inside Pikchr
- Pikchr is a PIC-like markup language specifically designed for creating diagrams within technical documentation. It is intended to be embedded directly into fenced code blocks of Markdown (or other markup languages) to provide a convenient, text-based way to render diagrams.
Explore Pikchr integrations and ecosystem
masterPikchr is supported across various platforms and tools:
- Web/Online: Use the online editor to enter Pikchr text and see results immediately.
- Documentation Tools:
mdbook-pikchr: A pikchr-aware preprocessor for mdBook.pandoc: A Lua-based pikchr filter is available.kroki.io: Integrated into the Kroki diagram-rendering service.
- IDEs and Editors:
- IntelliJ-based IDEs: Support via IntelliPikchr.
- Obsidian: Support via Adamantine Pick.
- Runtimes:
- Go: gopikchr.
- Node.js: pikchr module.
- CLI: pikchr-cmd is a command-line preprocessor tool for use with any Markdown formatter.
Understand the purpose and scope of Pikchr
masterPikchr is a specialized tool for generating diagrams for technical documentation (such as Markdown). It uses a text-based, enduring language inspired by the [PIC] language from the 1980s, making it easy for humans to read and maintain in generic text editors.
Key Characteristics
- Cross-platform: Implemented in generic C code using only the standard C library.
- Simple Syntax: Designed to be well-defined and easy to learn.
- Enduring: The source text is intended to be readable and editable for the long term.
Use Cases and Limitations
- Use for: Technical diagrams that convey mathematical or logical truth in a dry, clear style.
- Do NOT use for:
- Marketing graphics (it is not designed for emotional or aesthetic appeal).
- Charts and graphs (it lacks specific extensions for this purpose).
- CAD/CAM images (it lacks pixel-perfect precision).
- Point-and-click diagramming (it is a text-based system, similar to how Markdown compares to MS-Word).
What is a place in Pikchr
masterA place is a specific, named point on an object. While a position refers to any arbitrary X,Y coordinate, a place is a predefined anchor point on an existing object (like a box, ellipse, or line).
You can refer to a place using several syntaxes:
object(refers to the center of the object)object.dot-edgename(e.g.,B.nfor the north point of objectB)edgename of object(e.g.,north of B)ORDINAL vertex of object(e.g.,1st vertex of B, used for line objects)
Most places lie on the object's boundary, but special places like
.centeror.care located in the middle. For line objects,.startand.endmay reside in the interior.Position text relative to specific line segments
masterBy default, text annotations are anchored to the center of an object's bounding box. For multi-segment lines (like complex arrows), this center might be far from the actual path.
To position text beside a specific segment of a multi-segment line, create an
invisibleline (line invis) that overlays that specific segment and attach the text to that invisible line instead.# Overlaying an invisible line to anchor text to a specific segment line invis from 2nd vertex of last arrow to 3rd vertex of last arrow \ "text" below alignedUnderstand the four core numeric properties in Pikchr
masterPikchr uses four primary numeric properties to control the size and appearance of objects. Most other property names are simply aliases for these four:
width(alias:wid): The horizontal size of most objects.height(alias:ht): The vertical size of most objects.radius(alias:rad): Used to set the size of circles, cylinders, files, and corner rounding.thickness: The width of lines used to draw objects.
Note:
diameteris an alias for twice theradius.Understand automatic layout and anchor points
masterIf you omit the
atattribute, Pikchr automatically positions the object using the rule:with .start at previous.end. (The first object in a script is positionedwith .c at (0,0)).Every object has 9 standard anchor points:
- Compass directions:
.n,.ne,.e,.se,.s,.sw,.w,.nw - Center:
.c
Additionally, every object has
.startand.endanchor points. The physical location of.startand.enddepends on the current layout direction:Layout Direction .start .end right.w.edown.n.sleft.e.wup.s.n- Compass directions:
How nested macros work in pikchr
masterPikchr supports nested macros up to a maximum depth (currently 10).
When passing arguments to a nested macro, you must follow one of two rules:
- Pass arbitrary text as arguments.
- Pass a single
$Nparameter.
You cannot mix arbitrary text and a
$Nparameter in the same argument list for a nested macro call.Use the `previous` qualifier for relative positioning
masterThe
previousqualifier allows you to refer to the most recently created object of the same type. This is useful for aligning objects or calculating dimensions relative to the last element added.Note: If you insert a new object of a different type between two objects,
previousstill refers to the last object of the same type. If you insert a new object of the same type,previouswill point to the new one. To avoid broken references when inserting objects, assign an explicit name to your objects and use that name instead ofprevious.Example:
box same width previous.e.x - C2.w.xuses the eastern edge (.e.x) of the previous box to calculate the new width.How .start and .end places behave with layout direction
masterThe specific locations of
.startand.enddepend on the object's layout direction. For block objects, the mapping is as follows:Layout Direction .start .end right .w.edown .n.sleft .e.wup .s.nFor line objects:
.startalways refers to the first vertex of the line..endis usually the last vertex. However, if theclosekeyword is used,.endbehaves like a block object's end point (e.g.,.ein 'right' direction) rather than the final vertex.
Use the 'behind' attribute to control drawing order
masterBy default, Pikchr draws objects in the order they appear in the input script. The
behindobject attribute allows you to override this behavior, causing the object currently being constructed to be drawn before the referenced object.This is particularly useful for creating background effects. For example, if you define your primary content boxes first and then define large background-colored boxes later in the script, you can use
behind [content_box]to ensure the background box is rendered underneath the content rather than covering it up.# Example pattern: box "Content" wid 100 ht 100 # This box will be drawn first because of the 'behind' attribute, # appearing underneath the "Content" box. box wid 150 ht 150 fill 0xcccccc behind "Content"Use different units for numeric literals
masterUnlike legacy PIC which uses only inches, Pikchr allows you to attach unit designators to numeric literals. This makes expressing distances more intuitive. Note that units must be attached directly to the number without whitespace (e.g.,
2.3cm, not2.3 cm). Internally, Pikchr still performs all calculations in inches.Supported units:
cm: centimetersin: inches (default)mm: millimeterspc: picaspt: pointspx: pixels
2.3cm