@krainovsd/graph 0.12.0-beta.3 → 0.12.0-beta.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/cjs/index.cjs +303 -270
- package/lib/cjs/index.cjs.map +1 -1
- package/lib/esm/constants/link-controls.js +0 -6
- package/lib/esm/constants/link-controls.js.map +1 -1
- package/lib/esm/constants/node-controls.js +71 -24
- package/lib/esm/constants/node-controls.js.map +1 -1
- package/lib/esm/index.js +1 -1
- package/lib/esm/module/GraphCanvas/GraphCanvas.js +15 -17
- package/lib/esm/module/GraphCanvas/GraphCanvas.js.map +1 -1
- package/lib/esm/module/GraphCanvas/constants/link-settings.js +0 -1
- package/lib/esm/module/GraphCanvas/constants/link-settings.js.map +1 -1
- package/lib/esm/module/GraphCanvas/constants/node-settings.js +10 -5
- package/lib/esm/module/GraphCanvas/constants/node-settings.js.map +1 -1
- package/lib/esm/module/GraphCanvas/lib/settings/node-settings-getter.js +20 -4
- package/lib/esm/module/GraphCanvas/lib/settings/node-settings-getter.js.map +1 -1
- package/lib/esm/module/GraphCanvas/lib/utils/is-overlaps-node.js +1 -1
- package/lib/esm/module/GraphCanvas/lib/utils/is-overlaps-node.js.map +1 -1
- package/lib/esm/module/GraphCanvas/lib/utils/link-by-pointer-getter.js +4 -1
- package/lib/esm/module/GraphCanvas/lib/utils/link-by-pointer-getter.js.map +1 -1
- package/lib/esm/module/GraphCanvas/slices/draw-links.js +7 -20
- package/lib/esm/module/GraphCanvas/slices/draw-links.js.map +1 -1
- package/lib/esm/module/GraphCanvas/slices/draw-nodes.js +29 -117
- package/lib/esm/module/GraphCanvas/slices/draw-nodes.js.map +1 -1
- package/lib/esm/module/GraphCanvas/slices/draw-text.js +1 -24
- package/lib/esm/module/GraphCanvas/slices/draw-text.js.map +1 -1
- package/lib/esm/module/GraphCanvas/slices/init-simulation.js +7 -55
- package/lib/esm/module/GraphCanvas/slices/init-simulation.js.map +1 -1
- package/lib/esm/module/GraphCanvas/slices/init-zoom.js +4 -2
- package/lib/esm/module/GraphCanvas/slices/init-zoom.js.map +1 -1
- package/lib/esm/module/GraphCanvas/slices/update-link-cache.js +19 -0
- package/lib/esm/module/GraphCanvas/slices/update-link-cache.js.map +1 -0
- package/lib/esm/module/GraphCanvas/slices/update-node-cache.js +136 -0
- package/lib/esm/module/GraphCanvas/slices/update-node-cache.js.map +1 -0
- package/lib/index.d.ts +28 -28
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"node-settings-getter.js","sources":["../../../../../../src/module/GraphCanvas/lib/settings/node-settings-getter.ts"],"sourcesContent":["import type { ZoomTransform } from \"d3-zoom\";\nimport { colorGetter } from \"@/lib\";\nimport type { GraphCanvas } from \"../../GraphCanvas\";\nimport { NODE_OPTIONS, NODE_SETTINGS } from \"../../constants\";\nimport type { NodeInterface, NodeOptionsInterface, NodeSettingsInterface } from \"../../types\";\n\nexport function nodeSettingsGetter<\n NodeData extends Record<string, unknown>,\n LinkData extends Record<string, unknown>,\n>(\n settings: NodeSettingsInterface<NodeData, LinkData> | undefined,\n prevNodeSettings?: Required<Omit<NodeSettingsInterface<NodeData, LinkData>, \"options\">> &\n Pick<NodeSettingsInterface<NodeData, LinkData>, \"options\">,\n): Required<Omit<NodeSettingsInterface<NodeData, LinkData>, \"options\">> &\n Pick<NodeSettingsInterface<NodeData, LinkData>, \"options\"> {\n return {\n ...(prevNodeSettings ?? NODE_SETTINGS),\n idGetter: nodeIdGetter,\n ...settings,\n };\n}\n\nconst color = colorGetter();\n\nexport function nodeOptionsGetter<\n NodeData extends Record<string, unknown>,\n LinkData extends Record<string, unknown>,\n>(\n this: GraphCanvas<NodeData, LinkData>,\n node: NodeInterface<NodeData>,\n): Required<NodeOptionsInterface<NodeData, LinkData>> {\n const { textShiftY, textSize } = nodeTextSizeGetter(this.areaTransform, this.nodeSettings);\n\n return {\n ...NODE_OPTIONS,\n nodeDraw: null,\n nodeExtraDraw: null,\n textDraw: null,\n textExtraDraw: null,\n color: color(String(node.group ?? \"_DEFAULT\")),\n textVisible: Boolean(this.areaTransform.k > this.nodeSettings.textScaleMin),\n text: node.name ?? node.id.toString(),\n textShiftY,\n textSize,\n };\n}\n\nexport function nodeTextSizeGetter<\n NodeData extends Record<string, unknown>,\n LinkData extends Record<string, unknown>,\n>(\n transform: ZoomTransform | undefined,\n nodeSettings: Required<Omit<NodeSettingsInterface<NodeData, LinkData>, \"options\">> &\n Pick<NodeSettingsInterface<NodeData, LinkData>, \"options\">,\n) {\n let textSize: number = nodeSettings.textSizeMin;\n let textShiftY: number = nodeSettings.textShiftYMin;\n\n if (transform) {\n if (transform.k >= nodeSettings.textScaleMax) {\n textSize = nodeSettings.textSizeMax;\n textShiftY = nodeSettings.textShiftYMax;\n } else if (transform.k > nodeSettings.textScaleMin) {\n textSize =\n nodeSettings.textSizeMin +\n ((transform.k - nodeSettings.textScaleMin) *\n (nodeSettings.textSizeMax - nodeSettings.textSizeMin)) /\n (nodeSettings.textScaleMax - nodeSettings.textScaleMin);\n\n textShiftY =\n nodeSettings.textShiftYMin +\n ((transform.k - nodeSettings.textScaleMin) *\n (nodeSettings.textShiftYMax - nodeSettings.textShiftYMin)) /\n (nodeSettings.textScaleMax - nodeSettings.textScaleMin);\n }\n }\n\n return { textSize, textShiftY };\n}\n\nexport type NodeRadiusGetterOptions = {\n linkCount: number | undefined;\n radiusFlexible: boolean;\n
|
|
1
|
+
{"version":3,"file":"node-settings-getter.js","sources":["../../../../../../src/module/GraphCanvas/lib/settings/node-settings-getter.ts"],"sourcesContent":["import type { ZoomTransform } from \"d3-zoom\";\nimport { colorGetter } from \"@/lib\";\nimport type { GraphCanvas } from \"../../GraphCanvas\";\nimport { NODE_OPTIONS, NODE_SETTINGS } from \"../../constants\";\nimport type { NodeInterface, NodeOptionsInterface, NodeSettingsInterface } from \"../../types\";\n\nexport function nodeSettingsGetter<\n NodeData extends Record<string, unknown>,\n LinkData extends Record<string, unknown>,\n>(\n settings: NodeSettingsInterface<NodeData, LinkData> | undefined,\n prevNodeSettings?: Required<Omit<NodeSettingsInterface<NodeData, LinkData>, \"options\">> &\n Pick<NodeSettingsInterface<NodeData, LinkData>, \"options\">,\n): Required<Omit<NodeSettingsInterface<NodeData, LinkData>, \"options\">> &\n Pick<NodeSettingsInterface<NodeData, LinkData>, \"options\"> {\n return {\n ...(prevNodeSettings ?? NODE_SETTINGS),\n idGetter: nodeIdGetter,\n ...settings,\n };\n}\n\nconst color = colorGetter();\n\nexport function nodeOptionsGetter<\n NodeData extends Record<string, unknown>,\n LinkData extends Record<string, unknown>,\n>(\n this: GraphCanvas<NodeData, LinkData>,\n node: NodeInterface<NodeData>,\n): Required<NodeOptionsInterface<NodeData, LinkData>> {\n const { textShiftY, textSize } = nodeTextSizeGetter(this.areaTransform, this.nodeSettings);\n\n return {\n ...NODE_OPTIONS,\n nodeDraw: null,\n nodeExtraDraw: null,\n textDraw: null,\n textExtraDraw: null,\n color: color(String(node.group ?? \"_DEFAULT\")),\n textVisible: Boolean(this.areaTransform.k > this.nodeSettings.textScaleMin),\n text: node.name ?? node.id.toString(),\n textShiftY,\n textSize,\n };\n}\n\nexport function nodeTextSizeGetter<\n NodeData extends Record<string, unknown>,\n LinkData extends Record<string, unknown>,\n>(\n transform: ZoomTransform | undefined,\n nodeSettings: Required<Omit<NodeSettingsInterface<NodeData, LinkData>, \"options\">> &\n Pick<NodeSettingsInterface<NodeData, LinkData>, \"options\">,\n) {\n let textSize: number = nodeSettings.textSizeMin;\n let textShiftY: number = nodeSettings.textShiftYMin;\n\n if (transform) {\n if (transform.k >= nodeSettings.textScaleMax) {\n textSize = nodeSettings.textSizeMax;\n textShiftY = nodeSettings.textShiftYMax;\n } else if (transform.k > nodeSettings.textScaleMin) {\n textSize =\n nodeSettings.textSizeMin +\n ((transform.k - nodeSettings.textScaleMin) *\n (nodeSettings.textSizeMax - nodeSettings.textSizeMin)) /\n (nodeSettings.textScaleMax - nodeSettings.textScaleMin);\n\n textShiftY =\n nodeSettings.textShiftYMin +\n ((transform.k - nodeSettings.textScaleMin) *\n (nodeSettings.textShiftYMax - nodeSettings.textShiftYMin)) /\n (nodeSettings.textScaleMax - nodeSettings.textScaleMin);\n }\n }\n\n return { textSize, textShiftY };\n}\n\nexport type NodeRadiusGetterOptions = {\n linkCount: number | undefined;\n radiusFlexible: boolean;\n radiusInitial: number;\n radiusLinkCountForStep: number;\n radiusIncrementByStep: number;\n radiusMaxLinearSteps: number;\n radiusLogFactor: number;\n radiusLinkCountDividerForLog: number;\n};\n\nexport function nodeRadiusGetter({\n radiusFlexible,\n linkCount,\n radiusInitial,\n radiusIncrementByStep,\n radiusLinkCountDividerForLog,\n radiusLinkCountForStep,\n radiusLogFactor,\n radiusMaxLinearSteps,\n}: NodeRadiusGetterOptions) {\n if (!radiusFlexible || !linkCount) return radiusInitial;\n const steps = linkCount / radiusLinkCountForStep;\n\n if (steps < radiusMaxLinearSteps) {\n return steps * radiusIncrementByStep + radiusInitial;\n }\n\n return (\n radiusInitial +\n radiusMaxLinearSteps * radiusIncrementByStep +\n radiusLogFactor * Math.log10(linkCount / radiusLinkCountDividerForLog)\n );\n}\n\nexport type NodeSizeGetterOptions = {\n linkCount: number | undefined;\n sizeFlexible: boolean;\n widthInitial: number;\n heightInitial: number;\n sizeLinkCountForStep: number;\n sizeIncrementByStep: number;\n sizeMaxLinearSteps: number;\n sizeLogFactor: number;\n sizeLinkCountDividerForLog: number;\n};\n\nexport function nodeSizeGetter({\n heightInitial,\n linkCount,\n sizeFlexible,\n widthInitial,\n sizeIncrementByStep,\n sizeLinkCountDividerForLog,\n sizeLinkCountForStep,\n sizeLogFactor,\n sizeMaxLinearSteps,\n}: NodeSizeGetterOptions) {\n let additionalSizeCoefficient = 1;\n if (sizeFlexible && linkCount != undefined) {\n const steps = linkCount / sizeLinkCountForStep;\n if (steps < sizeMaxLinearSteps) {\n additionalSizeCoefficient += steps * sizeIncrementByStep;\n } else {\n additionalSizeCoefficient +=\n sizeMaxLinearSteps * sizeIncrementByStep +\n sizeLogFactor * Math.log10(linkCount / sizeLinkCountDividerForLog);\n }\n }\n\n return {\n width: widthInitial * additionalSizeCoefficient,\n height: heightInitial * additionalSizeCoefficient,\n additionalSizeCoefficient,\n };\n}\n\nexport function nodeIdGetter<NodeData extends Record<string, unknown>>(\n node: NodeInterface<NodeData>,\n) {\n return node.id;\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"is-overlaps-node.js","sources":["../../../../../../src/module/GraphCanvas/lib/utils/is-overlaps-node.ts"],"sourcesContent":["import type { NodeInterface } from \"../../types\";\n\nexport function isOverlapsNode<NodeData extends Record<string, unknown>>(\n node: NodeInterface<NodeData>,\n pointerX: number,\n pointerY: number,\n radius: number | undefined,\n) {\n if (node.x == undefined || node.y == undefined) return false;\n\n switch (node._shape) {\n case \"circle\": {\n const nodeRadius = node._radius ?? radius ?? 5;\n const isOverX = node.x - nodeRadius <= pointerX && pointerX <= node.x + nodeRadius;\n const isOverY = node.y - nodeRadius <= pointerY && pointerY <= node.y + nodeRadius;\n\n return isOverX && isOverY;\n }\n case \"square\":\n case \"text\": {\n const width = node._width ?? 5;\n const height = node._height ?? 5;\n const borderRadius = node._borderRadius ?? 0;\n const overlaps =\n Math.abs(pointerX - node.x) <= width / 2 && Math.abs(pointerY - node.y) <= height / 2;\n\n if (node._shape !== \"text\" && borderRadius != undefined && borderRadius > 0 && overlaps) {\n return isCursorOverRoundedRect(\n pointerX,\n pointerY,\n node.x,\n node.y,\n width / 2,\n height / 2,\n borderRadius,\n );\n }\n\n return overlaps;\n }\n default: {\n const nodeRadius = node._radius ?? radius ?? 5;\n const isOverX = node.x - nodeRadius <= pointerX && pointerX <= node.x + nodeRadius;\n const isOverY = node.y - nodeRadius <= pointerY && pointerY <= node.y + nodeRadius;\n\n return isOverX && isOverY;\n }\n }\n}\n\nfunction isCursorOverRoundedRect(\n pointerX: number,\n pointerY: number,\n x: number,\n y: number,\n halfWidth: number,\n halfHeight: number,\n borderRadius: number,\n) {\n const left = x - halfWidth;\n const right = x + halfWidth;\n const top = y - halfHeight;\n const bottom = y + halfHeight;\n\n if (pointerX < left + borderRadius && pointerY < top + borderRadius) {\n const dx = pointerX - (left + borderRadius);\n const dy = pointerY - (top + borderRadius);\n\n return dx * dx + dy * dy <= borderRadius * borderRadius;\n } else if (pointerX > right - borderRadius && pointerY < top + borderRadius) {\n const dx = pointerX - (right - borderRadius);\n const dy = pointerY - (top + borderRadius);\n\n return dx * dx + dy * dy <= borderRadius * borderRadius;\n } else if (pointerX < left + borderRadius && pointerY > bottom - borderRadius) {\n const dx = pointerX - (left + borderRadius);\n const dy = pointerY - (bottom - borderRadius);\n\n return dx * dx + dy * dy <= borderRadius * borderRadius;\n } else if (pointerX > right - borderRadius && pointerY > bottom - borderRadius) {\n const dx = pointerX - (right - borderRadius);\n const dy = pointerY - (bottom - borderRadius);\n\n return dx * dx + dy * dy <= borderRadius * borderRadius;\n }\n\n return true;\n}\n"],"names":[],"mappings":"AAEM,SAAU,cAAc,CAC5B,IAA6B,EAC7B,QAAgB,EAChB,QAAgB,EAChB,MAA0B,EAAA;
|
|
1
|
+
{"version":3,"file":"is-overlaps-node.js","sources":["../../../../../../src/module/GraphCanvas/lib/utils/is-overlaps-node.ts"],"sourcesContent":["import type { NodeInterface } from \"../../types\";\n\nexport function isOverlapsNode<NodeData extends Record<string, unknown>>(\n node: NodeInterface<NodeData>,\n pointerX: number,\n pointerY: number,\n radius: number | undefined,\n) {\n if (node.x == undefined || node.y == undefined || node.visible === false) return false;\n\n switch (node._shape) {\n case \"circle\": {\n const nodeRadius = node._radius ?? radius ?? 5;\n const isOverX = node.x - nodeRadius <= pointerX && pointerX <= node.x + nodeRadius;\n const isOverY = node.y - nodeRadius <= pointerY && pointerY <= node.y + nodeRadius;\n\n return isOverX && isOverY;\n }\n case \"square\":\n case \"text\": {\n const width = node._width ?? 5;\n const height = node._height ?? 5;\n const borderRadius = node._borderRadius ?? 0;\n const overlaps =\n Math.abs(pointerX - node.x) <= width / 2 && Math.abs(pointerY - node.y) <= height / 2;\n\n if (node._shape !== \"text\" && borderRadius != undefined && borderRadius > 0 && overlaps) {\n return isCursorOverRoundedRect(\n pointerX,\n pointerY,\n node.x,\n node.y,\n width / 2,\n height / 2,\n borderRadius,\n );\n }\n\n return overlaps;\n }\n default: {\n const nodeRadius = node._radius ?? radius ?? 5;\n const isOverX = node.x - nodeRadius <= pointerX && pointerX <= node.x + nodeRadius;\n const isOverY = node.y - nodeRadius <= pointerY && pointerY <= node.y + nodeRadius;\n\n return isOverX && isOverY;\n }\n }\n}\n\nfunction isCursorOverRoundedRect(\n pointerX: number,\n pointerY: number,\n x: number,\n y: number,\n halfWidth: number,\n halfHeight: number,\n borderRadius: number,\n) {\n const left = x - halfWidth;\n const right = x + halfWidth;\n const top = y - halfHeight;\n const bottom = y + halfHeight;\n\n if (pointerX < left + borderRadius && pointerY < top + borderRadius) {\n const dx = pointerX - (left + borderRadius);\n const dy = pointerY - (top + borderRadius);\n\n return dx * dx + dy * dy <= borderRadius * borderRadius;\n } else if (pointerX > right - borderRadius && pointerY < top + borderRadius) {\n const dx = pointerX - (right - borderRadius);\n const dy = pointerY - (top + borderRadius);\n\n return dx * dx + dy * dy <= borderRadius * borderRadius;\n } else if (pointerX < left + borderRadius && pointerY > bottom - borderRadius) {\n const dx = pointerX - (left + borderRadius);\n const dy = pointerY - (bottom - borderRadius);\n\n return dx * dx + dy * dy <= borderRadius * borderRadius;\n } else if (pointerX > right - borderRadius && pointerY > bottom - borderRadius) {\n const dx = pointerX - (right - borderRadius);\n const dy = pointerY - (bottom - borderRadius);\n\n return dx * dx + dy * dy <= borderRadius * borderRadius;\n }\n\n return true;\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -12,7 +12,10 @@ function linkByPointerGetter({ areaRect, areaTransform, mouseEvent, links, linkH
|
|
|
12
12
|
});
|
|
13
13
|
}
|
|
14
14
|
function isNearLink(mouseX, mouseY, link, threshold = 2) {
|
|
15
|
-
if (!isObject(link.source) ||
|
|
15
|
+
if (!isObject(link.source) ||
|
|
16
|
+
!isObject(link.target) ||
|
|
17
|
+
link.source.visible === false ||
|
|
18
|
+
link.target.visible === false)
|
|
16
19
|
return false;
|
|
17
20
|
const x1 = link.source.x;
|
|
18
21
|
const y1 = link.source.y;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"link-by-pointer-getter.js","sources":["../../../../../../src/module/GraphCanvas/lib/utils/link-by-pointer-getter.ts"],"sourcesContent":["import { isObject } from \"@krainovsd/js-helpers\";\nimport { greatest } from \"d3-array\";\nimport type { ZoomTransform } from \"d3-zoom\";\nimport type { LinkInterface } from \"../../types\";\nimport { pointerGetter } from \"./pointer-getter\";\n\nexport type LinkByPointerGetterOptions<\n NodeData extends Record<string, unknown>,\n LinkData extends Record<string, unknown>,\n> = {\n mouseEvent: MouseEvent | TouchEvent;\n areaRect: DOMRect | undefined;\n areaTransform: ZoomTransform;\n links: LinkInterface<NodeData, LinkData>[];\n linkHoverExtraZone: number;\n};\n\nexport function linkByPointerGetter<\n NodeData extends Record<string, unknown>,\n LinkData extends Record<string, unknown>,\n>({\n areaRect,\n areaTransform,\n mouseEvent,\n links,\n linkHoverExtraZone,\n}: LinkByPointerGetterOptions<NodeData, LinkData>): LinkInterface<NodeData, LinkData> | undefined {\n if (!areaRect) return undefined;\n\n const [pointerX, pointerY] = pointerGetter(mouseEvent, areaRect, areaTransform);\n\n return greatest(links, (link) => {\n if (isNearLink(pointerX, pointerY, link, linkHoverExtraZone)) return link.index;\n });\n}\n\nfunction isNearLink<\n NodeData extends Record<string, unknown>,\n LinkData extends Record<string, unknown>,\n>(mouseX: number, mouseY: number, link: LinkInterface<NodeData, LinkData>, threshold = 2) {\n if (!isObject(link.source)
|
|
1
|
+
{"version":3,"file":"link-by-pointer-getter.js","sources":["../../../../../../src/module/GraphCanvas/lib/utils/link-by-pointer-getter.ts"],"sourcesContent":["import { isObject } from \"@krainovsd/js-helpers\";\nimport { greatest } from \"d3-array\";\nimport type { ZoomTransform } from \"d3-zoom\";\nimport type { LinkInterface } from \"../../types\";\nimport { pointerGetter } from \"./pointer-getter\";\n\nexport type LinkByPointerGetterOptions<\n NodeData extends Record<string, unknown>,\n LinkData extends Record<string, unknown>,\n> = {\n mouseEvent: MouseEvent | TouchEvent;\n areaRect: DOMRect | undefined;\n areaTransform: ZoomTransform;\n links: LinkInterface<NodeData, LinkData>[];\n linkHoverExtraZone: number;\n};\n\nexport function linkByPointerGetter<\n NodeData extends Record<string, unknown>,\n LinkData extends Record<string, unknown>,\n>({\n areaRect,\n areaTransform,\n mouseEvent,\n links,\n linkHoverExtraZone,\n}: LinkByPointerGetterOptions<NodeData, LinkData>): LinkInterface<NodeData, LinkData> | undefined {\n if (!areaRect) return undefined;\n\n const [pointerX, pointerY] = pointerGetter(mouseEvent, areaRect, areaTransform);\n\n return greatest(links, (link) => {\n if (isNearLink(pointerX, pointerY, link, linkHoverExtraZone)) return link.index;\n });\n}\n\nfunction isNearLink<\n NodeData extends Record<string, unknown>,\n LinkData extends Record<string, unknown>,\n>(mouseX: number, mouseY: number, link: LinkInterface<NodeData, LinkData>, threshold = 2) {\n if (\n !isObject(link.source) ||\n !isObject(link.target) ||\n link.source.visible === false ||\n link.target.visible === false\n )\n return false;\n\n const x1 = link.source.x as number;\n const y1 = link.source.y as number;\n const x2 = link.target.x as number;\n const y2 = link.target.y as number;\n\n const distance = distanceToLine(mouseX, mouseY, x1, y1, x2, y2);\n\n return distance <= threshold;\n}\n\nfunction distanceToLine(x: number, y: number, x1: number, y1: number, x2: number, y2: number) {\n const A = x - x1;\n const B = y - y1;\n const C = x2 - x1;\n const D = y2 - y1;\n\n const dot = A * C + B * D;\n const lenSq = C * C + D * D;\n let param = -1;\n\n if (lenSq !== 0) {\n param = dot / lenSq;\n }\n\n let xx, yy;\n\n if (param < 0) {\n xx = x1;\n yy = y1;\n } else if (param > 1) {\n xx = x2;\n yy = y2;\n } else {\n xx = x1 + param * C;\n yy = y1 + param * D;\n }\n\n const dx = x - xx;\n const dy = y - yy;\n\n return Math.sqrt(dx * dx + dy * dy);\n}\n"],"names":[],"mappings":";;;;AAiBgB,SAAA,mBAAmB,CAGjC,EACA,QAAQ,EACR,aAAa,EACb,UAAU,EACV,KAAK,EACL,kBAAkB,GAC6B,EAAA;AAC/C,IAAA,IAAI,CAAC,QAAQ;AAAE,QAAA,OAAO,SAAS;AAE/B,IAAA,MAAM,CAAC,QAAQ,EAAE,QAAQ,CAAC,GAAG,aAAa,CAAC,UAAU,EAAE,QAAQ,EAAE,aAAa,CAAC;AAE/E,IAAA,OAAO,QAAQ,CAAC,KAAK,EAAE,CAAC,IAAI,KAAI;QAC9B,IAAI,UAAU,CAAC,QAAQ,EAAE,QAAQ,EAAE,IAAI,EAAE,kBAAkB,CAAC;YAAE,OAAO,IAAI,CAAC,KAAK;AACjF,KAAC,CAAC;AACJ;AAEA,SAAS,UAAU,CAGjB,MAAc,EAAE,MAAc,EAAE,IAAuC,EAAE,SAAS,GAAG,CAAC,EAAA;AACtF,IAAA,IACE,CAAC,QAAQ,CAAC,IAAI,CAAC,MAAM,CAAC;AACtB,QAAA,CAAC,QAAQ,CAAC,IAAI,CAAC,MAAM,CAAC;AACtB,QAAA,IAAI,CAAC,MAAM,CAAC,OAAO,KAAK,KAAK;AAC7B,QAAA,IAAI,CAAC,MAAM,CAAC,OAAO,KAAK,KAAK;AAE7B,QAAA,OAAO,KAAK;AAEd,IAAA,MAAM,EAAE,GAAG,IAAI,CAAC,MAAM,CAAC,CAAW;AAClC,IAAA,MAAM,EAAE,GAAG,IAAI,CAAC,MAAM,CAAC,CAAW;AAClC,IAAA,MAAM,EAAE,GAAG,IAAI,CAAC,MAAM,CAAC,CAAW;AAClC,IAAA,MAAM,EAAE,GAAG,IAAI,CAAC,MAAM,CAAC,CAAW;AAElC,IAAA,MAAM,QAAQ,GAAG,cAAc,CAAC,MAAM,EAAE,MAAM,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC;IAE/D,OAAO,QAAQ,IAAI,SAAS;AAC9B;AAEA,SAAS,cAAc,CAAC,CAAS,EAAE,CAAS,EAAE,EAAU,EAAE,EAAU,EAAE,EAAU,EAAE,EAAU,EAAA;AAC1F,IAAA,MAAM,CAAC,GAAG,CAAC,GAAG,EAAE;AAChB,IAAA,MAAM,CAAC,GAAG,CAAC,GAAG,EAAE;AAChB,IAAA,MAAM,CAAC,GAAG,EAAE,GAAG,EAAE;AACjB,IAAA,MAAM,CAAC,GAAG,EAAE,GAAG,EAAE;IAEjB,MAAM,GAAG,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC;IACzB,MAAM,KAAK,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC;AAC3B,IAAA,IAAI,KAAK,GAAG,EAAE;AAEd,IAAA,IAAI,KAAK,KAAK,CAAC,EAAE;AACf,QAAA,KAAK,GAAG,GAAG,GAAG,KAAK;;IAGrB,IAAI,EAAE,EAAE,EAAE;AAEV,IAAA,IAAI,KAAK,GAAG,CAAC,EAAE;QACb,EAAE,GAAG,EAAE;QACP,EAAE,GAAG,EAAE;;AACF,SAAA,IAAI,KAAK,GAAG,CAAC,EAAE;QACpB,EAAE,GAAG,EAAE;QACP,EAAE,GAAG,EAAE;;SACF;AACL,QAAA,EAAE,GAAG,EAAE,GAAG,KAAK,GAAG,CAAC;AACnB,QAAA,EAAE,GAAG,EAAE,GAAG,KAAK,GAAG,CAAC;;AAGrB,IAAA,MAAM,EAAE,GAAG,CAAC,GAAG,EAAE;AACjB,IAAA,MAAM,EAAE,GAAG,CAAC,GAAG,EAAE;AAEjB,IAAA,OAAO,IAAI,CAAC,IAAI,CAAC,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC;AACrC;;;;"}
|
|
@@ -1,13 +1,11 @@
|
|
|
1
|
-
import { linkOptionsGetter } from '../lib/settings/link-settings-getter.js';
|
|
2
1
|
import '@krainovsd/js-helpers';
|
|
3
|
-
import { linkIterationExtractor } from '../lib/utils/link-iteration-extractor.js';
|
|
4
2
|
import 'd3-array';
|
|
5
3
|
import { calculateLinkPositionByNode } from '../lib/utils/calculate-link-position-by-node.js';
|
|
6
4
|
import { getParticlePosition } from '../lib/utils/get-particle-position.js';
|
|
7
5
|
import { linkFade, linkHighlight } from '../lib/utils/link-highlight.js';
|
|
8
6
|
|
|
9
7
|
function getDrawLink() {
|
|
10
|
-
return function drawLink(link
|
|
8
|
+
return function drawLink(link) {
|
|
11
9
|
if (!this.context ||
|
|
12
10
|
typeof link.source !== "object" ||
|
|
13
11
|
typeof link.target !== "object" ||
|
|
@@ -23,16 +21,9 @@ function getDrawLink() {
|
|
|
23
21
|
if (!link.source._visible && !link.target._visible)
|
|
24
22
|
return;
|
|
25
23
|
const id = `${link.target.id}${link.source.id}`;
|
|
26
|
-
|
|
27
|
-
if (
|
|
28
|
-
|
|
29
|
-
}
|
|
30
|
-
else {
|
|
31
|
-
linkOptions = linkIterationExtractor(link, index, this.links, this, this.linkSettings.options ?? {}, linkOptionsGetter);
|
|
32
|
-
if (this.linkSettings.cacheOptions) {
|
|
33
|
-
this.linkOptionsCache[id] = linkOptions;
|
|
34
|
-
}
|
|
35
|
-
}
|
|
24
|
+
const linkOptions = this.linkOptionsCache[id];
|
|
25
|
+
if (!linkOptions)
|
|
26
|
+
return;
|
|
36
27
|
if (linkOptions.drawLink) {
|
|
37
28
|
linkOptions.drawLink.call(this, link, linkOptions);
|
|
38
29
|
return;
|
|
@@ -129,7 +120,9 @@ function getDrawLink() {
|
|
|
129
120
|
let xEnd = link.target.x;
|
|
130
121
|
let yEnd = link.target.y;
|
|
131
122
|
let linkDistance = 0;
|
|
132
|
-
if (this.linkSettings.prettyDraw ||
|
|
123
|
+
if (this.linkSettings.prettyDraw ||
|
|
124
|
+
this.linkSettings.particleFlexSpeed ||
|
|
125
|
+
(this.linkSettings.arrow && arrowAlpha > 0)) {
|
|
133
126
|
const isHasArrow = this.linkSettings.arrow && arrowAlpha > 0;
|
|
134
127
|
const position = calculateLinkPositionByNode(link, isHasArrow ? arrowSize : 0);
|
|
135
128
|
if (position) {
|
|
@@ -210,12 +203,6 @@ function getDrawLink() {
|
|
|
210
203
|
}
|
|
211
204
|
/** Arrow */
|
|
212
205
|
if (this.linkSettings.arrow && arrowAlpha > 0) {
|
|
213
|
-
const { x1: xStart, x2: xEnd, y1: yStart, y2: yEnd, } = calculateLinkPositionByNode(link) ?? {
|
|
214
|
-
x1: 0,
|
|
215
|
-
x2: 0,
|
|
216
|
-
y1: 0,
|
|
217
|
-
y2: 0,
|
|
218
|
-
};
|
|
219
206
|
this.context.beginPath();
|
|
220
207
|
this.context.globalAlpha = arrowAlpha;
|
|
221
208
|
this.context.strokeStyle = arrowBorderColor;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"draw-links.js","sources":["../../../../../src/module/GraphCanvas/slices/draw-links.ts"],"sourcesContent":["import type { GraphCanvas } from \"../GraphCanvas\";\nimport {\n calculateLinkPositionByNode,\n getParticlePosition,\n linkFade,\n linkHighlight,\n linkIterationExtractor,\n linkOptionsGetter,\n} from \"../lib\";\nimport type { LinkInterface, LinkOptionsInterface, LinkParticle } from \"../types\";\n\nexport function getDrawLink<\n NodeData extends Record<string, unknown>,\n LinkData extends Record<string, unknown>,\n>() {\n return function drawLink(\n this: GraphCanvas<NodeData, LinkData>,\n link: LinkInterface<NodeData, LinkData>,\n index: number,\n ) {\n if (\n !this.context ||\n typeof link.source !== \"object\" ||\n typeof link.target !== \"object\" ||\n !link.source.x ||\n !link.source.y ||\n !link.target.x ||\n !link.target.y\n )\n return;\n\n if (\n (link.visible != undefined && !link.visible) ||\n (link.source.visible != undefined && !link.source.visible) ||\n (link.target.visible != undefined && !link.target.visible)\n )\n return;\n\n if (!link.source._visible && !link.target._visible) return;\n\n const id = `${link.target.id}${link.source.id}`;\n let linkOptions: Required<LinkOptionsInterface<NodeData, LinkData>>;\n if (this.linkSettings.cacheOptions && this.linkOptionsCache[id]) {\n linkOptions = this.linkOptionsCache[id];\n } else {\n linkOptions = linkIterationExtractor(\n link,\n index,\n this.links,\n this,\n this.linkSettings.options ?? {},\n linkOptionsGetter,\n );\n if (this.linkSettings.cacheOptions) {\n this.linkOptionsCache[id] = linkOptions;\n }\n }\n\n if (linkOptions.drawLink) {\n linkOptions.drawLink.call(this, link, linkOptions);\n\n return;\n }\n\n let alpha = linkOptions.alpha;\n let color = linkOptions.color;\n let width = linkOptions.width;\n let arrowAlpha = this.linkSettings.arrowByHighlight ? 0 : linkOptions.arrowAlpha;\n let arrowColor = linkOptions.arrowColor;\n let arrowSize = linkOptions.arrowSize;\n let arrowBorderWidth = linkOptions.arrowBorderWidth;\n let arrowBorderColor = linkOptions.arrowBorderColor;\n\n /** Highlight */\n if (this.highlightedNeighbors && this.highlightedNode) {\n /** By Node Not Highlight */\n if (this.highlightedNode.id != link.source.id && this.highlightedNode.id != link.target.id) {\n const fadeOptions = linkFade({\n arrow: this.linkSettings.arrow,\n arrowByHighlight: this.linkSettings.arrowByHighlight,\n linkOptions,\n highlightProgress: this.highlightProgress,\n highlightForArrowFadingMin: this.highlightSettings.highlightByNodeForArrowFadingMin,\n highlightForLinkFadingMin: this.highlightSettings.highlightByNodeForLinkFadingMin,\n });\n alpha = fadeOptions.alpha;\n arrowAlpha = fadeOptions.arrowAlpha;\n } else {\n const highlightOptions = linkHighlight({\n arrow: this.linkSettings.arrow,\n arrowByHighlight: this.linkSettings.arrowByHighlight,\n linkOptions,\n highlightProgress: this.highlightProgress,\n highlightForArrowBorderColor: this.highlightSettings.highlightByNodeForArrowBorderColor,\n highlightForArrowBorderSizingAdditional:\n this.highlightSettings.highlightByNodeForArrowBorderSizingAdditional,\n highlightForArrowColor: this.highlightSettings.highlightByNodeForArrowColor,\n highlightForArrowSizeAdditional:\n this.highlightSettings.highlightByNodeForArrowSizeAdditional,\n highlightForLinkColor: this.highlightSettings.highlightByNodeForLinkColor,\n highlightForLinkSizeAdditional:\n this.highlightSettings.highlightByNodeForLinkSizeAdditional,\n });\n arrowAlpha = highlightOptions.arrowAlpha;\n color = highlightOptions.color;\n width = highlightOptions.width;\n arrowColor = highlightOptions.arrowColor;\n arrowSize = highlightOptions.arrowSize;\n arrowBorderWidth = highlightOptions.arrowBorderWidth;\n arrowBorderColor = highlightOptions.arrowBorderColor;\n }\n }\n if (this.highlightedNeighbors && this.highlightedLink) {\n /** By Link Not Highlight */\n if (this.highlightedLink !== link) {\n const fadeOptions = linkFade({\n arrow: this.linkSettings.arrow,\n arrowByHighlight: this.linkSettings.arrowByHighlight,\n linkOptions,\n highlightProgress: this.highlightProgress,\n highlightForArrowFadingMin: this.highlightSettings.highlightByLinkForArrowFadingMin,\n highlightForLinkFadingMin: this.highlightSettings.highlightByLinkForLinkFadingMin,\n });\n alpha = fadeOptions.alpha;\n arrowAlpha = fadeOptions.arrowAlpha;\n } else {\n /** By Link Highlight */\n const highlightOptions = linkHighlight({\n arrow: this.linkSettings.arrow,\n arrowByHighlight: this.linkSettings.arrowByHighlight,\n linkOptions,\n highlightProgress: this.highlightProgress,\n highlightForArrowBorderColor: this.highlightSettings.highlightByLinkForArrowBorderColor,\n highlightForArrowBorderSizingAdditional:\n this.highlightSettings.highlightByLinkForArrowBorderSizingAdditional,\n highlightForArrowColor: this.highlightSettings.highlightByLinkForArrowColor,\n highlightForArrowSizeAdditional:\n this.highlightSettings.highlightByLinkForArrowSizeAdditional,\n highlightForLinkColor: this.highlightSettings.highlightByLinkForLinkColor,\n highlightForLinkSizeAdditional:\n this.highlightSettings.highlightByLinkForLinkSizeAdditional,\n });\n arrowAlpha = highlightOptions.arrowAlpha;\n color = highlightOptions.color;\n width = highlightOptions.width;\n arrowColor = highlightOptions.arrowColor;\n arrowSize = highlightOptions.arrowSize;\n arrowBorderWidth = highlightOptions.arrowBorderWidth;\n arrowBorderColor = highlightOptions.arrowBorderColor;\n }\n }\n\n /** Link */\n this.context.beginPath();\n\n this.context.globalAlpha = alpha;\n this.context.strokeStyle = color;\n this.context.lineWidth = width;\n\n let xStart = link.source.x;\n let yStart = link.source.y;\n let xEnd = link.target.x;\n let yEnd = link.target.y;\n let linkDistance = 0;\n if (this.linkSettings.prettyDraw || this.linkSettings.particleFlexSpeed) {\n const isHasArrow = this.linkSettings.arrow && arrowAlpha > 0;\n const position = calculateLinkPositionByNode(link, isHasArrow ? arrowSize : 0);\n\n if (position) {\n xStart = position.x1;\n xEnd = position.x2;\n yStart = position.y1;\n yEnd = position.y2;\n linkDistance = position.distance;\n }\n }\n this.context.moveTo(xStart, yStart);\n this.context.lineTo(xEnd, yEnd);\n this.context.stroke();\n\n /** Particle */\n if (\n this.linkSettings.particles &&\n ((this.highlightedNode &&\n (this.highlightedNode.id === link.source.id ||\n this.highlightedNode.id === link.target.id)) ||\n (this.highlightedLink && this.highlightedLink === link))\n ) {\n const particleSteps = this.linkSettings.particleFlexSpeed\n ? linkDistance <= 0\n ? 0\n : linkDistance * this.linkSettings.particleFlexSpeedCoefficient\n : linkOptions.particleSteps;\n const particleCount = linkOptions.particleCount;\n\n if (!this.particles[id]) {\n const sourceId = link.source.id;\n const targetId = link.target.id;\n\n const particles: LinkParticle[] = [];\n let prevParticle: LinkParticle | undefined;\n\n for (let i = 0; i < particleCount; i++) {\n const particle: LinkParticle = {\n step: 0,\n sourceId,\n targetId,\n prev: prevParticle,\n next: undefined,\n index: i,\n };\n if (prevParticle) prevParticle.next = particle;\n particles.push(particle);\n prevParticle = particle;\n }\n if (particles.length >= 2) {\n particles[0].prev = particles[particles.length - 1];\n particles[particles.length - 1].next = particles[0];\n }\n this.particles[id] = particles;\n }\n\n if (particleSteps !== 0) {\n this.particles[id].forEach((particle) => {\n if (!this.context) return;\n\n const distance = particleSteps / particleCount;\n getParticlePosition({\n distance,\n particle,\n totalSteps: particleSteps,\n totalCount: particleCount,\n xEnd,\n xStart,\n yEnd,\n yStart,\n });\n if (particle.x != undefined && particle.y != undefined) {\n this.context.beginPath();\n this.context.strokeStyle = linkOptions.particleBorderColor;\n this.context.lineWidth = linkOptions.particleBorderWidth;\n this.context.arc(particle.x, particle.y, linkOptions.particleRadius, 0, Math.PI * 2);\n this.context.fillStyle = linkOptions.particleColor;\n this.context.fill();\n if (linkOptions.particleBorderWidth > 0) {\n this.context.stroke();\n }\n }\n });\n }\n }\n\n /** Arrow */\n if (this.linkSettings.arrow && arrowAlpha > 0) {\n const {\n x1: xStart,\n x2: xEnd,\n y1: yStart,\n y2: yEnd,\n } = calculateLinkPositionByNode(link) ?? {\n x1: 0,\n x2: 0,\n y1: 0,\n y2: 0,\n };\n\n this.context.beginPath();\n this.context.globalAlpha = arrowAlpha;\n this.context.strokeStyle = arrowBorderColor;\n this.context.lineWidth = arrowBorderWidth;\n this.context.fillStyle = arrowColor;\n const angle = Math.atan2(yEnd - yStart, xEnd - xStart);\n this.context.moveTo(xEnd, yEnd);\n this.context.lineTo(\n xEnd - arrowSize * Math.cos(angle - Math.PI / 6),\n yEnd - arrowSize * Math.sin(angle - Math.PI / 6),\n );\n this.context.lineTo(\n xEnd - arrowSize * Math.cos(angle + Math.PI / 6),\n yEnd - arrowSize * Math.sin(angle + Math.PI / 6),\n );\n this.context.closePath();\n this.context.fill();\n if (arrowBorderWidth > 0) {\n this.context.stroke();\n }\n }\n\n if (linkOptions.drawExtraLink) {\n linkOptions.drawExtraLink.call(this, link, { ...linkOptions, alpha });\n }\n };\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"draw-links.js","sources":["../../../../../src/module/GraphCanvas/slices/draw-links.ts"],"sourcesContent":["import type { GraphCanvas } from \"../GraphCanvas\";\nimport { calculateLinkPositionByNode, getParticlePosition, linkFade, linkHighlight } from \"../lib\";\nimport type { LinkInterface, LinkParticle } from \"../types\";\n\nexport function getDrawLink<\n NodeData extends Record<string, unknown>,\n LinkData extends Record<string, unknown>,\n>() {\n return function drawLink(\n this: GraphCanvas<NodeData, LinkData>,\n link: LinkInterface<NodeData, LinkData>,\n ) {\n if (\n !this.context ||\n typeof link.source !== \"object\" ||\n typeof link.target !== \"object\" ||\n !link.source.x ||\n !link.source.y ||\n !link.target.x ||\n !link.target.y\n )\n return;\n\n if (\n (link.visible != undefined && !link.visible) ||\n (link.source.visible != undefined && !link.source.visible) ||\n (link.target.visible != undefined && !link.target.visible)\n )\n return;\n\n if (!link.source._visible && !link.target._visible) return;\n\n const id = `${link.target.id}${link.source.id}`;\n const linkOptions = this.linkOptionsCache[id];\n if (!linkOptions) return;\n\n if (linkOptions.drawLink) {\n linkOptions.drawLink.call(this, link, linkOptions);\n\n return;\n }\n\n let alpha = linkOptions.alpha;\n let color = linkOptions.color;\n let width = linkOptions.width;\n let arrowAlpha = this.linkSettings.arrowByHighlight ? 0 : linkOptions.arrowAlpha;\n let arrowColor = linkOptions.arrowColor;\n let arrowSize = linkOptions.arrowSize;\n let arrowBorderWidth = linkOptions.arrowBorderWidth;\n let arrowBorderColor = linkOptions.arrowBorderColor;\n\n /** Highlight */\n if (this.highlightedNeighbors && this.highlightedNode) {\n /** By Node Not Highlight */\n if (this.highlightedNode.id != link.source.id && this.highlightedNode.id != link.target.id) {\n const fadeOptions = linkFade({\n arrow: this.linkSettings.arrow,\n arrowByHighlight: this.linkSettings.arrowByHighlight,\n linkOptions,\n highlightProgress: this.highlightProgress,\n highlightForArrowFadingMin: this.highlightSettings.highlightByNodeForArrowFadingMin,\n highlightForLinkFadingMin: this.highlightSettings.highlightByNodeForLinkFadingMin,\n });\n alpha = fadeOptions.alpha;\n arrowAlpha = fadeOptions.arrowAlpha;\n } else {\n const highlightOptions = linkHighlight({\n arrow: this.linkSettings.arrow,\n arrowByHighlight: this.linkSettings.arrowByHighlight,\n linkOptions,\n highlightProgress: this.highlightProgress,\n highlightForArrowBorderColor: this.highlightSettings.highlightByNodeForArrowBorderColor,\n highlightForArrowBorderSizingAdditional:\n this.highlightSettings.highlightByNodeForArrowBorderSizingAdditional,\n highlightForArrowColor: this.highlightSettings.highlightByNodeForArrowColor,\n highlightForArrowSizeAdditional:\n this.highlightSettings.highlightByNodeForArrowSizeAdditional,\n highlightForLinkColor: this.highlightSettings.highlightByNodeForLinkColor,\n highlightForLinkSizeAdditional:\n this.highlightSettings.highlightByNodeForLinkSizeAdditional,\n });\n arrowAlpha = highlightOptions.arrowAlpha;\n color = highlightOptions.color;\n width = highlightOptions.width;\n arrowColor = highlightOptions.arrowColor;\n arrowSize = highlightOptions.arrowSize;\n arrowBorderWidth = highlightOptions.arrowBorderWidth;\n arrowBorderColor = highlightOptions.arrowBorderColor;\n }\n }\n if (this.highlightedNeighbors && this.highlightedLink) {\n /** By Link Not Highlight */\n if (this.highlightedLink !== link) {\n const fadeOptions = linkFade({\n arrow: this.linkSettings.arrow,\n arrowByHighlight: this.linkSettings.arrowByHighlight,\n linkOptions,\n highlightProgress: this.highlightProgress,\n highlightForArrowFadingMin: this.highlightSettings.highlightByLinkForArrowFadingMin,\n highlightForLinkFadingMin: this.highlightSettings.highlightByLinkForLinkFadingMin,\n });\n alpha = fadeOptions.alpha;\n arrowAlpha = fadeOptions.arrowAlpha;\n } else {\n /** By Link Highlight */\n const highlightOptions = linkHighlight({\n arrow: this.linkSettings.arrow,\n arrowByHighlight: this.linkSettings.arrowByHighlight,\n linkOptions,\n highlightProgress: this.highlightProgress,\n highlightForArrowBorderColor: this.highlightSettings.highlightByLinkForArrowBorderColor,\n highlightForArrowBorderSizingAdditional:\n this.highlightSettings.highlightByLinkForArrowBorderSizingAdditional,\n highlightForArrowColor: this.highlightSettings.highlightByLinkForArrowColor,\n highlightForArrowSizeAdditional:\n this.highlightSettings.highlightByLinkForArrowSizeAdditional,\n highlightForLinkColor: this.highlightSettings.highlightByLinkForLinkColor,\n highlightForLinkSizeAdditional:\n this.highlightSettings.highlightByLinkForLinkSizeAdditional,\n });\n arrowAlpha = highlightOptions.arrowAlpha;\n color = highlightOptions.color;\n width = highlightOptions.width;\n arrowColor = highlightOptions.arrowColor;\n arrowSize = highlightOptions.arrowSize;\n arrowBorderWidth = highlightOptions.arrowBorderWidth;\n arrowBorderColor = highlightOptions.arrowBorderColor;\n }\n }\n\n /** Link */\n this.context.beginPath();\n\n this.context.globalAlpha = alpha;\n this.context.strokeStyle = color;\n this.context.lineWidth = width;\n\n let xStart = link.source.x;\n let yStart = link.source.y;\n let xEnd = link.target.x;\n let yEnd = link.target.y;\n let linkDistance = 0;\n if (\n this.linkSettings.prettyDraw ||\n this.linkSettings.particleFlexSpeed ||\n (this.linkSettings.arrow && arrowAlpha > 0)\n ) {\n const isHasArrow = this.linkSettings.arrow && arrowAlpha > 0;\n const position = calculateLinkPositionByNode(link, isHasArrow ? arrowSize : 0);\n\n if (position) {\n xStart = position.x1;\n xEnd = position.x2;\n yStart = position.y1;\n yEnd = position.y2;\n linkDistance = position.distance;\n }\n }\n this.context.moveTo(xStart, yStart);\n this.context.lineTo(xEnd, yEnd);\n this.context.stroke();\n\n /** Particle */\n if (\n this.linkSettings.particles &&\n ((this.highlightedNode &&\n (this.highlightedNode.id === link.source.id ||\n this.highlightedNode.id === link.target.id)) ||\n (this.highlightedLink && this.highlightedLink === link))\n ) {\n const particleSteps = this.linkSettings.particleFlexSpeed\n ? linkDistance <= 0\n ? 0\n : linkDistance * this.linkSettings.particleFlexSpeedCoefficient\n : linkOptions.particleSteps;\n const particleCount = linkOptions.particleCount;\n\n if (!this.particles[id]) {\n const sourceId = link.source.id;\n const targetId = link.target.id;\n\n const particles: LinkParticle[] = [];\n let prevParticle: LinkParticle | undefined;\n\n for (let i = 0; i < particleCount; i++) {\n const particle: LinkParticle = {\n step: 0,\n sourceId,\n targetId,\n prev: prevParticle,\n next: undefined,\n index: i,\n };\n if (prevParticle) prevParticle.next = particle;\n particles.push(particle);\n prevParticle = particle;\n }\n if (particles.length >= 2) {\n particles[0].prev = particles[particles.length - 1];\n particles[particles.length - 1].next = particles[0];\n }\n this.particles[id] = particles;\n }\n\n if (particleSteps !== 0) {\n this.particles[id].forEach((particle) => {\n if (!this.context) return;\n\n const distance = particleSteps / particleCount;\n getParticlePosition({\n distance,\n particle,\n totalSteps: particleSteps,\n totalCount: particleCount,\n xEnd,\n xStart,\n yEnd,\n yStart,\n });\n if (particle.x != undefined && particle.y != undefined) {\n this.context.beginPath();\n this.context.strokeStyle = linkOptions.particleBorderColor;\n this.context.lineWidth = linkOptions.particleBorderWidth;\n this.context.arc(particle.x, particle.y, linkOptions.particleRadius, 0, Math.PI * 2);\n this.context.fillStyle = linkOptions.particleColor;\n this.context.fill();\n if (linkOptions.particleBorderWidth > 0) {\n this.context.stroke();\n }\n }\n });\n }\n }\n\n /** Arrow */\n if (this.linkSettings.arrow && arrowAlpha > 0) {\n this.context.beginPath();\n this.context.globalAlpha = arrowAlpha;\n this.context.strokeStyle = arrowBorderColor;\n this.context.lineWidth = arrowBorderWidth;\n this.context.fillStyle = arrowColor;\n const angle = Math.atan2(yEnd - yStart, xEnd - xStart);\n this.context.moveTo(xEnd, yEnd);\n this.context.lineTo(\n xEnd - arrowSize * Math.cos(angle - Math.PI / 6),\n yEnd - arrowSize * Math.sin(angle - Math.PI / 6),\n );\n this.context.lineTo(\n xEnd - arrowSize * Math.cos(angle + Math.PI / 6),\n yEnd - arrowSize * Math.sin(angle + Math.PI / 6),\n );\n this.context.closePath();\n this.context.fill();\n if (arrowBorderWidth > 0) {\n this.context.stroke();\n }\n }\n\n if (linkOptions.drawExtraLink) {\n linkOptions.drawExtraLink.call(this, link, { ...linkOptions, alpha });\n }\n };\n}\n"],"names":[],"mappings":";;;;;;SAIgB,WAAW,GAAA;IAIzB,OAAO,SAAS,QAAQ,CAEtB,IAAuC,EAAA;QAEvC,IACE,CAAC,IAAI,CAAC,OAAO;AACb,YAAA,OAAO,IAAI,CAAC,MAAM,KAAK,QAAQ;AAC/B,YAAA,OAAO,IAAI,CAAC,MAAM,KAAK,QAAQ;AAC/B,YAAA,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;AACd,YAAA,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;AACd,YAAA,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;AACd,YAAA,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;YAEd;QAEF,IACE,CAAC,IAAI,CAAC,OAAO,IAAI,SAAS,IAAI,CAAC,IAAI,CAAC,OAAO;AAC3C,aAAC,IAAI,CAAC,MAAM,CAAC,OAAO,IAAI,SAAS,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC;AAC1D,aAAC,IAAI,CAAC,MAAM,CAAC,OAAO,IAAI,SAAS,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC;YAE1D;AAEF,QAAA,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,QAAQ;YAAE;AAEpD,QAAA,MAAM,EAAE,GAAG,CAAG,EAAA,IAAI,CAAC,MAAM,CAAC,EAAE,CAAA,EAAG,IAAI,CAAC,MAAM,CAAC,EAAE,EAAE;QAC/C,MAAM,WAAW,GAAG,IAAI,CAAC,gBAAgB,CAAC,EAAE,CAAC;AAC7C,QAAA,IAAI,CAAC,WAAW;YAAE;AAElB,QAAA,IAAI,WAAW,CAAC,QAAQ,EAAE;YACxB,WAAW,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,WAAW,CAAC;YAElD;;AAGF,QAAA,IAAI,KAAK,GAAG,WAAW,CAAC,KAAK;AAC7B,QAAA,IAAI,KAAK,GAAG,WAAW,CAAC,KAAK;AAC7B,QAAA,IAAI,KAAK,GAAG,WAAW,CAAC,KAAK;AAC7B,QAAA,IAAI,UAAU,GAAG,IAAI,CAAC,YAAY,CAAC,gBAAgB,GAAG,CAAC,GAAG,WAAW,CAAC,UAAU;AAChF,QAAA,IAAI,UAAU,GAAG,WAAW,CAAC,UAAU;AACvC,QAAA,IAAI,SAAS,GAAG,WAAW,CAAC,SAAS;AACrC,QAAA,IAAI,gBAAgB,GAAG,WAAW,CAAC,gBAAgB;AACnD,QAAA,IAAI,gBAAgB,GAAG,WAAW,CAAC,gBAAgB;;QAGnD,IAAI,IAAI,CAAC,oBAAoB,IAAI,IAAI,CAAC,eAAe,EAAE;;YAErD,IAAI,IAAI,CAAC,eAAe,CAAC,EAAE,IAAI,IAAI,CAAC,MAAM,CAAC,EAAE,IAAI,IAAI,CAAC,eAAe,CAAC,EAAE,IAAI,IAAI,CAAC,MAAM,CAAC,EAAE,EAAE;gBAC1F,MAAM,WAAW,GAAG,QAAQ,CAAC;AAC3B,oBAAA,KAAK,EAAE,IAAI,CAAC,YAAY,CAAC,KAAK;AAC9B,oBAAA,gBAAgB,EAAE,IAAI,CAAC,YAAY,CAAC,gBAAgB;oBACpD,WAAW;oBACX,iBAAiB,EAAE,IAAI,CAAC,iBAAiB;AACzC,oBAAA,0BAA0B,EAAE,IAAI,CAAC,iBAAiB,CAAC,gCAAgC;AACnF,oBAAA,yBAAyB,EAAE,IAAI,CAAC,iBAAiB,CAAC,+BAA+B;AAClF,iBAAA,CAAC;AACF,gBAAA,KAAK,GAAG,WAAW,CAAC,KAAK;AACzB,gBAAA,UAAU,GAAG,WAAW,CAAC,UAAU;;iBAC9B;gBACL,MAAM,gBAAgB,GAAG,aAAa,CAAC;AACrC,oBAAA,KAAK,EAAE,IAAI,CAAC,YAAY,CAAC,KAAK;AAC9B,oBAAA,gBAAgB,EAAE,IAAI,CAAC,YAAY,CAAC,gBAAgB;oBACpD,WAAW;oBACX,iBAAiB,EAAE,IAAI,CAAC,iBAAiB;AACzC,oBAAA,4BAA4B,EAAE,IAAI,CAAC,iBAAiB,CAAC,kCAAkC;AACvF,oBAAA,uCAAuC,EACrC,IAAI,CAAC,iBAAiB,CAAC,6CAA6C;AACtE,oBAAA,sBAAsB,EAAE,IAAI,CAAC,iBAAiB,CAAC,4BAA4B;AAC3E,oBAAA,+BAA+B,EAC7B,IAAI,CAAC,iBAAiB,CAAC,qCAAqC;AAC9D,oBAAA,qBAAqB,EAAE,IAAI,CAAC,iBAAiB,CAAC,2BAA2B;AACzE,oBAAA,8BAA8B,EAC5B,IAAI,CAAC,iBAAiB,CAAC,oCAAoC;AAC9D,iBAAA,CAAC;AACF,gBAAA,UAAU,GAAG,gBAAgB,CAAC,UAAU;AACxC,gBAAA,KAAK,GAAG,gBAAgB,CAAC,KAAK;AAC9B,gBAAA,KAAK,GAAG,gBAAgB,CAAC,KAAK;AAC9B,gBAAA,UAAU,GAAG,gBAAgB,CAAC,UAAU;AACxC,gBAAA,SAAS,GAAG,gBAAgB,CAAC,SAAS;AACtC,gBAAA,gBAAgB,GAAG,gBAAgB,CAAC,gBAAgB;AACpD,gBAAA,gBAAgB,GAAG,gBAAgB,CAAC,gBAAgB;;;QAGxD,IAAI,IAAI,CAAC,oBAAoB,IAAI,IAAI,CAAC,eAAe,EAAE;;AAErD,YAAA,IAAI,IAAI,CAAC,eAAe,KAAK,IAAI,EAAE;gBACjC,MAAM,WAAW,GAAG,QAAQ,CAAC;AAC3B,oBAAA,KAAK,EAAE,IAAI,CAAC,YAAY,CAAC,KAAK;AAC9B,oBAAA,gBAAgB,EAAE,IAAI,CAAC,YAAY,CAAC,gBAAgB;oBACpD,WAAW;oBACX,iBAAiB,EAAE,IAAI,CAAC,iBAAiB;AACzC,oBAAA,0BAA0B,EAAE,IAAI,CAAC,iBAAiB,CAAC,gCAAgC;AACnF,oBAAA,yBAAyB,EAAE,IAAI,CAAC,iBAAiB,CAAC,+BAA+B;AAClF,iBAAA,CAAC;AACF,gBAAA,KAAK,GAAG,WAAW,CAAC,KAAK;AACzB,gBAAA,UAAU,GAAG,WAAW,CAAC,UAAU;;iBAC9B;;gBAEL,MAAM,gBAAgB,GAAG,aAAa,CAAC;AACrC,oBAAA,KAAK,EAAE,IAAI,CAAC,YAAY,CAAC,KAAK;AAC9B,oBAAA,gBAAgB,EAAE,IAAI,CAAC,YAAY,CAAC,gBAAgB;oBACpD,WAAW;oBACX,iBAAiB,EAAE,IAAI,CAAC,iBAAiB;AACzC,oBAAA,4BAA4B,EAAE,IAAI,CAAC,iBAAiB,CAAC,kCAAkC;AACvF,oBAAA,uCAAuC,EACrC,IAAI,CAAC,iBAAiB,CAAC,6CAA6C;AACtE,oBAAA,sBAAsB,EAAE,IAAI,CAAC,iBAAiB,CAAC,4BAA4B;AAC3E,oBAAA,+BAA+B,EAC7B,IAAI,CAAC,iBAAiB,CAAC,qCAAqC;AAC9D,oBAAA,qBAAqB,EAAE,IAAI,CAAC,iBAAiB,CAAC,2BAA2B;AACzE,oBAAA,8BAA8B,EAC5B,IAAI,CAAC,iBAAiB,CAAC,oCAAoC;AAC9D,iBAAA,CAAC;AACF,gBAAA,UAAU,GAAG,gBAAgB,CAAC,UAAU;AACxC,gBAAA,KAAK,GAAG,gBAAgB,CAAC,KAAK;AAC9B,gBAAA,KAAK,GAAG,gBAAgB,CAAC,KAAK;AAC9B,gBAAA,UAAU,GAAG,gBAAgB,CAAC,UAAU;AACxC,gBAAA,SAAS,GAAG,gBAAgB,CAAC,SAAS;AACtC,gBAAA,gBAAgB,GAAG,gBAAgB,CAAC,gBAAgB;AACpD,gBAAA,gBAAgB,GAAG,gBAAgB,CAAC,gBAAgB;;;;AAKxD,QAAA,IAAI,CAAC,OAAO,CAAC,SAAS,EAAE;AAExB,QAAA,IAAI,CAAC,OAAO,CAAC,WAAW,GAAG,KAAK;AAChC,QAAA,IAAI,CAAC,OAAO,CAAC,WAAW,GAAG,KAAK;AAChC,QAAA,IAAI,CAAC,OAAO,CAAC,SAAS,GAAG,KAAK;AAE9B,QAAA,IAAI,MAAM,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC;AAC1B,QAAA,IAAI,MAAM,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC;AAC1B,QAAA,IAAI,IAAI,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC;AACxB,QAAA,IAAI,IAAI,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC;QACxB,IAAI,YAAY,GAAG,CAAC;AACpB,QAAA,IACE,IAAI,CAAC,YAAY,CAAC,UAAU;YAC5B,IAAI,CAAC,YAAY,CAAC,iBAAiB;aAClC,IAAI,CAAC,YAAY,CAAC,KAAK,IAAI,UAAU,GAAG,CAAC,CAAC,EAC3C;YACA,MAAM,UAAU,GAAG,IAAI,CAAC,YAAY,CAAC,KAAK,IAAI,UAAU,GAAG,CAAC;AAC5D,YAAA,MAAM,QAAQ,GAAG,2BAA2B,CAAC,IAAI,EAAE,UAAU,GAAG,SAAS,GAAG,CAAC,CAAC;YAE9E,IAAI,QAAQ,EAAE;AACZ,gBAAA,MAAM,GAAG,QAAQ,CAAC,EAAE;AACpB,gBAAA,IAAI,GAAG,QAAQ,CAAC,EAAE;AAClB,gBAAA,MAAM,GAAG,QAAQ,CAAC,EAAE;AACpB,gBAAA,IAAI,GAAG,QAAQ,CAAC,EAAE;AAClB,gBAAA,YAAY,GAAG,QAAQ,CAAC,QAAQ;;;QAGpC,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC;QACnC,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,IAAI,EAAE,IAAI,CAAC;AAC/B,QAAA,IAAI,CAAC,OAAO,CAAC,MAAM,EAAE;;AAGrB,QAAA,IACE,IAAI,CAAC,YAAY,CAAC,SAAS;aAC1B,CAAC,IAAI,CAAC,eAAe;iBACnB,IAAI,CAAC,eAAe,CAAC,EAAE,KAAK,IAAI,CAAC,MAAM,CAAC,EAAE;oBACzC,IAAI,CAAC,eAAe,CAAC,EAAE,KAAK,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC;AAC7C,iBAAC,IAAI,CAAC,eAAe,IAAI,IAAI,CAAC,eAAe,KAAK,IAAI,CAAC,CAAC,EAC1D;AACA,YAAA,MAAM,aAAa,GAAG,IAAI,CAAC,YAAY,CAAC;kBACpC,YAAY,IAAI;AAChB,sBAAE;AACF,sBAAE,YAAY,GAAG,IAAI,CAAC,YAAY,CAAC;AACrC,kBAAE,WAAW,CAAC,aAAa;AAC7B,YAAA,MAAM,aAAa,GAAG,WAAW,CAAC,aAAa;YAE/C,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,EAAE,CAAC,EAAE;AACvB,gBAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,MAAM,CAAC,EAAE;AAC/B,gBAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,MAAM,CAAC,EAAE;gBAE/B,MAAM,SAAS,GAAmB,EAAE;AACpC,gBAAA,IAAI,YAAsC;AAE1C,gBAAA,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,aAAa,EAAE,CAAC,EAAE,EAAE;AACtC,oBAAA,MAAM,QAAQ,GAAiB;AAC7B,wBAAA,IAAI,EAAE,CAAC;wBACP,QAAQ;wBACR,QAAQ;AACR,wBAAA,IAAI,EAAE,YAAY;AAClB,wBAAA,IAAI,EAAE,SAAS;AACf,wBAAA,KAAK,EAAE,CAAC;qBACT;AACD,oBAAA,IAAI,YAAY;AAAE,wBAAA,YAAY,CAAC,IAAI,GAAG,QAAQ;AAC9C,oBAAA,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAC;oBACxB,YAAY,GAAG,QAAQ;;AAEzB,gBAAA,IAAI,SAAS,CAAC,MAAM,IAAI,CAAC,EAAE;AACzB,oBAAA,SAAS,CAAC,CAAC,CAAC,CAAC,IAAI,GAAG,SAAS,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC,CAAC;AACnD,oBAAA,SAAS,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,IAAI,GAAG,SAAS,CAAC,CAAC,CAAC;;AAErD,gBAAA,IAAI,CAAC,SAAS,CAAC,EAAE,CAAC,GAAG,SAAS;;AAGhC,YAAA,IAAI,aAAa,KAAK,CAAC,EAAE;gBACvB,IAAI,CAAC,SAAS,CAAC,EAAE,CAAC,CAAC,OAAO,CAAC,CAAC,QAAQ,KAAI;oBACtC,IAAI,CAAC,IAAI,CAAC,OAAO;wBAAE;AAEnB,oBAAA,MAAM,QAAQ,GAAG,aAAa,GAAG,aAAa;AAC9C,oBAAA,mBAAmB,CAAC;wBAClB,QAAQ;wBACR,QAAQ;AACR,wBAAA,UAAU,EAAE,aAAa;AACzB,wBACA,IAAI;wBACJ,MAAM;wBACN,IAAI;wBACJ,MAAM;AACP,qBAAA,CAAC;AACF,oBAAA,IAAI,QAAQ,CAAC,CAAC,IAAI,SAAS,IAAI,QAAQ,CAAC,CAAC,IAAI,SAAS,EAAE;AACtD,wBAAA,IAAI,CAAC,OAAO,CAAC,SAAS,EAAE;wBACxB,IAAI,CAAC,OAAO,CAAC,WAAW,GAAG,WAAW,CAAC,mBAAmB;wBAC1D,IAAI,CAAC,OAAO,CAAC,SAAS,GAAG,WAAW,CAAC,mBAAmB;wBACxD,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC,EAAE,QAAQ,CAAC,CAAC,EAAE,WAAW,CAAC,cAAc,EAAE,CAAC,EAAE,IAAI,CAAC,EAAE,GAAG,CAAC,CAAC;wBACpF,IAAI,CAAC,OAAO,CAAC,SAAS,GAAG,WAAW,CAAC,aAAa;AAClD,wBAAA,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE;AACnB,wBAAA,IAAI,WAAW,CAAC,mBAAmB,GAAG,CAAC,EAAE;AACvC,4BAAA,IAAI,CAAC,OAAO,CAAC,MAAM,EAAE;;;AAG3B,iBAAC,CAAC;;;;QAKN,IAAI,IAAI,CAAC,YAAY,CAAC,KAAK,IAAI,UAAU,GAAG,CAAC,EAAE;AAC7C,YAAA,IAAI,CAAC,OAAO,CAAC,SAAS,EAAE;AACxB,YAAA,IAAI,CAAC,OAAO,CAAC,WAAW,GAAG,UAAU;AACrC,YAAA,IAAI,CAAC,OAAO,CAAC,WAAW,GAAG,gBAAgB;AAC3C,YAAA,IAAI,CAAC,OAAO,CAAC,SAAS,GAAG,gBAAgB;AACzC,YAAA,IAAI,CAAC,OAAO,CAAC,SAAS,GAAG,UAAU;AACnC,YAAA,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,GAAG,MAAM,EAAE,IAAI,GAAG,MAAM,CAAC;YACtD,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,IAAI,EAAE,IAAI,CAAC;AAC/B,YAAA,IAAI,CAAC,OAAO,CAAC,MAAM,CACjB,IAAI,GAAG,SAAS,GAAG,IAAI,CAAC,GAAG,CAAC,KAAK,GAAG,IAAI,CAAC,EAAE,GAAG,CAAC,CAAC,EAChD,IAAI,GAAG,SAAS,GAAG,IAAI,CAAC,GAAG,CAAC,KAAK,GAAG,IAAI,CAAC,EAAE,GAAG,CAAC,CAAC,CACjD;AACD,YAAA,IAAI,CAAC,OAAO,CAAC,MAAM,CACjB,IAAI,GAAG,SAAS,GAAG,IAAI,CAAC,GAAG,CAAC,KAAK,GAAG,IAAI,CAAC,EAAE,GAAG,CAAC,CAAC,EAChD,IAAI,GAAG,SAAS,GAAG,IAAI,CAAC,GAAG,CAAC,KAAK,GAAG,IAAI,CAAC,EAAE,GAAG,CAAC,CAAC,CACjD;AACD,YAAA,IAAI,CAAC,OAAO,CAAC,SAAS,EAAE;AACxB,YAAA,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE;AACnB,YAAA,IAAI,gBAAgB,GAAG,CAAC,EAAE;AACxB,gBAAA,IAAI,CAAC,OAAO,CAAC,MAAM,EAAE;;;AAIzB,QAAA,IAAI,WAAW,CAAC,aAAa,EAAE;AAC7B,YAAA,WAAW,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,EAAE,GAAG,WAAW,EAAE,KAAK,EAAE,CAAC;;AAEzE,KAAC;AACH;;;;"}
|
|
@@ -1,27 +1,22 @@
|
|
|
1
1
|
import { isNumber } from '@krainovsd/js-helpers';
|
|
2
|
-
import { nodeRadiusGetter, nodeSizeGetter, nodeOptionsGetter } from '../lib/settings/node-settings-getter.js';
|
|
3
2
|
import 'd3-array';
|
|
4
|
-
import { nodeIterationExtractor } from '../lib/utils/node-iteration-extractor.js';
|
|
5
3
|
import { isNodeVisible } from '../lib/utils/is-node-visible.js';
|
|
6
4
|
import { nodeFade, nodeHighlight } from '../lib/utils/node-highlight.js';
|
|
7
|
-
import {
|
|
5
|
+
import { drawText } from './draw-text.js';
|
|
8
6
|
|
|
9
7
|
function getDrawNode(nodeRenders, textRenders) {
|
|
10
|
-
return function drawNode(node
|
|
8
|
+
return function drawNode(node) {
|
|
11
9
|
if (!this.context || !node.x || !node.y)
|
|
12
10
|
return;
|
|
13
|
-
if (node.visible != undefined && !node.visible)
|
|
11
|
+
if (node.visible != undefined && !node.visible) {
|
|
12
|
+
node._radius = 0;
|
|
13
|
+
node._width = 0;
|
|
14
|
+
node._height = 0;
|
|
14
15
|
return;
|
|
15
|
-
let nodeOptions;
|
|
16
|
-
if (this.nodeSettings.cacheOptions && this.nodeOptionsCache[node.id]) {
|
|
17
|
-
nodeOptions = this.nodeOptionsCache[node.id];
|
|
18
|
-
}
|
|
19
|
-
else {
|
|
20
|
-
nodeOptions = nodeIterationExtractor(node, index, this.nodes, this, this.nodeSettings.options ?? {}, nodeOptionsGetter);
|
|
21
|
-
if (this.nodeSettings.cacheOptions) {
|
|
22
|
-
this.nodeOptionsCache[node.id] = nodeOptions;
|
|
23
|
-
}
|
|
24
16
|
}
|
|
17
|
+
const nodeOptions = this.nodeOptionsCache[node.id];
|
|
18
|
+
if (!nodeOptions)
|
|
19
|
+
return;
|
|
25
20
|
if (nodeOptions.nodeDraw && nodeOptions.textDraw) {
|
|
26
21
|
nodeRenders.push(() => {
|
|
27
22
|
if (nodeOptions.nodeDraw) {
|
|
@@ -35,13 +30,13 @@ function getDrawNode(nodeRenders, textRenders) {
|
|
|
35
30
|
});
|
|
36
31
|
return;
|
|
37
32
|
}
|
|
33
|
+
let radius = nodeOptions.radius;
|
|
34
|
+
let width = nodeOptions.width;
|
|
35
|
+
let height = nodeOptions.height;
|
|
38
36
|
let alpha = nodeOptions.alpha;
|
|
39
37
|
let color = nodeOptions.color;
|
|
40
38
|
let borderColor = nodeOptions.borderColor;
|
|
41
39
|
let borderWidth = nodeOptions.borderWidth;
|
|
42
|
-
let radiusInitial = nodeOptions.radius;
|
|
43
|
-
let widthInitial = nodeOptions.width;
|
|
44
|
-
let heightInitial = nodeOptions.height;
|
|
45
40
|
let textAlpha = nodeOptions.textAlpha;
|
|
46
41
|
let textSize = nodeOptions.textSize;
|
|
47
42
|
let textShiftX = nodeOptions.textShiftX;
|
|
@@ -88,9 +83,9 @@ function getDrawNode(nodeRenders, textRenders) {
|
|
|
88
83
|
color = highlightOptions.color;
|
|
89
84
|
borderColor = highlightOptions.borderColor;
|
|
90
85
|
borderWidth = highlightOptions.borderWidth;
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
86
|
+
radius = highlightOptions.radiusInitial;
|
|
87
|
+
width = highlightOptions.widthInitial;
|
|
88
|
+
height = highlightOptions.heightInitial;
|
|
94
89
|
textSize = highlightOptions.textSize;
|
|
95
90
|
textShiftX = highlightOptions.textShiftX;
|
|
96
91
|
textShiftY = highlightOptions.textShiftY;
|
|
@@ -137,9 +132,9 @@ function getDrawNode(nodeRenders, textRenders) {
|
|
|
137
132
|
color = highlightOptions.color;
|
|
138
133
|
borderColor = highlightOptions.borderColor;
|
|
139
134
|
borderWidth = highlightOptions.borderWidth;
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
135
|
+
radius = highlightOptions.radiusInitial;
|
|
136
|
+
width = highlightOptions.widthInitial;
|
|
137
|
+
height = highlightOptions.heightInitial;
|
|
143
138
|
textSize = highlightOptions.textSize;
|
|
144
139
|
textShiftX = highlightOptions.textShiftX;
|
|
145
140
|
textShiftY = highlightOptions.textShiftY;
|
|
@@ -148,78 +143,6 @@ function getDrawNode(nodeRenders, textRenders) {
|
|
|
148
143
|
labelWeight = highlightOptions.labelWeight;
|
|
149
144
|
}
|
|
150
145
|
}
|
|
151
|
-
/** Flex radius */
|
|
152
|
-
const radius = nodeOptions.shape === "circle"
|
|
153
|
-
? nodeRadiusGetter({
|
|
154
|
-
radiusFlexible: this.nodeSettings.nodeRadiusFlexible,
|
|
155
|
-
radiusInitial,
|
|
156
|
-
radiusCoefficient: this.nodeSettings.nodeRadiusCoefficient,
|
|
157
|
-
radiusFactor: this.nodeSettings.nodeRadiusFactor,
|
|
158
|
-
linkCount: node.linkCount,
|
|
159
|
-
})
|
|
160
|
-
: radiusInitial;
|
|
161
|
-
/** Flex size */
|
|
162
|
-
let height = heightInitial;
|
|
163
|
-
let width = widthInitial;
|
|
164
|
-
if (nodeOptions.shape === "square") {
|
|
165
|
-
const size = nodeSizeGetter({
|
|
166
|
-
heightInitial,
|
|
167
|
-
widthInitial,
|
|
168
|
-
linkCount: node.linkCount,
|
|
169
|
-
sizeCoefficient: this.nodeSettings.nodeSizeCoefficient,
|
|
170
|
-
sizeFactor: this.nodeSettings.nodeSizeFactor,
|
|
171
|
-
sizeFlexible: this.nodeSettings.nodeSizeFlexible,
|
|
172
|
-
});
|
|
173
|
-
width = size.width;
|
|
174
|
-
height = size.height;
|
|
175
|
-
}
|
|
176
|
-
if (nodeOptions.shape === "text") {
|
|
177
|
-
width = nodeOptions.width;
|
|
178
|
-
const size = nodeSizeGetter({
|
|
179
|
-
heightInitial,
|
|
180
|
-
widthInitial: width,
|
|
181
|
-
linkCount: node.linkCount,
|
|
182
|
-
sizeCoefficient: this.nodeSettings.nodeSizeCoefficient,
|
|
183
|
-
sizeFactor: this.nodeSettings.nodeSizeFactor,
|
|
184
|
-
sizeFlexible: this.nodeSettings.nodeSizeFlexible,
|
|
185
|
-
});
|
|
186
|
-
labelSize *= size.additionalSizeCoefficient;
|
|
187
|
-
}
|
|
188
|
-
/** Size by text in textNode */
|
|
189
|
-
if (nodeOptions.shape === "text" && nodeOptions.label) {
|
|
190
|
-
let lines;
|
|
191
|
-
let textNodeParameters;
|
|
192
|
-
const cachedLines = this.cachedNodeLabel[node.id];
|
|
193
|
-
const cachedTextNodeParameters = this.cachedTextNodeParameters[node.id];
|
|
194
|
-
if (cachedLines != undefined && cachedTextNodeParameters != undefined) {
|
|
195
|
-
lines = cachedLines;
|
|
196
|
-
textNodeParameters = cachedTextNodeParameters;
|
|
197
|
-
}
|
|
198
|
-
else {
|
|
199
|
-
const textInfo = getTextLines({
|
|
200
|
-
context: this.context,
|
|
201
|
-
text: nodeOptions.label,
|
|
202
|
-
textAlign: nodeOptions.labelAlign,
|
|
203
|
-
textColor: nodeOptions.labelColor,
|
|
204
|
-
textFont: nodeOptions.labelFont,
|
|
205
|
-
textSize: labelSize,
|
|
206
|
-
maxWidth: nodeOptions.labelWidth,
|
|
207
|
-
textStyle: nodeOptions.labelStyle,
|
|
208
|
-
textWeight,
|
|
209
|
-
});
|
|
210
|
-
textNodeParameters = [textInfo.currentMaxSize, labelSize];
|
|
211
|
-
lines = textInfo.lines;
|
|
212
|
-
this.cachedNodeLabel[node.id] = lines;
|
|
213
|
-
this.cachedTextNodeParameters[node.id] = textNodeParameters;
|
|
214
|
-
}
|
|
215
|
-
const textSizeCoefficient = labelSize / textNodeParameters[1];
|
|
216
|
-
const maxSize = textNodeParameters[0] * textSizeCoefficient;
|
|
217
|
-
height =
|
|
218
|
-
lines.length * labelSize +
|
|
219
|
-
(lines.length - 1) * nodeOptions.labelGap +
|
|
220
|
-
nodeOptions.labelYPadding;
|
|
221
|
-
width = maxSize + nodeOptions.labelXPadding;
|
|
222
|
-
}
|
|
223
146
|
/** Node parameters */
|
|
224
147
|
node._radius = radius;
|
|
225
148
|
node._borderWidth = borderWidth;
|
|
@@ -250,6 +173,7 @@ function getDrawNode(nodeRenders, textRenders) {
|
|
|
250
173
|
this.context.lineWidth = borderWidth;
|
|
251
174
|
this.context.strokeStyle = borderColor;
|
|
252
175
|
this.context.fillStyle = color;
|
|
176
|
+
const labelLines = this.cachedNodeLabel[node.id];
|
|
253
177
|
switch (nodeOptions.shape) {
|
|
254
178
|
case "circle": {
|
|
255
179
|
if (!node.image) {
|
|
@@ -270,13 +194,11 @@ function getDrawNode(nodeRenders, textRenders) {
|
|
|
270
194
|
this.context.stroke();
|
|
271
195
|
}
|
|
272
196
|
}
|
|
273
|
-
if (node.label) {
|
|
197
|
+
if (node.label && labelLines) {
|
|
274
198
|
this.context.globalAlpha = labelAlpha;
|
|
275
199
|
drawText({
|
|
276
200
|
context: this.context,
|
|
277
|
-
|
|
278
|
-
id: node.id,
|
|
279
|
-
text: node.label,
|
|
201
|
+
lines: labelLines,
|
|
280
202
|
textAlign: nodeOptions.labelAlign,
|
|
281
203
|
textColor: nodeOptions.labelColor,
|
|
282
204
|
textFont: nodeOptions.labelFont,
|
|
@@ -284,7 +206,6 @@ function getDrawNode(nodeRenders, textRenders) {
|
|
|
284
206
|
textSize: labelSize,
|
|
285
207
|
textStyle: nodeOptions.labelStyle,
|
|
286
208
|
textWeight: labelWeight,
|
|
287
|
-
maxWidth: nodeOptions.labelWidth,
|
|
288
209
|
x: node.x,
|
|
289
210
|
y: node.y + labelSize / 3,
|
|
290
211
|
});
|
|
@@ -310,13 +231,11 @@ function getDrawNode(nodeRenders, textRenders) {
|
|
|
310
231
|
this.context.stroke();
|
|
311
232
|
}
|
|
312
233
|
}
|
|
313
|
-
if (node.label) {
|
|
234
|
+
if (node.label && labelLines) {
|
|
314
235
|
this.context.globalAlpha = labelAlpha;
|
|
315
236
|
drawText({
|
|
316
237
|
context: this.context,
|
|
317
|
-
|
|
318
|
-
id: node.id,
|
|
319
|
-
text: node.label,
|
|
238
|
+
lines: labelLines,
|
|
320
239
|
textAlign: nodeOptions.labelAlign,
|
|
321
240
|
textColor: nodeOptions.labelColor,
|
|
322
241
|
textFont: nodeOptions.labelFont,
|
|
@@ -324,7 +243,6 @@ function getDrawNode(nodeRenders, textRenders) {
|
|
|
324
243
|
textSize: labelSize,
|
|
325
244
|
textStyle: nodeOptions.labelStyle,
|
|
326
245
|
textWeight: labelWeight,
|
|
327
|
-
maxWidth: nodeOptions.labelWidth,
|
|
328
246
|
x: node.x,
|
|
329
247
|
y: node.y + labelSize / 3,
|
|
330
248
|
});
|
|
@@ -335,20 +253,16 @@ function getDrawNode(nodeRenders, textRenders) {
|
|
|
335
253
|
if (this.nodeSettings.textNodeDebug) {
|
|
336
254
|
this.context.strokeRect(node.x - width / 2, node.y - height / 2, width, height);
|
|
337
255
|
}
|
|
338
|
-
|
|
339
|
-
if (nodeOptions.label && lines)
|
|
256
|
+
if (nodeOptions.label && labelLines)
|
|
340
257
|
drawText({
|
|
341
|
-
|
|
342
|
-
cachedNodeText: this.cachedNodeLabel,
|
|
258
|
+
lines: labelLines,
|
|
343
259
|
context: this.context,
|
|
344
|
-
text: nodeOptions.label,
|
|
345
260
|
textAlign: nodeOptions.labelAlign,
|
|
346
261
|
textColor: nodeOptions.labelColor,
|
|
347
262
|
textFont: nodeOptions.labelFont,
|
|
348
263
|
textSize: labelSize,
|
|
349
264
|
x: node.x,
|
|
350
|
-
y: node.y + textSize / 4 - (
|
|
351
|
-
maxWidth: nodeOptions.labelWidth,
|
|
265
|
+
y: node.y + textSize / 4 - (labelLines.length - 1) * (textSize / 2),
|
|
352
266
|
textStyle: nodeOptions.labelStyle,
|
|
353
267
|
textWeight,
|
|
354
268
|
textGap: nodeOptions.labelGap,
|
|
@@ -385,7 +299,8 @@ function getDrawNode(nodeRenders, textRenders) {
|
|
|
385
299
|
});
|
|
386
300
|
}
|
|
387
301
|
/** Text draw */
|
|
388
|
-
|
|
302
|
+
const textLines = this.cachedNodeText[node.id];
|
|
303
|
+
if (nodeOptions.textVisible && nodeOptions.text && textLines) {
|
|
389
304
|
textRenders.push(() => {
|
|
390
305
|
if (nodeOptions.textDraw) {
|
|
391
306
|
nodeOptions.textDraw.bind(this)(node, {
|
|
@@ -413,17 +328,14 @@ function getDrawNode(nodeRenders, textRenders) {
|
|
|
413
328
|
y += height / 2;
|
|
414
329
|
}
|
|
415
330
|
drawText({
|
|
416
|
-
|
|
417
|
-
cachedNodeText: this.cachedNodeText,
|
|
331
|
+
lines: textLines,
|
|
418
332
|
context: this.context,
|
|
419
|
-
text: nodeOptions.text,
|
|
420
333
|
textAlign: nodeOptions.textAlign,
|
|
421
334
|
textColor: nodeOptions.textColor,
|
|
422
335
|
textFont: nodeOptions.textFont,
|
|
423
336
|
textSize,
|
|
424
337
|
x: node.x + textShiftX,
|
|
425
338
|
y,
|
|
426
|
-
maxWidth: nodeOptions.textWidth,
|
|
427
339
|
textStyle: nodeOptions.textStyle,
|
|
428
340
|
textWeight,
|
|
429
341
|
textGap: nodeOptions.textGap,
|