Element

An element is the fundamental building block of a vivarium. It represents something that can exist in a cell of the grid and be drawn on the screen.

Creating an element

To create an element, call vi.element with a name and a color:

const space = vi.element("space", "blue");

• name — A unique string that identifies the element. No two elements can share the same name, and the name cannot be empty.
• color — A unique color used to draw the element on the screen. Any CSS named color is accepted, as well as hexadecimal colors in the six-character (#FF7A45) or three-character (#F00) shorthand format. No two elements can share the same color.

The method returns an element reference that can be used to define rules:

const alien = vi.element("alien", "green");

// Use the element in rules
space.to(alien);

Extending kinds

Elements can optionally extend one or more kinds. This is done by passing an array of kinds as the third argument:

const sentient = vi.kind("sentient");
const organic = vi.kind("organic");

const alien = vi.element("alien", "green", [sentient, organic]);

When an element extends a kind, it inherits all the rules defined on that kind. It can also be matched when a condition checks for that kind. See Kind for more details.