The model for diagram elements. It inherits from joint.dia.Cell with a few additional properties and methods specific to elements. These properties can be put into three groups:

### Geometry

Coordinates of an element are stored in the `position` property that is an object with `x` and `y` keys. `position` can be accessed or set directly using the regular Backbone `set()`/`get()` methods or through the translate method.

Rotation angle is stored in the `angle` property. This angle is in degrees and the rotation origin is always considered to be the center of the element. `angle` can be also accessed or set directly using the regular Backbone `set()`/`get()` methods or through the rotate method.

Size of an element is stored in the `size` property that is an object with `width` and `height` keys. Again, `size` can be accessed or set directly using the regular Backbone `set()`/`get()` methods or through the resize method.

### Presentation

Another important property is `attrs` which is an object with keys representing selectors that match subelements and values which are SVG attributes that will be set on the subelements. One can find a list of SVG attributes and their descriptions e.g. on MDN.

It is important to note that each `joint.dia.Element` defines an SVG markup which is then used by `joint.dia.ElementView` to render the element to the paper. For instance, the `joint.shapes.basic.Rect` element (that inherits from `joint.dia.Element`) defines its markup as follows:

    <g class="rotatable"><g class="scalable"><rect/></g><text/></g>

Therefore, in order to set a red fill color for the rectangle subelement, the `attrs` object should contain:

    rect: { fill: 'red' }

Again, it is not recommended to change the `attrs` object directly. Instead, use the attr method.

The `z` property specifies the stack order of the element in the SVG DOM. An element with a higher `z` level is in front of an element with a lower `z` level. (This also stands for links which have the exact same property.)

### Nesting

The last two properties of elements are `embeds` and `parent`. These two are related to elements that contain or are contained within other elements forming a hierarchical structure. `embeds` is a list of cell `id`'s that are embedded inside the element. `parent` is an `id` of the parent element of the embedded one. When a parent element is translated, all its children get translated too.