g.js — graphical objects for JavaScript

Vector Graphics

NodeBox Live has great support for working with vector shapes such as paths, text, lines and points.

Basic Shapes

rect / ellipse / polygon / arc / star

line — a line between two points

lineAngle — a line with a starting point and an angle / distance

quadCurve — smooth quadratic bézier curve

Text

text — basic text

textPath — text as a path object that can be manipulated

Grids

grid — a rectangular grid of points

Transforming Shapes

align — align shapes in relation to the origin

delete — delete points or sub-paths in a shape

fit — resize shapes to fit given size

reflect — mirror shapes

translate / rotate / scale / skew

Distorting Shapes

resample — distribute points along the shape

snap — align points of the shape to an invisible grid

wiggle — randomly shift the points of a shape

Combining Shapes

merge — combine multiple shapes into one

compound — add, subtract or intersect shapes

copy — make transformed copies

fitTo — fit a shape within the bounds of another shape

group / ungroup

link — visually link two shapes together

shapeOnPath — place shapes on a curve

stack — arrange shapes horizontally or vertically

sort — sort points/shapes by position or distance

Points

makePoint — using X/Y coordinates

toPoints — extract points from the shape

connect — make a polygon from a list of points

scatter — randomly place points within the shape

Color

colorize — set the color of the shape

colorLookup — lookup a color component

rgbColor / hsbColor / grayColor

Geometry

bounds — calculate the bounding box

centroid — calculate the geometric center

coordinates — generate point based on distance / angle

pointOnPath — calculate a point on the path

angle / distance

Importing Shapes

import — import SVG files