@antv/layout 1.0.0-alpha.1 → 1.0.0-alpha.11

package/lib/types.d.ts

@@ -1,114 +1,93 @@
-import type { Graph, PlainObject } from "@antv/graphlib";
-export interface Node extends PlainObject {
-    id: string;
+import { Graph as IGraph, Node as INode, Edge as IEdge, PlainObject } from "@antv/graphlib";
+export interface NodeData extends PlainObject {
+    visible?: boolean;
+    size?: number | number[];
+    bboxSize?: number[];
 }
-export interface OutNode extends Node {
+export interface OutNodeData extends NodeData {
     x: number;
     y: number;
-    fx?: number;
-    fy?: number;
-    comboId?: string;
-    layer?: number;
-    _order?: number;
-    layout?: boolean;
-    size?: number | number[] | undefined;
-}
-export interface Edge {
-    source: string;
-    target: string;
-}
-export interface Combo {
-    id: string;
-    parentId?: string;
-    x?: number;
-    y?: number;
-    name?: string | number;
-    cx?: number;
-    cy?: number;
-    count?: number;
-    depth?: number;
-    children?: any[];
-    empty?: boolean;
-    minX?: number;
-    maxX?: number;
-    minY?: number;
-    maxY?: number;
-    size?: number;
-    r?: number;
-    itemType?: string;
-    collapsed?: boolean;
-}
-export interface Model {
-    nodes?: Node[];
-    edges?: Edge[];
-    combos?: Combo[];
-    comboEdges?: Edge[];
-    hiddenNodes?: Node[];
-    hiddenEdges?: Edge[];
-    hiddenCombos?: Combo[];
-    vedges?: Edge[];
-}
-export interface OutModel extends Model {
-    nodes?: OutNode[];
-}
-export interface Size {
-    width: number;
-    height: number;
 }
-export type IndexMap = {
-    [key: string]: number;
-};
-export type INode = OutNode & {
-    degree: number;
-    size: number | PointTuple;
-};
-export type NodeMap = {
-    [key: string]: INode;
-};
-export type Matrix = number[];
-export type Point = {
-    x: number;
-    y: number;
-};
+export interface EdgeData extends PlainObject {
+    visible?: boolean;
+    virtual?: boolean;
+}
+/** input node */
+export type Node = INode<NodeData>;
+/** output node */
+export type OutNode = INode<OutNodeData>;
+/** input and output edge */
+export type Edge = IEdge<EdgeData>;
 export type Degree = {
     in: number;
     out: number;
     all: number;
 };
-export interface ComboTree {
-    id: string;
-    children?: ComboTree[];
-    depth?: number;
-    parentId?: string;
-    itemType?: "node" | "combo";
-    [key: string]: unknown;
-}
-export interface ComboConfig {
-    id: string;
-    parentId?: string;
-    children?: ComboTree[];
-    depth?: number;
-}
+export type IndexMap = {
+    [nodeId: string]: number;
+};
+export type Graph = IGraph<NodeData, EdgeData>;
 export type PointTuple = [number, number];
+export type Point = {
+    x: number;
+    y: number;
+};
+export type Matrix = number[];
 export type LayoutMapping = {
     nodes: OutNode[];
     edges: Edge[];
 };
-export interface SyncLayout<LayoutOptions> {
-    assign(graph: Graph<any, any>, options?: LayoutOptions): void;
-    execute(graph: Graph<any, any>, options?: LayoutOptions): LayoutMapping;
+export interface Layout<LayoutOptions> {
+    /**
+     * To directly assign the positions to the nodes.
+     */
+    assign(graph: Graph, options?: LayoutOptions): void;
+    /**
+     * Return the positions of nodes and edges(if needed).
+     */
+    execute(graph: Graph, options?: LayoutOptions): LayoutMapping;
+    /**
+     * Layout options, can be changed in runtime.
+     */
     options: LayoutOptions;
+    /**
+     * Unique ID, it will get registered and used on the webworker-side.
+     */
     id: string;
 }
-export interface SyncLayoutConstructor<LayoutOptions> {
-    new (options?: LayoutOptions): SyncLayout<LayoutOptions>;
+export declare function isLayoutWithIterations(layout: any): layout is LayoutWithIterations<any>;
+export interface LayoutWithIterations<LayoutOptions> extends Layout<LayoutOptions> {
+    /**
+     * Some layout algorithm has n iterations so that the simulation needs to be stopped at any time.
+     * This method is useful for running the simulation manually.
+     * @see https://github.com/d3/d3-force#simulation_stop
+     */
+    stop: () => void;
+    /**
+     * Restarts the simulation’s internal timer and returns the simulation.
+     * @see https://github.com/d3/d3-force#simulation_restart
+     */
+    restart: () => void;
+    /**
+     * Manually steps the simulation by the specified number of iterations.
+     * @see https://github.com/d3/d3-force#simulation_tick
+     */
+    tick: (iterations?: number) => LayoutMapping;
+}
+export interface LayoutConstructor<LayoutOptions> {
+    new (options?: LayoutOptions): Layout<LayoutOptions>;
 }
 export interface LayoutSupervisor {
     start(): void;
     stop(): void;
     kill(): void;
+    isRunning(): boolean;
+}
+interface CommonOptions {
+    layoutInvisibles?: boolean;
+    onLayoutEnd?: (data: LayoutMapping) => void;
 }
-export interface CircularLayoutOptions {
+export interface CircularLayoutOptions extends CommonOptions {
     center?: PointTuple;
     width?: number;
     height?: number;
@@ -119,10 +98,169 @@ export interface CircularLayoutOptions {
     divisions?: number;
     ordering?: "topology" | "topology-directed" | "degree" | null;
     angleRatio?: number;
-    workerEnabled?: boolean;
     startAngle?: number;
     endAngle?: number;
-    nodeSpacing?: ((d?: unknown) => number) | number;
-    nodeSize?: number;
-    onLayoutEnd?: () => void;
+    nodeSpacing?: ((node?: Node) => number) | number;
+    nodeSize?: number | number[];
+}
+export interface GridLayoutOptions extends CommonOptions {
+    width?: number;
+    height?: number;
+    begin?: PointTuple;
+    preventOverlap?: boolean;
+    nodeSize?: number | number[];
+    preventOverlapPadding?: number;
+    condense?: boolean;
+    rows?: number;
+    cols?: number;
+    sortBy?: string;
+    position?: ((node?: Node) => {
+        row?: number;
+        col?: number;
+    }) | undefined;
+    nodeSpacing?: ((node?: Node) => number) | number | undefined;
+}
+export interface RandomLayoutOptions extends CommonOptions {
+    center?: PointTuple;
+    width?: number;
+    height?: number;
+}
+export interface MDSLayoutOptions extends CommonOptions {
+    center?: PointTuple;
+    linkDistance?: number;
+}
+export interface ConcentricLayoutOptions extends CommonOptions {
+    center?: PointTuple;
+    preventOverlap?: boolean;
+    nodeSize?: number | PointTuple;
+    minNodeSpacing?: number;
+    sweep?: number;
+    equidistant?: boolean;
+    startAngle?: number;
+    clockwise?: boolean;
+    maxLevelDiff?: number;
+    sortBy?: string;
+    width?: number;
+    height?: number;
+    nodeSpacing?: number | number[] | ((node?: Node) => number) | undefined;
+}
+export interface RadialLayoutOptions extends CommonOptions {
+    center?: PointTuple;
+    width?: number;
+    height?: number;
+    linkDistance?: number;
+    maxIteration?: number;
+    focusNode?: string | Node | null;
+    unitRadius?: number | null;
+    preventOverlap?: boolean;
+    nodeSize?: number | number[] | undefined;
+    nodeSpacing?: number | Function | undefined;
+    maxPreventOverlapIteration?: number;
+    strictRadial?: boolean;
+    sortBy?: string | undefined;
+    sortStrength?: number;
+}
+export interface DagreLayoutOptions extends CommonOptions {
+    rankdir?: "TB" | "BT" | "LR" | "RL";
+    align?: "UL" | "UR" | "DL" | "DR";
+    begin?: PointTuple;
+    nodeSize?: number | number[] | undefined;
+    nodesep?: number;
+    ranksep?: number;
+    controlPoints?: boolean;
+    sortByCombo?: boolean;
+    edgeLabelSpace?: boolean;
+    nodeOrder?: string[];
+    radial?: boolean;
+    focusNode: string | Node | null;
+    preset?: {
+        nodes: OutNode[];
+        edges: Edge[];
+    };
+    nodesepFunc?: ((d?: Node) => number) | undefined;
+    ranksepFunc?: ((d?: Node) => number) | undefined;
+}
+export interface D3ForceLayoutOptions extends CommonOptions {
+    center?: PointTuple;
+    linkDistance?: number | ((edge?: Edge) => number) | undefined;
+    edgeStrength?: number | ((edge?: Edge) => number) | undefined;
+    nodeStrength?: number | ((node: Node, i: number, nodes: Node[]) => number) | undefined;
+    preventOverlap?: boolean;
+    collideStrength?: number;
+    nodeSize?: number | number[] | ((node?: Node) => number) | undefined;
+    nodeSpacing?: number | number[] | ((node?: Node) => number) | undefined;
+    alpha?: number;
+    alphaDecay?: number;
+    alphaMin?: number;
+    clustering?: boolean;
+    clusterNodeStrength?: number;
+    clusterEdgeStrength?: number;
+    clusterEdgeDistance?: number;
+    clusterNodeSize?: number;
+    clusterFociStrength?: number;
+    forceSimulation?: any;
+    onTick?: (data: LayoutMapping) => void;
+}
+export interface CentripetalOptions {
+    /** Force strength for leaf nodes. */
+    leaf?: number | ((node: Node, nodes: Node[], edges: Edge[]) => number);
+    /** Force strength for single nodes. */
+    single?: number | ((node: Node) => number);
+    /** Force strength for other nodes. */
+    others?: number | ((node: Node) => number);
+    /** Centri force's position and sterngth, points to the canvas center by default */
+    center?: (node: Node, nodes: Node[], edges: Edge[], width: number, height: number) => {
+        x: number;
+        y: number;
+        centerStrength?: number;
+    };
+}
+export interface ForceLayoutOptions extends CommonOptions {
+    center?: PointTuple;
+    width?: number;
+    height?: number;
+    linkDistance?: number | ((edge?: Edge, source?: any, target?: any) => number) | undefined;
+    nodeStrength?: number | ((d?: Node) => number) | undefined;
+    edgeStrength?: number | ((d?: Edge) => number) | undefined;
+    preventOverlap?: boolean;
+    nodeSize?: number | number[] | ((d?: Node) => number);
+    nodeSpacing?: number | ((d?: Node) => number);
+    minMovement?: number;
+    maxIteration?: number;
+    damping?: number;
+    maxSpeed?: number;
+    coulombDisScale?: number;
+    gravity?: number;
+    factor?: number;
+    interval?: number;
+    centripetalOptions?: CentripetalOptions;
+    leafCluster?: boolean;
+    clustering?: boolean;
+    nodeClusterBy?: string;
+    clusterNodeStrength?: number | ((node: Node) => number);
+    collideStrength?: number;
+    distanceThresholdMode?: "mean" | "max" | "min";
+    animate?: boolean;
+    onTick?: (data: LayoutMapping) => void;
+    getMass?: ((d: Node) => number) | undefined;
+    getCenter?: ((d?: Node, degree?: number) => number[]) | undefined;
+    monitor?: (params: {
+        energy: number;
+        nodes: Node[];
+        edges: Edge[];
+        iterations: number;
+    }) => void;
+}
+export interface FruchtermanLayoutOptions extends CommonOptions {
+    center?: PointTuple;
+    maxIteration?: number;
+    width?: number;
+    height?: number;
+    gravity?: number;
+    speed?: number;
+    clustering?: boolean;
+    clusterGravity?: number;
+    nodeClusterBy?: string;
+    onTick?: (data: LayoutMapping) => void;
 }
+export {};

package/lib/util/function.d.ts

@@ -1,6 +1,20 @@
+import { Node } from "../types";
 export declare const isFunction: (val: unknown) => val is Function;
-export declare const getFunc: (value: number, defaultValue: number, func?: ((d?: any) => number) | undefined) => Function;
-export declare const getFuncByUnknownType: (defaultValue: number, value?: number | number[] | {
+/**
+ * Format value with multiple types into a function returns number.
+ * @param defaultValue default value when value is invalid
+ * @param value value to be formatted
+ * @returns formatted result, a function returns number
+ */
+export declare function formatNumberFn<T = unknown>(defaultValue: number, value: number | ((d?: T) => number) | undefined): (d?: T | undefined) => number;
+/**
+ * Format size config with multiple types into a function returns number
+ * @param defaultValue default value when value is invalid
+ * @param value value to be formatted
+ * @param resultIsNumber whether returns number
+ * @returns formatted result, a function returns number
+ */
+export declare function formatSizeFn<T extends Node>(defaultValue: number, value?: number | number[] | {
     width: number;
     height: number;
-} | ((d?: any) => number) | undefined, resultIsNumber?: boolean) => (d?: any) => number | number[];
+} | ((d?: T) => number) | undefined, resultIsNumber?: boolean): (d: T) => number | number[];

package/lib/util/gpu.d.ts

@@ -1,11 +1,4 @@
 import { OutNode, Edge } from "../types";
-/**
- * 将 number | Function 类型的参数转换为 return number 的 Function
- * @param  {number | Function}  value 需要被转换的值
- * @param  {number}  defaultV 返回函数的默认返回值
- * @return {Function} 转换后的函数
- */
-export declare const proccessToFunc: (value: number | Function | undefined, defaultV?: number) => (d?: any) => number;
 /**
  * 将节点和边数据转换为 GPU 可读的数组。并返回 maxEdgePerVetex，每个节点上最多的边数
  * @param  {NodeConfig[]}  nodes 需要被转换的值

package/lib/util/math.d.ts

@@ -1,11 +1,9 @@
-import { Matrix, Model, IndexMap, Edge, Node, OutNode, Degree, NodeMap } from "../types";
-export declare const getEdgeTerminal: (edge: Edge, type: "source" | "target") => any;
-export declare const getDegree: (n: number, nodeIdxMap: IndexMap, edges: Edge[] | null) => Degree[];
-export declare const getDegreeMap: (nodes: Node[], edges: Edge[] | null) => {
-    [id: string]: Degree;
-};
+import type { Matrix, Edge, Node, OutNode, Degree, Point } from "../types";
 export declare const floydWarshall: (adjMatrix: Matrix[]) => Matrix[];
-export declare const getAdjMatrix: (data: Model, directed: boolean) => Matrix[];
+export declare const getAdjMatrix: (data: {
+    nodes: Node[];
+    edges: Edge[];
+}, directed: boolean) => Matrix[];
 /**
  * scale matrix
  * @param matrix [ [], [], [] ]
@@ -41,8 +39,17 @@ export declare const getAvgNodePosition: (nodes: OutNode[]) => {
 };
 export declare const getCoreNodeAndRelativeLeafNodes: (type: "leaf" | "all", node: Node, edges: Edge[], nodeClusterBy: string, degreesMap: {
     [id: string]: Degree;
-}, nodeMap: NodeMap) => {
+}, nodeMap: {
+    [id: string]: Node;
+}) => {
     coreNode: Node;
     relativeLeafNodes: Node[];
     sameTypeLeafNodes: Node[];
 };
+/**
+ * calculate the euclidean distance form p1 to p2
+ * @param p1
+ * @param p2
+ * @returns
+ */
+export declare const getEuclideanDistance: (p1: Point, p2: Point) => number;

package/lib/util/object.d.ts

@@ -1,2 +1,10 @@
+import { Node, Edge } from '../types';
 export declare const isObject: (val: unknown) => val is Record<any, any>;
 export declare const clone: <T>(target: T) => T;
+/**
+ * Clone node or edge data and format it
+ * @param target node/edge to be cloned
+ * @param initRange whether init the x and y in data with the range, which means [xRange, yRange]
+ * @returns cloned node/edge
+ */
+export declare const cloneFormatData: <T extends Node | Edge>(target: T, initRange?: [number, number]) => T;

package/lib/worker.d.ts

@@ -1,3 +1,3 @@
 import type { Payload } from "./supervisor";
-import type { LayoutMapping } from "./types";
-export declare function calculateLayout(payload: Payload, transferables: Float32Array[]): (LayoutMapping | Float32Array[])[];
+export declare function stopLayout(): void;
+export declare function calculateLayout(payload: Payload, transferables: Float32Array[]): Promise<unknown>;

package/package.json

@@ -1,14 +1,15 @@
 {
   "name": "@antv/layout",
-  "version": "1.0.0-alpha.1",
+  "version": "1.0.0-alpha.11",
   "description": "graph layout algorithm",
   "main": "dist/index.min.js",
-  "module": "dist/index.min.js",
+  "module": "esm/index.esm.js",
   "types": "lib/index.d.ts",
   "unpkg": "dist/index.min.js",
   "files": [
     "package.json",
     "dist",
+    "esm",
     "lib",
     "LICENSE",
     "README.md"
@@ -20,14 +21,18 @@
     "antv"
   ],
   "dependencies": {
-    "@antv/graphlib": "^2.0.0-alpha.0",
+    "@antv/graphlib": "^2.0.0-alpha.2",
     "@naoak/workerize-transferable": "^0.1.0",
-    "eventemitter3": "^4.0.0"
+    "d3-force": "^3.0.0",
+    "d3-quadtree": "^3.0.1",
+    "eventemitter3": "^4.0.0",
+    "ml-matrix": "^6.10.4"
   },
   "devDependencies": {
     "@babel/core": "^7.7.7",
     "@babel/plugin-proposal-class-properties": "^7.1.0",
     "@babel/preset-react": "^7.7.4",
+    "@types/d3-force": "^3.0.4",
     "babel-loader": "^8.0.6",
     "ts-loader": "^7.0.3",
     "typescript": "^4.0.3",
@@ -36,6 +41,10 @@
     "workerize-loader": "^2.0.2"
   },
   "scripts": {
-    "build:umd": "webpack --config webpack.config.js --mode production"
+    "dev": "webpack --config webpack.dev.config.js --mode development",
+    "build": "npm run build:esm && npm run build:umd",
+    "build:esm": "webpack --config webpack.esm.config.js --mode production",
+    "build:umd": "webpack --config webpack.config.js --mode production",
+    "publish:alpha": "npm publish --tag alpha"
   }
 }