xAlignTypeHAlign — align shapes horizontally around position
yAlignTypeVAlign — align shapes vertically around position
alignimage | filteredImage — image will align the shapes
as if there were no pixels filtered out. filteredImage will align to only
the shapes that exist.
distributionraster | random — Returned shapes are randomly
distributed throughout shape ('random') or rasterized in order from top
left to bottom right of image (or filtered image) (random)
filternumber[] | none — filter function with pixel color and pixel position input parameters. Return
true to keep pixel. Pixel position is (0, 0) in top left corner and
(pixelsWidth, pixelsHeight) in the bottom right (() => true)
dithernumber — Add a random offset to each shape to create a
dither effect
widthnumber | null — width to map image pixels to. Width is
between center of most left to most right pixels
heightnumber | null — height to map image pixels to. Height is
between center of most bottom to most top pixels
sizenumber — shape size to map pixel to. Final points will
have a width of width + size center of points are used to determine
width and height. Default shape is a square, and default size
(if left undefined) is the size needed to make adjacent square shapes
touch
excessrepeat | repeatOpaqueOnly | lastOpaque — if
num is greater than the number of pixels, then either 'repeat' the
shapes from all the pixels again, repeat the shapes from only the opaque
pixels 'repeatOpaqueOnly' or put all execess shapes on the 'lastOpaque'
pixel. Note, repeating pixels that are semitransparent will effectively put
multiple pixels on top of each other, reducing the transparency of the pixel
('repeatOpaqueOnly').
makeColors(color: TypeColor, num: number) => number[] — use this function to customze color mapping. The function takes as input the
pixel's color, and the number of vertices that need to be colored. It
outputs an array of colors for each vertex - i.e.:
[r1, b1, g1, a1, r2, g2, b, a2, ...]
shapenumber | (center: Point, size: number) => number[] — By default a square of two triangles is created (six vertices). Use a
number to create a regular polygon with number sides. Use a custom
function to make a custom shape. The function takes as input the [x, y]
position of the point to build the shape around, and size. It outputs an
array of interlaced x and y coordinates of triangle vertices - i.e.:
[x1, y1, x2, y2, x3, y3, ....]
imageHTMLImageElementxAlignTypeHAlign — align shapes horizontally aroundpositionyAlignTypeVAlign — align shapes vertically aroundpositionalignimage|filteredImage—imagewill align the shapes as if there were no pixels filtered out.filteredImagewill align to only the shapes that exist.distributionraster|random— Returned shapes are randomly distributed throughout shape ('random') or rasterized in order from top left to bottom right of image (or filtered image) (random)filternumber[] |none— filter function with pixel color and pixel position input parameters. Returntrueto keep pixel. Pixel position is (0, 0) in top left corner and (pixelsWidth, pixelsHeight) in the bottom right (() => true)positionTypeParsablePoint — position to place shapes atdithernumber— Add a random offset to each shape to create a dither effectwidthnumber|null— width to map image pixels to. Width is between center of most left to most right pixelsheightnumber|null— height to map image pixels to. Height is between center of most bottom to most top pixelssizenumber— shape size to map pixel to. Final points will have a width ofwidth + sizecenter of points are used to determinewidthandheight. Default shape is a square, and default size (if left undefined) is the size needed to make adjacent square shapes touchexcessrepeat|repeatOpaqueOnly|lastOpaque— if num is greater than the number of pixels, then either'repeat'the shapes from all the pixels again, repeat the shapes from only the opaque pixels'repeatOpaqueOnly'or put all execess shapes on the'lastOpaque'pixel. Note, repeating pixels that are semitransparent will effectively put multiple pixels on top of each other, reducing the transparency of the pixel ('repeatOpaqueOnly').makeColors(color: TypeColor, num: number) => number[]— use this function to customze color mapping. The function takes as input the pixel's color, and the number of vertices that need to be colored. It outputs an array of colors for each vertex - i.e.: [r1, b1, g1, a1, r2, g2, b, a2, ...]shapenumber|(center: Point, size: number) => number[]— By default a square of two triangles is created (six vertices). Use anumberto create a regular polygon withnumbersides. Use a custom function to make a custom shape. The function takes as input the [x, y] position of the point to build the shape around, andsize. It outputs an array of interlaced x and y coordinates of triangle vertices - i.e.: [x1, y1, x2, y2, x3, y3, ....]