Elm-Canvas / raster-shapes / RasterShapes

Basics


type alias Position =
{ x : Basics.Int, y : Basics.Int }

Position is our basic type for representing the position in a grid.


type alias Size =
{ width : Basics.Int
, height : Basics.Int 
}

We use Size to store width and height value.

Shape calculators

line : Position -> Position -> List Position

Given a starting and ending Position, this function will give you every Position along that line.

(line (Position 0 0) (Position 3 2)) ==
    [ Position 3 2
    , Position 2 1
    , Position 1 1
    , Position 0 0
    ]

bezier : Basics.Int -> Position -> Position -> Position -> Position -> List Position

To make a curved line, try this function called bezier, named after the bezier curve. It works by approximation, drawing many small straight lines along a curved path. Its first parameter, an Int, is the resolution of the curve (resolution=1 will be just a straight line, and higher values will compute a more perfect curve). The remaining parameters are Position. The first and last Position refer to the starting and ending points of the curve. The middle two are control points, which are where the curve will curve towards from each end point.

squiggle : Int -> List Position
squiggle i =
    Raster (i // 2)
        (Position 0 0)
        (Position i 0)
        (Position 0 i)
        (Position i i)

rectangle : Size -> Position -> List Position

To get a list of Position along the edge of a rectangle, use rectangle.

rectangle (Size 10 7) (Position 1 1) ==
    [ line (Position 1 1) (Position 10 1)
    , line (Position 1 1) (Position 1 7)
    , line (Position 11 8) (Position 1 8)
    , line (Position 11 8) (Position 11 1)
    ]

rectangle2 : Position -> Position -> List Position

Rectangle2 is just like Rectangle, except it takes two positions as parameters rather than a position and a size

ellipse : Size -> Position -> List Position

To get a list of Position along the edge of a ellipse of dimensions Size, use ellipse.

circle : Int -> Position -> List Position
circle diameter point =
    ellipse (Size diameter diameter) point

circle : Basics.Int -> Position -> List Position

To get a list of Position along the edge of a circle of diameter Int, use circle.

dot : Position -> List Position
dot =
    circle 1