Diagrams(n)

📦
version 0.5 · 2 versions
, in fedora 43, fedora 44

🌸 NAME 🌸

Diagrams — the user documentation of the Diagrams package, straight outta the Tk Diagrams manual (section n, iykyk). 💅

✨ SYNOPSIS ✨

package require Tcl 8.4
package require Tk 8.4
package require Diagrams 0.2

::Diagrams::drawin canvas
::Diagrams::saveps filename
::Diagrams::direction newdir
::Diagrams::currentpos pos
::Diagrams::getpos anchor obj
::Diagrams::position xcoord ycoord
::Diagrams::box text width height
::Diagrams::plaintext text width height
::Diagrams::circle text radius
::Diagrams::slanted text width height angle
::Diagrams::diamond text width height
::Diagrams::drum text width height
::Diagrams::arrow text length heads
::Diagrams::line args
::Diagrams::attach anchor
::Diagrams::color name
::Diagrams::fillcolor name
::Diagrams::textcolor name
::Diagrams::usegap use
::Diagrams::xgap value
::Diagrams::ygap value
::Diagrams::textfont name
::Diagrams::linewidth pixels
::Diagrams::linestyle style
::Diagrams::pushstate
::Diagrams::popstate
::Diagrams::computepos
::Diagrams::boxcoords x1 y1 x2 y2
::Diagrams::moveobject obj

🦋 DESCRIPTION 🦋

So the Diagrams package is here to help you draw diagrams — flowcharts, that whole vibe. 🫶 And the philosophy is iconic: you should be focused on the content of your diagram, not on agonizing over where exactly every single thing sits and how big it is. The package handles the layout for you with a few simple rules:

  • Every item (or object) in the diagram has a bunch of "anchors" — spots where arrows and lines can hook up to it. Like little connection points. 🔗
  • You can draw an arrow or a line from an object in a preset direction. Easy.
  • Sizing and positioning should be as automatic as possible: you get this by, for example, drawing boxes and circles with text rather than first drawing a rectangle and then drawing the text inside it, or the other way around.

The commands in this package split up into several categories, and each category gets its own section below. No skipping, bestie. 💖

💫 GENERAL COMMANDS FOR POSITIONING AND SETUP 💫

::Diagrams::drawin canvas

Sets the canvas widget we're drawing in. This is the "where does everything go" command.

  • canvas (widget) — the widget to draw in.

::Diagrams::saveps filename

Saves the drawing out into a PostScript file. Very demure, very archival. 📄

  • filename (string) — the name of the file to save the drawing in.

::Diagrams::direction newdir

Sets the direction that the current position moves in. The direction is one of:

north northeast east southeast south southwest west northwest
N NE E SE S SW W NW
up up-right left down-right down down-left left up-left
centre center C
  • newdir (string) — the new direction.

::Diagrams::currentpos pos

Sets the current position explicitly. Heads up: the argument has to be a position "object". 🙈

  • pos (list) — the new position (you can grab one via getpos, for instance).

::Diagrams::getpos anchor obj

Gets the position of a particular "anchor" point of an object. The anchor should be one of the direction strings. 🎯

  • anchor (string) — the name of the anchor (one of the directions — see the direction command).
  • obj (list) — the object in question.

::Diagrams::position xcoord ycoord

Creates a position "object". Boom, coordinates.

  • xcoord (float) — the X-coordinate of the position.
  • ycoord (float) — the Y-coordinate of the position.

🎀 DRAWING OBJECTS 🎀

::Diagrams::box text width height

Draws a box from the current position. width and height are both optional — if you don't give them, the text itself decides the width and height. Slay, self-sizing. 📦✨

  • text (string) — the text to be shown inside the box.
  • width (float) — the width (if any) of the box, in pixels.
  • height (float) — the height (if any) of the box, in pixels.

::Diagrams::plaintext text width height

Draws plain text from the current position. width and height are both optional — if you don't give them, the text decides the width and height.

  • text (string) — the text to be shown.
  • width (float) — the width (if any) of the (invisible) box in which the text gets positioned.
  • height (float) — the height (if any) of the box.

::Diagrams::circle text radius

Draws a circle from the current position. The radius is optional. 🟣

  • text (string) — the text to be shown inside the circle.
  • radius (float) — the radius (if any) of the circle, in pixels.

::Diagrams::slanted text width height angle

Draws a slanted box from the current position. width, height and angle are all optional.

  • text (string) — the text to be shown inside the box.
  • width (float) — the width (if any) of the box, in pixels.
  • height (float) — the height (if any) of the box, in pixels.
  • angle (float) — the angle of the slanted box.

::Diagrams::diamond text width height

Draws a diamond-shaped box from the current position. width and height are both optional — if you don't give them, the text decides the width and height. 💎

  • text (string) — the text to be shown inside the diamond.
  • width (float) — the width (if any) of the diamond, in pixels.
  • height (float) — the height (if any) of the diamond, in pixels.

::Diagrams::drum text width height

Draws a drum-shaped item from the current position. width and height are both optional — if you don't give them, the text decides the width and height. 🥁

  • text (string) — the text to be shown inside the drum.
  • width (float) — the width (if any) of the drum, in pixels.
  • height (float) — the height (if any) of the drum, in pixels.

::Diagrams::arrow text length heads

Draws an arrow from the current position to the next one. The text gets drawn next to the arrow, and the length (in pixels) is optional — if you don't give it, the gap parameters are used instead.

  • text (string) — the text to be shown along the arrow.
  • length (float) — the length of the arrow, in pixels.
  • heads (float) — which arrow heads to draw (first, last or both — defaults to last).

::Diagrams::line args

Draws a line specified either via positions or via line segments. The arguments are either positions or length-angle pairs. 🌈

  • args (list) — a list of positions, or a list of length-angle pairs.

👑 ATTRIBUTES 👑

(Note: attributes are persistent.)

Bestie, they stick around. Remember that. 💀

::Diagrams::attach anchor

Sets the anchor point used for attaching arrows to. 📌

  • anchor (string) — any one of the valid anchors (e.g. N or North).

::Diagrams::color name

Sets the colour used for the outline of a box and friends.

  • name (color) — the name of the colour to be used.

::Diagrams::fillcolor name

Sets the colour used to fill the objects.

  • name (color) — the name of the colour to be used.

::Diagrams::textcolor name

Sets the colour the text gets drawn in.

  • name (color) — the name of the colour to be used.

::Diagrams::usegap use

Turns the gap on (1) or off (0). Note: usually a small gap is used when positioning objects. 🌸

  • use (boolean) — whether to use the gap to compute the position of the next object or not.

::Diagrams::xgap value

The size of the gap in the horizontal direction, in pixels.

  • value (integer) — the gap width in pixels.

::Diagrams::ygap value

The size of the gap in the vertical direction, in pixels.

  • value (integer) — the gap height in pixels.

::Diagrams::textfont name

Sets the name of the font to use.

  • name (string) — the name of a text font.

::Diagrams::linewidth pixels

Sets the width of the lines — that means lines inside line objects and arrows, plus the outline of boxes and other objects.

  • pixels (integer) — the number of pixels the lines are wide.

::Diagrams::linestyle style

Sets the style of the lines and arrows, and of the outline of boxes and other objects. The predefined line styles are: solid, dot, dash, dash-dot, dash-dot-dot (these are the distinguishable line styles on Windows). You can also use the style patterns from the canvas directly. ✨

  • style (string) — the name of a valid line style.

🧚 COMMANDS FOR IMPLEMENTING NEW OBJECTS 🧚

Note: it is best to study how, for instance, box objects are implemented first. Fr fr, go read the box code. 🫶

::Diagrams::pushstate

Saves the current global settings. You use this when you're defining an object that's composed of other objects. 💾

::Diagrams::popstate

Restores the previously saved global settings. Rewind. ⏪

::Diagrams::computepos

Computes the current position.

::Diagrams::boxcoords x1 y1 x2 y2

Computes the anchor coordinates for a box-like object. Heads up, this is merely a convenience routine — in general you'll have to compute the list of coordinates yourself, like the diamond object does. 😭

  • x1 (float) — the X coordinate of the upper-left corner.
  • y1 (float) — the Y coordinate of the upper-left corner.
  • x2 (float) — the X coordinate of the lower-right corner.
  • y2 (float) — the Y coordinate of the lower-right corner.

::Diagrams::moveobject obj

Moves the object to the right position and returns the new information.

  • obj (list) — a list of data representing the object.

🔥 KEYWORDS 🔥

diagrams, drawing

Okay that's the whole page, bestie — every single command, argument, default, warning and note, all accounted for, no cap. 🎀

This one's from the diagrams source, version 0.2, sitting pretty in manual section Diagrams(n). Go draw something iconic. 💖✨

📦 where this page comes from