Standard shapes

The shapes.standard namespace provides you with ready-to-use, high-performance versions of the most common shapes. The shapes can be used as they are or can serve as an inspiration for creating custom shapes.

In this section we will provide markup selectors for all standard shapes, so you can style them accordingly.

BorderedImage

JointJS provides a set of built-in shapes that are ready-to-use, high-performance versions of the most common shapes. The BorderedImage shape consists of an image with a border and label.

BorderedRecord

A shape that displays structured/hierarchical data. Inherits from standard.Record shape and adds a background body rectangle.

Circle

JointJS provides a set of built-in shapes that are ready-to-use, high-performance versions of the most common shapes. The Circle shape consists of a circle with a label.

Cylinder

JointJS provides a set of built-in shapes that are ready-to-use, high-performance versions of the most common shapes. The Cylinder shape consists of A cylinder with a label.

DoubleLink

JointJS provides a set of built-in shapes that are ready-to-use, high-performance versions of the most common shapes. The DoubleLink shape consists of a double line link.

Ellipse

JointJS provides a set of built-in shapes that are ready-to-use, high-performance versions of the most common shapes. The Ellipse shape consists of an ellipse with a label.

EmbeddedImage

JointJS provides a set of built-in shapes that are ready-to-use, high-performance versions of the most common shapes. The EmbeddedImage shape is an image embedded into a rectangle with a label.

HeaderedRecord

A shape that displays structured/hierarchical data. Inherits from standard.Record shape and adds a background body rectangle, as well as a header rectangle and headerLabel text label.

HeaderedRectangle

JointJS provides a set of built-in shapes that are ready-to-use, high-performance versions of the most common shapes. The HeaderedRectangle shape consists of a rectangle with header.

Image

JointJS provides a set of built-in shapes that are ready-to-use, high-performance versions of the most common shapes. The Image shape consists of an image with a label.

InscribedImage

JointJS provides a set of built-in shapes that are ready-to-use, high-performance versions of the most common shapes. The InscribedImage shape consists of an image in an ellipse with a label.

Link

JointJS provides a set of built-in shapes that are ready-to-use, high-performance versions of the most common shapes. The Link shape consists of a single line link.

Path

JointJS provides a set of built-in shapes that are ready-to-use, high-performance versions of the most common shapes. The Path shape consists of a path with a label.

Polygon

JointJS provides a set of built-in shapes that are ready-to-use, high-performance versions of the most common shapes. The Polygon shape consists of a polygon with a label.

Polyline

JointJS provides a set of built-in shapes that are ready-to-use, high-performance versions of the most common shapes. The Polyline shape consists of a polyline with a label.

Record

A shape that displays structured/hierarchical data. If you are extending the behavior of Record shapes, and creating custom element definitions, it's necessary to use the RecordView.

Rectangle

JointJS provides a set of built-in shapes that are ready-to-use, high-performance versions of the most common shapes. The Rectangle shape consists of a rectangle with a label.

ShadowLink

JointJS provides a set of built-in shapes that are ready-to-use, high-performance versions of the most common shapes. The ShadowLink shape consists of a thicker line with shadow.

TextBlock

JointJS provides a set of built-in shapes that are ready-to-use, high-performance versions of the most common shapes. The TextBlock shape consists of a rectangle with a HTML label.