Drawing.md

Module Graphics.Drawing

This module defines a type Drawing for creating vector graphics.

Point

type Point = { x :: Number, y :: Number }

A Point consists of x and y coordinates.

Shape

data Shape

A single shape.

Instances

Eq Shape
Semigroup Shape
Monoid Shape

path

path :: forall f. Foldable f => f Point -> Shape

Create a path.

closed

closed :: forall f. Foldable f => f Point -> Shape

Create a closed path.

rectangle

rectangle :: Number -> Number -> Number -> Number -> Shape

Create a rectangle from the left, top, width and height parameters.

circle

circle :: Number -> Number -> Number -> Shape

Create a circle from the left, top and radius parameters.

arc

arc :: Number -> Number -> Number -> Number -> Number -> Shape

Create a circular arc from the left, top, start angle, end angle and radius parameters.

FillStyle

newtype FillStyle

Encapsulates fill color etc.

Instances

Semigroup FillStyle
Monoid FillStyle
Eq FillStyle

fillColor

fillColor :: Color -> FillStyle

Set the fill color.

OutlineStyle

newtype OutlineStyle

Encapsulates outline color etc.

Instances

Semigroup OutlineStyle
Monoid OutlineStyle
Eq OutlineStyle

outlineColor

outlineColor :: Color -> OutlineStyle

Set the outline color.

lineWidth

lineWidth :: Number -> OutlineStyle

Set the line width.

Shadow

newtype Shadow

Encapsulates shadow settings etc.

Instances

Eq Shadow
Semigroup Shadow
Monoid Shadow

shadowOffset

shadowOffset :: Number -> Number -> Shadow

Set the shadow blur.

shadowBlur

shadowBlur :: Number -> Shadow

Set the shadow blur.

shadowColor

shadowColor :: Color -> Shadow

Set the shadow color.

shadow

shadow :: Shadow -> Drawing -> Drawing

Apply a Shadow to a Drawing.

Drawing

data Drawing

A vector Drawing.

Instances

Semigroup Drawing
Monoid Drawing
Eq Drawing

filled

filled :: FillStyle -> Shape -> Drawing

Fill a Shape.

outlined

outlined :: OutlineStyle -> Shape -> Drawing

Draw the outline of a Shape.

clipped

clipped :: Shape -> Drawing -> Drawing

Clip a Drawing to a Shape.

scale

scale :: Number -> Number -> Drawing -> Drawing

Apply a scale transformation by providing the x and y scale factors.

translate

translate :: Number -> Number -> Drawing -> Drawing

Apply a translation by providing the x and y distances.

rotate

rotate :: Number -> Drawing -> Drawing

Apply a rotation by providing the angle.

text

text :: Font -> Number -> Number -> FillStyle -> String -> Drawing

Render some text.

everywhere

everywhere :: (Drawing -> Drawing) -> Drawing -> Drawing

Modify a Drawing by applying a transformation to every subdrawing.

render

render :: Context2D -> Drawing -> Effect Unit

Render a Drawing to a canvas.

Re-exported from Color:

Color

data Color

The representation of a color.

Note:

• The Eq instance compares two Colors by comparing their (integer) RGB values. This is different from comparing the HSL values (for example, HSL has many different representations of black (arbitrary hue and saturation values).
• Colors outside the sRGB gamut which cannot be displayed on a typical computer screen can not be represented by Color.

Instances

Show Color
Eq Color

Re-exported from Graphics.Drawing.Font:

Font

data Font

Fonts.

Instances

Eq Font