Annotations Basics

Click any annotation to view its source code.

Pan and zoom the chart and drag the nodes to see how annotations respond to changes.

Click an annotation

KeyLines annotations are a special type of a chart item that can annotate nodes, links, combos, or can stand as a free-standing chart annotation without any subjects.

Any annotations (with or without subjects) can be positioned using world coordinates, and stay fixed in place even during chart changes or view changes.

Annotations with subjects can also be placed relative to their subjects, and move to keep in their relative position even when a layout is run or when the subjects move.

Annotations have two main parts - a body to show information, styling elements or user controls and a connector to link the annotation to its subjects. You can read more in Annotations documentation and see more advanced examples of body styling in the Advanced Annotation Styles demo.

The connector further splits into a line, a subject end decoration and a container around subjects, all of which can be styled or disabled in the connectorStyle property.

Key functions used: