Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 6 additions & 3 deletions packages/core/src/types.ts
Original file line number Diff line number Diff line change
Expand Up @@ -515,10 +515,13 @@ export type CellStateStyle = {
/**
* Defines if the connection points on either end of the edge should be computed so that
* the edge is vertical or horizontal if possible and if the point is not at a fixed location.
* The computation of the connection points involves the {@link perimeter}.
*
* This is used in {@link Graph.isOrthogonal}, which also returns `true` if the {@link edgeStyle}
* of the edge is an `elbow` or `entity`.
* @default false
* This is used in {@link Graph.isOrthogonal}, which is in charge of determining if the edge terminals should be orthogonal.
*
* If the {@link orthogonal} property is not explicitly set but the {@link edgeStyle} belongs to one of the "orthogonal" `EdgeStyle` connectors,
* for example when using {@link EdgeStyle.SegmentConnector} or {@link EdgeStyle.EntityRelation}, the {@link Graph.isOrthogonal} method which also returns `true`.
* @default undefined
*/
orthogonal?: boolean | null;
/**
Expand Down
11 changes: 2 additions & 9 deletions packages/core/src/view/Graph.ts
Original file line number Diff line number Diff line change
Expand Up @@ -1216,24 +1216,17 @@ class Graph extends EventSource {
}

/**
* Returns true if perimeter points should be computed such that the
* resulting edge has only horizontal or vertical segments.
* Returns `true` if perimeter points should be computed such that the resulting edge has only horizontal or vertical segments.
*
* @param edge {@link CellState} that represents the edge.
*/
isOrthogonal(edge: CellState): boolean {
/*
'orthogonal' defines if the connection points on either end of the edge should
be computed so that the edge is vertical or horizontal if possible
and if the point is not at a fixed location. Default is false.
This also returns true if the edgeStyle of the edge is an elbow or
entity.
*/
const orthogonal = edge.style.orthogonal;
if (orthogonal != null) {
return orthogonal;
}

// fallback when the orthogonal style is not defined
const tmp = this.view.getEdgeStyle(edge);
return (
tmp === EdgeStyle.SegmentConnector ||
Expand Down
4 changes: 2 additions & 2 deletions packages/core/src/view/GraphView.ts
Original file line number Diff line number Diff line change
Expand Up @@ -1270,8 +1270,8 @@ export class GraphView extends EventSource {
}

/**
* Returns true if the given edge should be routed with {@link graph.defaultLoopStyle}
* or the {@link CellStateStyle.STYLE_LOOP} defined for the given edge.
* Returns `true` if the given edge should be routed with {@link graph.defaultLoopStyle}
* or the {@link CellStateStyle.orthogonalLoop} defined for the given edge.
* This implementation returns `true` if the given edge is a loop and does not
*/
isLoopStyleEnabled(
Expand Down
69 changes: 30 additions & 39 deletions packages/core/src/view/cell/CellState.ts
Original file line number Diff line number Diff line change
Expand Up @@ -32,18 +32,16 @@ import { Graph } from '../Graph';
/**
* Represents the current state of a cell in a given {@link GraphView}.
*
* For edges, the edge label position is stored in <absoluteOffset>.
* For edges, the edge label position is stored in {@link absoluteOffset}.
*
* The size for oversize labels can be retrieved using the boundingBox property
* of the <text> field as shown below.
* The size for oversize labels can be retrieved using the `boundingBox` property of the {@link text} field as shown below.
*
* ```javascript
* let bbox = (state.text != null) ? state.text.boundingBox : null;
* const bbox = state.text?.boundingBox ?? null;
* ```
*
*/
class CellState extends Rectangle {
// referenced in mxCellRenderer
// referenced in CellRenderer
node: HTMLElement | null = null;

// TODO: Document me!!
Expand All @@ -53,10 +51,10 @@ class CellState extends Rectangle {

boundingBox: Rectangle | null = null;

// Used by mxCellRenderer's createControl()
// Used by CellRenderer.createControl
control: Shape | null = null;

// Used by mxCellRenderer's createCellOverlays()
// Used by CellRenderer.createCellOverlays
overlays: Dictionary<CellOverlay, Shape> = new Dictionary();

/**
Expand All @@ -75,31 +73,33 @@ class CellState extends Rectangle {
style!: CellStateStyle;

/**
* Specifies if the style is invalid. Default is false.
* Specifies if the style is invalid.
* @default false
*/
invalidStyle = false;

/**
* Specifies if the state is invalid. Default is true.
* Specifies if the state is invalid.
* @default true
*/
invalid = true;

/**
* {@link Point} that holds the origin for all child cells. Default is a new
* empty {@link Point}.
* {@link Point} that holds the origin for all child cells.
* @default a new empty {@link Point}.
*/
origin: Point;

/**
* Holds an array of <Point> that represent the absolute points of an
* edge.
* Holds an array of <Point> that represent the absolute points of an edge.
*/
absolutePoints: (null | Point)[] = [];

/**
* {@link Point} that holds the absolute offset. For edges, this is the
* absolute coordinates of the label position. For vertices, this is the
* offset of the label relative to the top, left corner of the vertex.
* {@link Point} that holds the absolute offset.
*
* - For edges, this is the absolute coordinates of the label position.
* - For vertices, this is the offset of the label relative to the top, left corner of the vertex.
*/
absoluteOffset: Point;

Expand All @@ -124,8 +124,7 @@ class CellState extends Rectangle {
length = 0;

/**
* Array of numbers that represent the cached length of each segment of the
* edge.
* Array of numbers that represent the cached length of each segment of the edge.
*/
segments: number[] = [];

Expand All @@ -135,8 +134,8 @@ class CellState extends Rectangle {
shape: Shape | null = null;

/**
* Holds the {@link Text} that represents the label of the cell. Thi smay be
* null if the cell has no label.
* Holds the {@link Text} that represents the label of the cell.
* This may be `null` if the cell has no label.
*/
text: TextShape | null = null;

Expand Down Expand Up @@ -181,8 +180,7 @@ class CellState extends Rectangle {
}

/**
* Returns the {@link Rectangle} that should be used as the perimeter of the
* cell.
* Returns the {@link Rectangle} that should be used as the perimeter of the cell.
*
* @param border Optional border to be added around the perimeter bounds.
* @param bounds Optional {@link Rectangle} to be used as the initial bounds.
Expand Down Expand Up @@ -217,8 +215,7 @@ class CellState extends Rectangle {
* Sets the first or last point in <absolutePoints> depending on isSource.
*
* @param point {@link Point} that represents the terminal point.
* @param isSource Boolean that specifies if the first or last point should
* be assigned.
* @param isSource Boolean that specifies if the first or last point should be assigned.
*/
setAbsoluteTerminalPoint(point: Point | null, isSource = false) {
if (isSource) {
Expand Down Expand Up @@ -252,8 +249,7 @@ class CellState extends Rectangle {
/**
* Returns the visible source or target terminal cell.
*
* @param source Boolean that specifies if the source or target cell should be
* returned.
* @param source Boolean that specifies if the source or target cell should be returned.
*/
getVisibleTerminal(source = false) {
return this.getVisibleTerminalState(source)?.cell ?? null;
Expand All @@ -262,8 +258,7 @@ class CellState extends Rectangle {
/**
* Returns the visible source or target terminal state.
*
* @param source Boolean that specifies if the source or target state should be
* returned.
* @param source Boolean that specifies if the source or target state should be returned.
*/
getVisibleTerminalState(source = false): CellState | null {
return source ? this.visibleSourceState : this.visibleTargetState;
Expand All @@ -272,7 +267,7 @@ class CellState extends Rectangle {
/**
* Sets the visible source or target terminal state.
*
* @param terminalState <CellState> that represents the terminal.
* @param terminalState {@link CellState} that represents the terminal.
* @param source Boolean that specifies if the source or target state should be set.
*/
setVisibleTerminalState(terminalState: CellState | null, source = false) {
Expand All @@ -291,16 +286,16 @@ class CellState extends Rectangle {
}

/**
* Returns the unscaled, untranslated paint bounds. This is the same as
* <getCellBounds> but with a 90 degree rotation if the shape's
* isPaintBoundsInverted returns true.
* Returns the unscaled, untranslated paint bounds.
*
* This is the same as {@link getCellBounds} but with a 90-degrees rotation if the {@link Shape.isPaintBoundsInverted} returns `true`.
*/
getPaintBounds() {
return this.paintBounds;
}

/**
* Updates the cellBounds and paintBounds.
* Updates the {@link cellBounds} and {@link paintBounds}.
*/
updateCachedBounds() {
const view = this.view;
Expand All @@ -321,8 +316,6 @@ class CellState extends Rectangle {
}

/**
* Destructor: setState
*
* Copies all fields from the given state to this state.
*/
setState(state: CellState) {
Expand Down Expand Up @@ -382,16 +375,14 @@ class CellState extends Rectangle {
}

/**
* Destructor: destroy
*
* Destroys the state and all associated resources.
*/
destroy() {
(<Graph>this.view.graph).cellRenderer.destroy(this);
}

/**
* Returns true if the given cell state is a loop.
* Returns `true` if the given cell state is a loop.
*
* @param state {@link CellState} that represents a potential loop.
*/
Expand Down
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
<mxfile host="Electron" modified="2022-04-06T13:05:08.207Z" agent="5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) draw.io/17.2.4 Chrome/96.0.4664.174 Electron/16.1.0 Safari/537.36" etag="epoizijUXisM-Gp8Z8wd" version="17.2.4" type="device" pages="7"><diagram id="RNMhzFc4bVhtCsQH0jFF" name="context">7Vddk5owFP01PjojBFl9VNduH9qZ7thOp48puUJqIDQEhf31DZAAQddZbe33E8m5yb0395x8MEKruHgQOI3ecgJs5E5IMUL3I9d10HSiPhVSNsh8PmuAUFCiB3XAhj6BBvW8MKcEMmug5JxJmtpgwJMEAmlhWAh+sIdtObOjpjiEI2ATYHaMfqRERg06c+86/DXQMDKRHX/eWD7jYBcKnic6XsITaCwxNm70GrMIE37oQWg9QivBuWxacbECVpXVVKyZ9+oZa5uygES+ZEJePvrRbrkOPmDicVz6T1/ej1HjZY9Zrkuhk5WlqQ0kZFGVWPXq1aFlJGOmeo5q1kuHKsJE9TIp+K6tIFLIcZI6byAWIzrlB+AxSFGqAYeOB6OuqEeBwQQwLOne5hFrOYStuzbCO05VJu7ESNfTfrRwHX9iu8h4LgLQs/rVHThyB468gR+JRQjyyI9q9FbdQTV3F/Do3ZBH90/g0a7+tSw66LyfG7M4/aEs/u6ctSej2Xt3/pV7Dw03sf9TafP/Mdqc89W+mrYh/8/QpgqJy96wtBqQfS+x4zdivJ1Nufs422ymwX5MPp28HX2myrnc8nolHcP+15wbwzirHzgLNcDx0qIzqlaov7UXagD1Nkihet8ozkEYs8qZDqcorIlt4IHQJBTSVldzmK8446JT35YyNoAwo2GiujoHtNyDkFS9kRbaEFNCqjDLQ0QlbFIcVDEP6kX4cg1XPqE4q2KjjsGR7sx1v6dy/4TK0eDI7gva0selYjh1xTacELof0nQjfaQgqFrNhRJpYSvRv1Y4nm8Jx/3Fujl1qd9EJPX98P/oqI4KSwDIuZUAVLf7f2sune7/GK2/AQ==</diagram><diagram name="center projection" id="7wKxT-a-TJRUQJqu_FCP">7ZZbb5swFMc/DY+TwE5zeVzSLpN2UaZOmvY0ufgUrBgbmUMu+/Qz2IRLtq5J00qd9gT+c/w35/yODQFdZLulYXn6SXOQAQn5LqDXASERvQrtpVL2TpnNpk5IjOA+qBVuxU/wop+XlIJD4TQvodYSRV70ZsdaKYixpzFj9LYfdq9lf9WcJXAk3MZMHqvfBMfUqVMyafX3IJK0WTkaz9yTOxavE6NL5ddTWoF7krHGxidUpIzrbUeiNwFdGK3R3WW7BciqrE3FZprh9/nnL2pOUWK83C7NhzfO7N0pUw7JGVB4WWvirDdMlr6SPlfcN6UFxd9WhOyoLg6dp5hJO4rsbV05qFYI7ahAo9cHANQqj3xznyHwHmWfxxJ0Bmj2NmDbsm06Nu1gbTQDkqHY9HuD+RZLDnaHFVZa2NcjYbMdRt7Hb4ZoHPYtCl2aGPysbskHRmRgNBr4IDMJ4JGPvelk3Uo10BPg0meES14r3AGSc9FG9GGfZ0Y7uijaVwmSENrfpRN65i6lA6MxfVGWV/9Z2m35MIKzWQ6b4g8sbXXZvhOWVwHFE2l/LfP1j/XdNL4X1yr9yFbFxviP9Im0OSvSmnDUR1/pK4YIRtUKCelvT+p/oEX+duA+vkMGH/fJpU5uO2x/Bl14+7NNb34B</diagram><diagram name="orthogonal projection" id="5u9HompIC729Kqdd-Od9">7ZZdT8MgFIZ/TS9NWtimvdQ550c0S5Zo4h2WY2mkZVL2+eulha6l83PZTGa8Grw9vKfnPMDq4X66GEoyYbeCAveQTxcePvcQCnDX1z+FsjRKGJ4YIZYJtUG1ME5WYEW7Lp4mFHKjWUkJwVUyyZ3VkcgyiJSjESnF3A17FtzNOiExbAjjiPBN9SGhihn1BB3X+iUkMasyB73QPHki0UssxTSz+TKRgXmSksrGFpQzQsW8IeGBh/tSCGVG6aIPvGhr1bGbV3591Q2fwjvGxOpePfYH/pExu/jJknVxEjK1W2tkrGeET20nba1qWbUWMnpaENKzsjn4jKmU61mgh2XnoMjg61mupHhZA8Ba+eab2wqBOpRtHUMQKSi51AHzmm21Y1kDa6VJ4EQlM3dvELvF4rXdOsNIJPr1kF8dh8rHHoag57sWuZjKCOyqZstbRqhl1Gn5KCJjUBs+etCoupZKoD+Ai/cIFx0q3I6LZFu0Af7cZ89oOztFe5AgEcLuKT3GW55S3DLq4V9l2f1nqY/l5wi2ZtneFB+w1N0ly0bYpAjI90G7tw1tSnJWEg5c9IU+IkqBzEoF+fjdm/oPbJGvLtxvX9xh68892NXNraf1x6AJrz+28eAN</diagram><diagram name="marker positionning" id="hUysYIEV5oSPOwoVvPX7">5VbbjpswEP2aPCYCmyTksbl0W6mrRo321jcXJuDG4Mg4IfTra7C5ONlLibpSpT7BHI+PmTlngAFeJKcbQfbxLQ+BDZATngZ4OUDIxWNHXUqk0Mhs5msgEjQ0SS2wob/AgGZfdKAhZBozkOScSbrPrN0BT1MIpIURIXhup205s0/dkwgugE1A2CX6QEMZa9RH0xb/BDSK65PdyUyv/CDBLhL8kJrzUp6CXklITWMKymIS8rwD4dUALwTnUt8lpwWwsq11x777if/F263H29Xd5+H9Zr5+QENN9rHPlqY4Aan8u9RIUx8JO5hOmlplUbcW0vBDqZCKqubgeSwTpiJX3Vadg/IER0WZFHzXCIAV8odPbiqE0FLZ1HEDPAEpCpWQt9rWjo07staYAEYkPdreIMZiUUPXnLDmVD0ecsw4YMfwmGHAnmNTZPwgAjC7ui0/I/LOiBor1USSiAjkBZG66ZTdQpWiz6t73N2uJsHd12/JYfrzcXifr0RWt7WfuiHJ4kpR15a6xNdEShBphSAHX0iOLiyhdBfFo6GogqdyZTSuw+Wpm7ksTNTPOLqPr3TC+acMhjzbF+7sSoPhMyJ0TvTOBnPeNpgUlKRRGc3zmErY7ElQLuXqQ2QbbMtTab4srlcZSaom89JtuLTLljK24IyL1qv9XHIEIeH0qv61QP4Lg9vxh/+MPybeCE1edoPV/r69fs9XNepOqjPy/LE9rd4UvzGvVbQGQVWxIP6LIT5/uY+vHGI0vW6IldSk6KTty4Ss35irsP2B0entDyJe/QY=</diagram><diagram name="marker rendering" id="KBc98q3cc0dlVpS0iDJ2">zVXRbpswFP0aHlsRGxLyuKRdp0mV2CK126MLt2DV2MiYAPv62dgESNa1TJu0vMT3XPuYe8694OF90d5JUub3IgXmIT9tPXzjIbTCoa//DNJZZLuNLJBJmrpNI3CgP8CB7lxW0xQqizlICcEULavZ6URwDomaYURK0cy3PQs2v7UkGVwAh4SwS/SRpiq3aIQ2I/4JaJYPN6/WW5t5IslLJkXN3X1ccLCZggw0rqAqJ6loJhC+9fBeCqHsqmj3wIysg2L8igbZ/dfPDw+PdYxiGkVf4itL9nHJkVNxErj6u9TIUh8Jq52SrlbVDdICTz8Yh3TUi4N3uSqYjlZ62SsH5gZfR5WS4uVkANbIO5/cVQjpzGVXxx2IApTs9IZm9Hbo2Hxi64BJYETR47w3iGux7ER3uiEWVD8e8t04YN/xuGHAgT+nqEQtE3CnppKfEQVnRKdWGogUkRmoCyK9mJQ9Qr2jC9wN3nZXSUp4ZqJdk1MFh5IkJtXo98Tc6mfBlRv8VdBbr7TIghunQ5OnjO0FE7In1hqa3+IWOIJU0P62CVwWRa+IO2mS6BdNsg6u0fr1lph5sFTw8B+Ok5ZipyWU3TeTvg6icAC+W2CDB+CmdQw26qZRDJLqYkE6cJk9tmHfbrn/ZJLR+QCGfzjJaHNGtH3fJGurSTfZVpoN1bJZ1+H4kbHbx484vv0J</diagram><diagram id="ne7omDIuoBgSVefN5mzM" name="no intersection">7VlNc9owEP01HNuxJJvAMZA07XQ6yZSmzOQmbIGVCMsji6/++kpYxpZwAiUF4klOWM/SSnpvdyXWLdSfLm8ETuMfPCKsBb1o2UJXLQgBgIH60cgqRzoI5sBE0Mh0KoEB/UMM6Bl0RiOSWR0l50zS1AZDniQklBaGheALu9uYM3vWFE/IFjAIMdtGhzSSsdkFvCjxr4RO4mJm0O7mb6a46Gx2ksU44osKhK5bqC84l/nTdNknTJNX8JKP+/LM283CBElkzYD7jIjb0aPmBHoMj5Qu6075sMLK7dWQ+hfD+PLmV/e+/zRZDr7NP8HN6jazZnJVMLKIqSSDFIe6vVCqt1AvllNtHqhHnKW5DmO6JGqW3pgy1ueMC4UlPFGjetkTkaFmx1MNoxwerSfQSL7EORGSLJ/dLKgs8obwKZFipbqYAbBjWC/czjQXFQ0NFFfkKzBsvGayMVwSqx4MLUWzQnW9VrUsmz3NMZuRqjSvoNqmUndJiaBqB0STz+iYMJqQuxL7H1SfjOn9aEW7aSVJdKlTQ+mQFVIFnyWRZrPiiiTaShI72ansP6jZf4EJwrCkc9t8HSlmhjtOE1nxc2SzDwKH14zPREjMqGo6cQyBtm3ItSOxmBC5ZWct0WbXh6vmH6JahLN4rRSwJdT4HZbKw5M1Aj2kk44U/GmTxOH7lRpBxxA8mta/RYi86OHnVa/b+f4YXj6sktE+ie+taK0WtSZ1Vxo/l090A0vJizcf/LUOcVDwNzZl+8AmG/mHxrFvG4KuoSPLFjQnjhuvdeA5hsBptW5/aL1La+R5n8HLIjUlsrvvKiEHXec+1D40SJ2LlWvn2PeqBl2szpaQO26QAtRQteEeajNG00yr/K+VBKtCU1PBMXO/pm7gO4UDWIRhxRP8Gk9wc+EhlYN6RjsNZ9QtxZyf0T0OEhHz6WiW7WZ0F4FHqSO2nX9GAJyZ0iLpfCT5ExzobSegts6KI+d4uMeJ/rbjxz9d/Khm+TElV6D8JIWu/wI=</diagram><diagram name="projection vs intersection" id="MDurigiudHay89gO_hJH">7VhRb5swEP41eWxkbCDJY5u06TZVi5JJbZ8mFxywCpgZp4T9+hkwAUO2LDRpVW1P4T7bd/F93/kMAzQNt3OOY/+OuSQYQOBuB2g2gNAwoCV/ciQrkTGCJeBx6qpJNbCiP4kCgUI31CVJiSlIMBYIGifaaodFEXGEhmHOWapPW7NAjxpjj3SAlYODLnpPXeGrXcBRjd8S6vlVZMOelCNP2Hn2ONtEKl7EIlKOhLhyozaU+NhlaQNC1wM05YyJ8incTkmQp7XK2PwL/jyylpNovdykdgLi+wvnonR2c8yS3eY4icRpXSuWX3CwUZlUexVZlVoSuZc5Q9IqkoOufBEG0jLkY5E5kkcA0koEZ887ApBESm/E7bB3YCvGLr9SsoSFRPBMrktrbi3Fit+gtcI4CbCgL3pMrCTm7dztIiwYlf8GgqocJsqPKgaIgO4iYRvuELWqmfKWI4R0R3bLj8DcI6LjRz40dl1DBaFHkIv6kOvixC8INXSmc3yBhSA8KhAIUIdx2FGEZJlnD8pFYTzmI0OrMmfb5sxZpqxX6UaePUVi/zDPfFd9tWQx7ikv2PJjtB2dWV/mYX0JTnHk5dZV6lNBVjF28qFUtiFdX2sWCdVXDLPQkZA5ZrnYUK6WNQ2CKQsYr6WqwhMuyLaHTLr0V15GrbxWXa4hj/EeedjmENq/F4OW/mNzbZ3xoIbNQgVDc2zpxWqO0IFyLawF4VRulvB/oYZbLcIwe9awYferYck0zhrT4nxC8soq92++f/IexDK8xLff7hZzy//xVd0q/l8RNNoseKIrgm2/1RVhL7nG+18RPib/5onq3zp0kJxZAH/xAnCSHg72t3D1PoifimDgjE3dAq1Eg/FbNvW9ye91QT+iqX/I0jLhqUrrUI2esbVKs/4wUE6vP7yg618=</diagram></mxfile>
Loading