Parent for all Overlay types. The core concept with an Overlay is that of its location, which is specified
as follows:
Connectors
- a value between 0 and 1 inclusive is a proportional value, relative to the length of the Connector's path.
- a value greater than 1 or less than 0 is an absolute value (travel along the path inscribed by the Connector)
For Connectors, the default value is 0.5.
Endpoints
- An array of two values which are proportional to the width and height of the Endpoint.
For Endpoints, the default value is [0.5, 0.5].
- Source:
- overlays-api.js, line 1
Members
-
<static> Arrow
-
Draws an arrow, using four points: the head and two tail points, and a
foldbackpoint, which permits the tail of the arrow to be indented.- Source:
- overlays-api.js, line 3
-
<static> Diamond
-
This is a specialized instance of Arrow in which jsPlumb hardcodes
foldbackto 2, meaning the Arrow turns into a Diamond- Source:
- overlays-api.js, line 11
-
<static> Label
-
Provides a text label with which to decorate Connectors or Endpoints.
- Source:
- overlays-api.js, line 15
-
<static> PlainArrow
-
This is just a specialized instance of Arrow in which jsPlumb hardcodes
foldbackto 1, meaning the tail of the Arrow is a flat edge- Source:
- overlays-api.js, line 7
Methods
-
<static> Arrow(params, width, length, location, direction, foldback, paintStyle)
-
Parameters:
Name Type Argument Default Description paramsObject Constructor parameters
widthInteger Width of the tail of the arrow
lengthInteger Distance from the tail of the arrow to the head
locationFloat <optional>
0.5 Where, either as a proportional value from 0 to 1 inclusive, or as an absolute value (negative values mean distance from target; positive values greater than 1 mean distance from source) the Arrow should appear on the Connector
directionInteger Which way to point. Allowed values are 1 (the default, meaning forwards) and -1, meaning backwards
foldbackFloat <optional>
0.623 How far along the axis of the arrow the tail points foldback in to.
paintStyleObject A style object in the form used for paintStyle values for Endpoints and Connectors.
- Source:
- overlays-api.js, line 5
-
<static> Diamond(params, width, length, location, direction, paintStyle)
-
Parameters:
Name Type Argument Default Description paramsObject Constructor parameters
widthInteger Width of the diamond.
lengthInteger Length of the diamond.
locationFloat <optional>
0.5 Where, either as a proportional value from 0 to 1 inclusive, or as an absolute value (negative values mean distance from target; positive values greater than 1 mean distance from source) the Diamond should appear on the Connector
directionInteger Which way to point. Allowed values are 1 (the default, meaning forwards) and -1, meaning backwards
paintStyleObject A style object in the form used for paintStyle values for Endpoints and Connectors.
- Source:
- overlays-api.js, line 13
-
<static> Label(params, label, cssClass, location)
-
Parameters:
Name Type Argument Default Description paramsObject Constructor parameters
labelString | Function The text to display. You can provide a function here instead of plain text: it is passed the component as an argument, and it should return a String.
cssClassString <optional>
Optional css class to use for the Label. This is now preferred over using the
labelStyleparameter.locationFloat <optional>
0.5 Where, either as a proportional value from 0 to 1 inclusive, or as an absolute value (negative values mean distance from target; positive values greater than 1 mean distance from source) the Label should appear on the Connector
- Source:
- overlays-api.js, line 17
-
<static> PlainArrow(params, width, length, location, direction, paintStyle)
-
Parameters:
Name Type Argument Default Description paramsObject Constructor parameters
widthInteger Width of the tail of the arrow
lengthInteger Distance from the tail of the arrow to the head
locationFloat <optional>
0.5 Where, either as a proportional value from 0 to 1 inclusive, or as an absolute value (negative values mean distance from target; positive values greater than 1 mean distance from source) the PlainArrow should appear on the Connector
directionInteger Which way to point. Allowed values are 1 (the default, meaning forwards) and -1, meaning backwards
paintStyleObject A style object in the form used for paintStyle values for Endpoints and Connectors.
- Source:
- overlays-api.js, line 9