Connectors take an array of link route points and generate SVG path commands so that the link can be rendered. The connector property of a link can be accessed with the link.connector() function.

There are four built-in connectors in JointJS:

Example:

link.connector('rounded', {
    radius: 20
});

The default connector is 'normal'; this can be changed with the defaultConnector paper option. Example:

paper.options.defaultConnector = {
    name: 'rounded',
    args: {
        radius: 20
    }
}

All four of the built-in connectors accept the following optional argument, in addition to their own arguments:

raw boolean Should the router return the connection path as a g.Path rather than as a string? Default is false.

Example:

link.connector('normal', {
    raw: true
});

JointJS also contains mechanisms to define one's own custom connectors.

Note that the modular architecture of JointJS allows mixing-and-matching connectors with routers as desired; for example, a link may be specified to use the 'jumpover' connector on top of the 'manhattan' router:

var link = new joint.shapes.standard.Link();
link.source(rect);
link.target(rect2);
link.router('manhattan');
link.connector('jumpover');