Skip to main content
Version: 4.3

ConnectionStrategyOptions

Options for the connectionStrategy prop of <Paper>: pick how a dropped link end is pinned and, optionally, post-process the resulting end definition.

Example​

import { GraphProvider, Paper } from '@joint/react';

// Pin dropped ends at a relative (%) offset of their target.
<GraphProvider>
<Paper connectionStrategy={{ pin: 'relative' }} renderElement={() => <rect width={80} height={40} />} />
</GraphProvider>;

Properties​

customize?​

readonly optional customize?: ConnectionStrategy;

Runs after pinning; receives the already-pinned end (or the original when pin is 'none') and returns the final end definition.


pin?​

readonly optional pin?: ConnectionStrategyPin;

How to anchor the dropped end, see ConnectionStrategyPin.

Default​

'none'

Stay in the know

Be where thousands of diagramming enthusiasts meet

Star us on GitHub