Drawing

General statement

A dataware type block can also be used to draw freely.
If the variable associated with the block is 'd', then we will use for that:

draw d 0 0 100 50 ...

The four numerical values \u200b\u200bprovided correspond respectively to the coordinates in millimeters of the left, top, right and bottom edges.

Note that in the case of a drawing, the data contained in the dataware block, saved via the instructions 'dw_bin' 'dw_category' 'dw_value' and 'dw_add' are not used for the graphic representation.

We will now explain the graphic instructions that can be used, which are 'rectangle', 'fill', 'line', 'stroke', 'text', and 'virtual_button'

Filling

Fill a rectangle:

rectangle 10 10 30 20 color (color hsl 0 50 50)

The four numerical values \u200b\u200bprovided correspond respectively to the coordinates in millimeters of the left, top, right and bottom edges.

Version with rounded corners:

rectangle 10 10 30 20 color (color hsl 0 50 50) rounded 2

Fill a complex curve:

fill color (color hsl 0 50 50) outline angle 10 10 through 20 10 point 15 20 in 5 0 out -5 0

You can specify more than one 'outline' for a single 'fill'.
Each 'outline' represents a closed curve, the points of which can be supplied via one of the three instructions 'angle' 'through' and 'point'.
'angle x y'is equivalent to' point x y tg_in 0 0 tg_out 0 0'
'through x y'is equivalent to' point x y auto_in auto_out '

The options for the 'fill' statement are:

`evenodd`	This is the default fill mode.
`nonzero`	Use a different fill rule. ↣ See the explanation of the different filling rules on wikipedia https://en.wikipedia.org/wiki/Nonzero-rule
`color` `c`	Specifies the fill color.

The options of the 'point' statement are:

`in` `x` `y`	Précise le vecteur tangente à l'entrée du point.
`tg_in` `x` `y`	Same, but the length of the vector will be calculated automatically.
`auto_in`	La tangente à l'entrée du point sera calculée automatiquement.
`out` `x` `y`	Précise le vecteur tangente à la sortie du point.
`tg_out` `x` `y`	Same, but the length of the vector will be calculated automatically.
`auto_out`	La tangente à la sortie du point sera calculée automatiquement

Lines

Draw a simple line:

line 10 10 30 20 color (color hsl 0 50 50)

The first two values \u200b\u200bcorrespond to the horizontal and vertical coordinates of the first point, the last two to those of the second point.

Draw a complex curve:

stroke color (color hsl 0 50 50) curve angle 10 10 through 20 10 point 15 20 in 5 0 out -5 0

For a complex curve, you can also use several 'curve' or 'outline' instructions.

The options for the 'stroke' statement are:

`width` `w`	Specifies the line thickness. The default is not a fixed value in millimeters, but is the size of a pixel on the screen, which produces a line that is both very fine and legible.
`color` `c`	Specifies the curve color.

The default value of the line thickness in millimeters, i.e. the thickness when the 'stroke' instruction does not specify the 'width' option, can be adjusted for a whole subset of the drawing:

style set "draw/stroke/width" 0.75 ...

Text

Draw text:

text "Hello" translate 30 15

The following options can be used at the level of the 'text' instruction:

`font` `"nom"`	Choose the font. Do not use at this time, because you do not have the option of installing fonts on the Storga server.
`translate` `x` `y`	Translate the text.
`scale` `s`	Text scaling.
`scale` `fx` `sy`	Text scaling is different on each axis. This makes it possible to obtain stretched or condensed text, in height or width.
`rotate` `a`	Rotate the text. The angle must be specified in radians, and works clockwise.
`rotate` `ax` `ay`	Text rotation is different on each axis. This allows the text to be tilted.
`color` `c`	Specifies the color of the text.

The alignment of the text depends on the style, which can be adjusted:

style set "draw/text/align/horizontal" 0 # le texte sera centré horizontalement text ...

style set "draw/text/align/vertical" 0 # le texte sera centré verticalement text ...

style set "draw/text/align/horizontal" 0 set "draw/text/align/vertical" 0 # le texte sera centré horizontalement et verticalement text ...

style set "draw/text/align/horizontal" 1 # le texte sera aligné à droite text ...

...

Définir une zone cliquable

In the following example, 'feedback' is the value of 'button_name' which will be activated if you click in the specified rectangular area, and 'Foo' is the message displayed when you pass over this area:

virtual_button 10 10 30 20 "feedback" help "Foo"

Spatial distortion

Apply a spatial transformation to a subset of the drawing:

transform translate 30 15 ...

The following options can be used at the level of the 'transform' instruction:

`translate` `x` `y`	Translate the subset.
`scale` `s`	Scaling the subset.
`scale` `sx` `sy`	The scaling of the subset is different on each axis. This allows to obtain a drawing stretched or condensed, in height or in width.
`rotate` `a`	Turn the sub assembly. The angle must be specified in radians, and works clockwise.
`rotate` `ax` `ay`	The rotation of the sub-assembly is different on each axis. This allows the subset to be tilted.