@antv/g6-core - npm Package Compare versions

Comparing version 0.6.15 to 0.6.16

es/global.js

@@ -50,3 +50,3 @@ var subjectColor = 'rgb(95, 149, 255)';
 export default {
-  version: '0.6.15',
+  version: '0.6.16',
   rootContainerClassName: 'root-container',
@@ -53,0 +53,0 @@ nodeContainerClassName: 'node-container',

es/graph/controller/view.d.ts

@@ -10,2 +10,3 @@ import { Point } from '@antv/g-base';
     fitCenter(animate?: boolean, animateCfg?: GraphAnimateConfig): void;
+    private animatedFitView;
     fitView(animate?: boolean, animateCfg?: GraphAnimateConfig): void;
@@ -12,0 +13,0 @@ fitViewByRules(rules: FitViewRules, animate?: boolean, animateCfg?: GraphAnimateConfig): void;

es/graph/controller/view.js

 import { __assign } from "tslib";
 import { isNumber, isString } from '@antv/util';
 import { formatPadding } from '../../util/base';
-import { applyMatrix, invertMatrix } from '../../util/math';
+import { applyMatrix, invertMatrix, lerpArray } from '../../util/math';
+import { transform } from '@antv/matrix-util/lib/ext';
+import { getAnimateCfgWithCallback } from '../../util/graphic';
 
@@ -39,2 +41,49 @@ var ViewController =
     graph.translate(viewCenter.x - groupCenter.x, viewCenter.y - groupCenter.y, animate, animateCfg);
+  };
+
+  ViewController.prototype.animatedFitView = function (group, startMatrix, animateCfg, bbox, viewCenter, groupCenter, ratio) {
+    var graph = this.graph;
+    animateCfg = animateCfg ? animateCfg : {
+      duration: 500,
+      easing: 'easeCubic'
+    }; // start from the default matrix
+
+    var matrix = [1, 0, 0, 0, 1, 0, 0, 0, 1]; // Translate
+
+    var vx = bbox.x + viewCenter.x - groupCenter.x - bbox.minX;
+    var vy = bbox.y + viewCenter.y - groupCenter.y - bbox.minY;
+    var translatedMatrix = transform(matrix, [['t', vx, vy]]); // Zoom
+
+    var minZoom = graph.get('minZoom');
+    var maxZoom = graph.get('maxZoom');
+    var realRatio = ratio;
+
+    if (minZoom && ratio < minZoom) {
+      realRatio = minZoom;
+      console.warn('fitview failed, ratio out of range, ratio: %f', ratio, 'graph minzoom has been used instead');
+    } else if (maxZoom && ratio > maxZoom) {
+      realRatio = minZoom;
+      console.warn('fitview failed, ratio out of range, ratio: %f', ratio, 'graph maxzoom has been used instead');
+    }
+
+    var zoomedMatrix = transform(translatedMatrix, [['t', -viewCenter.x, -viewCenter.y], ['s', realRatio, realRatio], ['t', viewCenter.x, viewCenter.y]]); // Animation
+
+    var animationConfig = getAnimateCfgWithCallback({
+      animateCfg: animateCfg,
+      callback: function callback() {
+        graph.emit('viewportchange', {
+          action: 'translate',
+          matrix: translatedMatrix
+        });
+        graph.emit('viewportchange', {
+          action: 'zoom',
+          matrix: zoomedMatrix
+        });
+      }
+    });
+    group.animate(function (ratio) {
+      return {
+        matrix: lerpArray(startMatrix, zoomedMatrix, ratio)
+      };
+    }, animationConfig);
   }; // fit view graph
@@ -49,2 +98,3 @@
     var group = graph.get('group');
+    var startMatrix = group.getMatrix() || [1, 0, 0, 0, 1, 0, 0, 0, 1];
     group.resetMatrix();
@@ -57,19 +107,4 @@ var bbox = group.getCanvasBBox();
       y: bbox.y + bbox.height / 2
-    };
-    var animateConfig = animateCfg;
+    }; // Compute ratio
 
-    if (animate) {
-      animateConfig = __assign(__assign({}, animateCfg || {
-        duration: 500,
-        easing: 'easeCubic'
-      }), {
-        callback: function callback() {
-          var _a;
-
-          graph.zoom(ratio, viewCenter, true, animateCfg);
-          (_a = animateCfg === null || animateCfg === void 0 ? void 0 : animateCfg.callback) === null || _a === void 0 ? void 0 : _a.call(animateCfg);
-        }
-      });
-    }
-
     var w = (width - padding[1] - padding[3]) / bbox.width;
@@ -83,6 +118,10 @@ var h = (height - padding[0] - padding[2]) / bbox.height;
 
-    graph.translate(viewCenter.x - groupCenter.x, viewCenter.y - groupCenter.y, animate, animateConfig);
+    if (animate) {
+      this.animatedFitView(group, startMatrix, animateCfg, bbox, viewCenter, groupCenter, ratio);
+    } else {
+      graph.translate(viewCenter.x - groupCenter.x, viewCenter.y - groupCenter.y);
 
-    if (!animate && !graph.zoom(ratio, viewCenter)) {
-      console.warn('zoom failed, ratio out of range, ratio: %f', ratio);
+      if (!graph.zoom(ratio, viewCenter)) {
+        console.warn('zoom failed, ratio out of range, ratio: %f', ratio);
+      }
     }
@@ -104,2 +143,3 @@ }; // fit view graph by rule
     var group = graph.get('group');
+    var startMatrix = group.getMatrix() || [1, 0, 0, 0, 1, 0, 0, 0, 1];
     group.resetMatrix();
@@ -112,4 +152,4 @@ var bbox = group.getCanvasBBox();
       y: bbox.y + bbox.height / 2
-    };
-    graph.translate(viewCenter.x - groupCenter.x, viewCenter.y - groupCenter.y, animate, animateCfg);
+    }; // Compute ratio
+
     var wRatio = (width - padding[1] - padding[3]) / bbox.width;
@@ -133,12 +173,17 @@ var hRatio = (height - padding[0] - padding[2]) / bbox.height;
 
-    var initZoomRatio = graph.getZoom();
-    var endZoom = initZoomRatio * ratio;
-    var minZoom = graph.get('minZoom'); // 如果zoom小于最小zoom, 则以最小zoom为准
+    if (animate) {
+      this.animatedFitView(group, startMatrix, animateCfg, bbox, viewCenter, groupCenter, ratio);
+    } else {
+      var initZoomRatio = graph.getZoom();
+      var endZoom = initZoomRatio * ratio;
+      var minZoom = graph.get('minZoom'); // 如果zoom小于最小zoom, 则以最小zoom为准
 
-    if (endZoom < minZoom) {
-      endZoom = minZoom;
-      console.warn('fitview failed, ratio out of range, ratio: %f', ratio, 'graph minzoom has been used instead');
+      if (endZoom < minZoom) {
+        endZoom = minZoom;
+        console.warn('fitview failed, ratio out of range, ratio: %f', ratio, 'graph minzoom has been used instead');
+      }
+
+      graph.translate(viewCenter.x - groupCenter.x, viewCenter.y - groupCenter.y);
+      graph.zoomTo(endZoom, viewCenter);
     }
-
-    graph.zoomTo(endZoom, viewCenter, animate, animateCfg);
   };
@@ -145,0 +190,0 @@

es/graph/graph.d.ts

@@ -157,4 +157,3 @@ import EventEmitter from '@antv/event-emitter';
      */
-    findAllByState<T extends Item>(type: ITEM_TYPE, state: string): T[];
-    private getAnimateCfgWithCallback;
+    findAllByState<T extends Item>(type: ITEM_TYPE, state: string, additionalFilter?: (item: Item) => boolean): T[];
     /**
@@ -500,3 +499,3 @@ * 平移画布
      */
-    updateLayout(cfg: any, align?: 'center' | 'begin', alignPoint?: IPoint): void;
+    updateLayout(cfg: any, align?: 'center' | 'begin', alignPoint?: IPoint, stack?: boolean): void;
     /**
@@ -503,0 +502,0 @@ * 销毁布局，changeData 时不会再使用原来的布局方法对新数据进行布局

es/index.d.ts

@@ -422,2 +422,3 @@ import AbstractGraph from './graph/graph';
         lerp: (start: number, end: number, alpha: number) => number;
+        lerpArray: (start: number[], end: number[], alpha: number) => number[];
         roundedHull(polyPoints: import("gl-matrix").vec2[], padding: number): string;
@@ -484,2 +485,6 @@ paddedHull(polyPoints: import("gl-matrix").vec2[], padding: number): string | {
         cloneBesidesImg: (obj: any) => {};
+        getAnimateCfgWithCallback: ({ animateCfg, callback }: {
+            animateCfg: import("./types").GraphAnimateConfig;
+            callback: () => void;
+        }) => import("./types").GraphAnimateConfig;
         uniqueId: (type: string) => string;
@@ -486,0 +491,0 @@ formatPadding: (padding: import("./types").Padding) => number[];

es/interface/graph.d.ts

@@ -409,3 +409,3 @@ import EventEmitter from '@antv/event-emitter';
      */
-    findAllByState: <T extends Item>(type: ITEM_TYPE, state: string) => T[];
+    findAllByState: <T extends Item>(type: ITEM_TYPE, state: string, additionalFilter?: (item: Item) => boolean) => T[];
     /**
@@ -417,3 +417,3 @@ * 更换布局配置项
      */
-    updateLayout: (cfg: LayoutConfig, align?: 'center' | 'begin', canvasPoint?: IPoint) => void;
+    updateLayout: (cfg: LayoutConfig, align?: 'center' | 'begin', canvasPoint?: IPoint, stack?: boolean) => void;
     /**
@@ -420,0 +420,0 @@ * 重新以当前示例中配置的属性进行一次布局

es/item/item.js

@@ -83,7 +83,9 @@ import { __assign } from "tslib";
 
-    if (!id) {
+    if (typeof id === 'undefined') {
       id = uniqueId(itemType);
-      this.get('model').id = id;
+    } else if (typeof id !== 'string') {
+      id = String(id);
     }
 
+    this.get('model').id = id;
     this.set('id', id);
@@ -90,0 +92,0 @@ var group = cfg.group;

es/util/graphic.d.ts

 import { IGroup, BBox } from '@antv/g-base';
-import { EdgeData, IBBox, IShapeBase, LabelStyle, NodeConfig, ComboTree, ComboConfig, ICombo } from '../types';
+import { EdgeData, IBBox, IShapeBase, LabelStyle, NodeConfig, ComboTree, ComboConfig, ICombo, GraphAnimateConfig } from '../types';
 import { IAbstractGraph } from '../interface/graph';
@@ -60,1 +60,5 @@ export declare const getBBox: (element: IShapeBase, group: IGroup) => IBBox;
 export declare const cloneBesidesImg: (obj: any) => {};
+export declare const getAnimateCfgWithCallback: ({ animateCfg, callback }: {
+    animateCfg: GraphAnimateConfig;
+    callback: () => void;
+}) => GraphAnimateConfig;

es/util/graphic.js

@@ -696,2 +696,29 @@ import { __assign } from "tslib";
   return clonedObj;
+};
+export var getAnimateCfgWithCallback = function getAnimateCfgWithCallback(_a) {
+  var animateCfg = _a.animateCfg,
+      callback = _a.callback;
+  var animateConfig;
+
+  if (!animateCfg) {
+    animateConfig = {
+      duration: 500,
+      callback: callback
+    };
+  } else {
+    animateConfig = clone(animateCfg);
+
+    if (animateCfg.callback) {
+      var animateCfgCallback_1 = animateCfg.callback;
+
+      animateConfig.callback = function () {
+        callback();
+        animateCfgCallback_1();
+      };
+    } else {
+      animateConfig.callback = callback;
+    }
+  }
+
+  return animateConfig;
 };

es/util/index.d.ts

@@ -38,2 +38,3 @@ import * as MathUtil from './math';
     lerp: (start: number, end: number, alpha: number) => number;
+    lerpArray: (start: number[], end: number[], alpha: number) => number[];
     roundedHull(polyPoints: import("gl-matrix").vec2[], padding: number): string;
@@ -100,2 +101,6 @@ paddedHull(polyPoints: import("gl-matrix").vec2[], padding: number): string | {
     cloneBesidesImg: (obj: any) => {};
+    getAnimateCfgWithCallback: ({ animateCfg, callback }: {
+        animateCfg: import("..").GraphAnimateConfig;
+        callback: () => void;
+    }) => import("..").GraphAnimateConfig;
     uniqueId: (type: string) => string;
@@ -102,0 +107,0 @@ formatPadding: (padding: import("..").Padding) => number[];

es/util/math.d.ts

@@ -168,7 +168,16 @@ import { Point, IGroup } from '@antv/g-base';
  * alpha = 0 will be start, and alpha = 1 will be end.
- * @param {Number} start
- * @param {Number} end
- * @param {Number} alpha interpolation factor, typically in the closed interval [0, 1]
- * @returns
+ * @param {number} start
+ * @param {number} end
+ * @param {number} alpha interpolation factor, typically in the closed interval [0, 1]
+ * @returns {number}
  */
 export declare const lerp: (start: number, end: number, alpha: number) => number;
+/**
+ * Linearly interpolate between start and end arrays, where alpha is the percent distance along the line.
+ * alpha = 0 will be start, and alpha = 1 will be end.
+ * @param {number[]} start
+ * @param {number[]} end
+ * @param {number} alpha interpolation factor, typically in the closed interval [0, 1]
+ * @returns {number[]}
+ */
+export declare const lerpArray: (start: number[], end: number[], alpha: number) => number[];

es/util/math.js

@@ -896,6 +896,6 @@ import { mat3, vec3, ext, vec2 } from '@antv/matrix-util';
  * alpha = 0 will be start, and alpha = 1 will be end.
- * @param {Number} start
- * @param {Number} end
- * @param {Number} alpha interpolation factor, typically in the closed interval [0, 1]
- * @returns
+ * @param {number} start
+ * @param {number} end
+ * @param {number} alpha interpolation factor, typically in the closed interval [0, 1]
+ * @returns {number}
  */
@@ -905,2 +905,21 @@
   return start + (end - start) * alpha;
+};
+/**
+ * Linearly interpolate between start and end arrays, where alpha is the percent distance along the line.
+ * alpha = 0 will be start, and alpha = 1 will be end.
+ * @param {number[]} start
+ * @param {number[]} end
+ * @param {number} alpha interpolation factor, typically in the closed interval [0, 1]
+ * @returns {number[]}
+ */
+
+export var lerpArray = function lerpArray(start, end, alpha) {
+  var len = Math.min(start.length, end.length);
+  var out = new Array(len);
+
+  for (var i = 0; i < len; i++) {
+    out[i] = lerp(start[i], end[i], alpha);
+  }
+
+  return out;
 };

lib/global.js

@@ -56,3 +56,3 @@ "use strict";
 var _default = {
-  version: '0.6.15',
+  version: '0.6.16',
   rootContainerClassName: 'root-container',
@@ -59,0 +59,0 @@ nodeContainerClassName: 'node-container',

lib/graph/controller/view.d.ts

@@ -10,2 +10,3 @@ import { Point } from '@antv/g-base';
     fitCenter(animate?: boolean, animateCfg?: GraphAnimateConfig): void;
+    private animatedFitView;
     fitView(animate?: boolean, animateCfg?: GraphAnimateConfig): void;
@@ -12,0 +13,0 @@ fitViewByRules(rules: FitViewRules, animate?: boolean, animateCfg?: GraphAnimateConfig): void;

lib/graph/controller/view.js

@@ -16,2 +16,6 @@ "use strict";
 
+var _ext = require("@antv/matrix-util/lib/ext");
+
+var _graphic = require("../../util/graphic");
+
 var ViewController =
@@ -50,2 +54,49 @@ /** @class */
     graph.translate(viewCenter.x - groupCenter.x, viewCenter.y - groupCenter.y, animate, animateCfg);
+  };
+
+  ViewController.prototype.animatedFitView = function (group, startMatrix, animateCfg, bbox, viewCenter, groupCenter, ratio) {
+    var graph = this.graph;
+    animateCfg = animateCfg ? animateCfg : {
+      duration: 500,
+      easing: 'easeCubic'
+    }; // start from the default matrix
+
+    var matrix = [1, 0, 0, 0, 1, 0, 0, 0, 1]; // Translate
+
+    var vx = bbox.x + viewCenter.x - groupCenter.x - bbox.minX;
+    var vy = bbox.y + viewCenter.y - groupCenter.y - bbox.minY;
+    var translatedMatrix = (0, _ext.transform)(matrix, [['t', vx, vy]]); // Zoom
+
+    var minZoom = graph.get('minZoom');
+    var maxZoom = graph.get('maxZoom');
+    var realRatio = ratio;
+
+    if (minZoom && ratio < minZoom) {
+      realRatio = minZoom;
+      console.warn('fitview failed, ratio out of range, ratio: %f', ratio, 'graph minzoom has been used instead');
+    } else if (maxZoom && ratio > maxZoom) {
+      realRatio = minZoom;
+      console.warn('fitview failed, ratio out of range, ratio: %f', ratio, 'graph maxzoom has been used instead');
+    }
+
+    var zoomedMatrix = (0, _ext.transform)(translatedMatrix, [['t', -viewCenter.x, -viewCenter.y], ['s', realRatio, realRatio], ['t', viewCenter.x, viewCenter.y]]); // Animation
+
+    var animationConfig = (0, _graphic.getAnimateCfgWithCallback)({
+      animateCfg: animateCfg,
+      callback: function callback() {
+        graph.emit('viewportchange', {
+          action: 'translate',
+          matrix: translatedMatrix
+        });
+        graph.emit('viewportchange', {
+          action: 'zoom',
+          matrix: zoomedMatrix
+        });
+      }
+    });
+    group.animate(function (ratio) {
+      return {
+        matrix: (0, _math.lerpArray)(startMatrix, zoomedMatrix, ratio)
+      };
+    }, animationConfig);
   }; // fit view graph
@@ -60,2 +111,3 @@
     var group = graph.get('group');
+    var startMatrix = group.getMatrix() || [1, 0, 0, 0, 1, 0, 0, 0, 1];
     group.resetMatrix();
@@ -68,19 +120,4 @@ var bbox = group.getCanvasBBox();
       y: bbox.y + bbox.height / 2
-    };
-    var animateConfig = animateCfg;
+    }; // Compute ratio
 
-    if (animate) {
-      animateConfig = (0, _tslib.__assign)((0, _tslib.__assign)({}, animateCfg || {
-        duration: 500,
-        easing: 'easeCubic'
-      }), {
-        callback: function callback() {
-          var _a;
-
-          graph.zoom(ratio, viewCenter, true, animateCfg);
-          (_a = animateCfg === null || animateCfg === void 0 ? void 0 : animateCfg.callback) === null || _a === void 0 ? void 0 : _a.call(animateCfg);
-        }
-      });
-    }
-
     var w = (width - padding[1] - padding[3]) / bbox.width;
@@ -94,6 +131,10 @@ var h = (height - padding[0] - padding[2]) / bbox.height;
 
-    graph.translate(viewCenter.x - groupCenter.x, viewCenter.y - groupCenter.y, animate, animateConfig);
+    if (animate) {
+      this.animatedFitView(group, startMatrix, animateCfg, bbox, viewCenter, groupCenter, ratio);
+    } else {
+      graph.translate(viewCenter.x - groupCenter.x, viewCenter.y - groupCenter.y);
 
-    if (!animate && !graph.zoom(ratio, viewCenter)) {
-      console.warn('zoom failed, ratio out of range, ratio: %f', ratio);
+      if (!graph.zoom(ratio, viewCenter)) {
+        console.warn('zoom failed, ratio out of range, ratio: %f', ratio);
+      }
     }
@@ -115,2 +156,3 @@ }; // fit view graph by rule
     var group = graph.get('group');
+    var startMatrix = group.getMatrix() || [1, 0, 0, 0, 1, 0, 0, 0, 1];
     group.resetMatrix();
@@ -123,4 +165,4 @@ var bbox = group.getCanvasBBox();
       y: bbox.y + bbox.height / 2
-    };
-    graph.translate(viewCenter.x - groupCenter.x, viewCenter.y - groupCenter.y, animate, animateCfg);
+    }; // Compute ratio
+
     var wRatio = (width - padding[1] - padding[3]) / bbox.width;
@@ -144,12 +186,17 @@ var hRatio = (height - padding[0] - padding[2]) / bbox.height;
 
-    var initZoomRatio = graph.getZoom();
-    var endZoom = initZoomRatio * ratio;
-    var minZoom = graph.get('minZoom'); // 如果zoom小于最小zoom, 则以最小zoom为准
+    if (animate) {
+      this.animatedFitView(group, startMatrix, animateCfg, bbox, viewCenter, groupCenter, ratio);
+    } else {
+      var initZoomRatio = graph.getZoom();
+      var endZoom = initZoomRatio * ratio;
+      var minZoom = graph.get('minZoom'); // 如果zoom小于最小zoom, 则以最小zoom为准
 
-    if (endZoom < minZoom) {
-      endZoom = minZoom;
-      console.warn('fitview failed, ratio out of range, ratio: %f', ratio, 'graph minzoom has been used instead');
+      if (endZoom < minZoom) {
+        endZoom = minZoom;
+        console.warn('fitview failed, ratio out of range, ratio: %f', ratio, 'graph minzoom has been used instead');
+      }
+
+      graph.translate(viewCenter.x - groupCenter.x, viewCenter.y - groupCenter.y);
+      graph.zoomTo(endZoom, viewCenter);
     }
-
-    graph.zoomTo(endZoom, viewCenter, animate, animateCfg);
   };
@@ -156,0 +203,0 @@

lib/graph/graph.d.ts

@@ -157,4 +157,3 @@ import EventEmitter from '@antv/event-emitter';
      */
-    findAllByState<T extends Item>(type: ITEM_TYPE, state: string): T[];
-    private getAnimateCfgWithCallback;
+    findAllByState<T extends Item>(type: ITEM_TYPE, state: string, additionalFilter?: (item: Item) => boolean): T[];
     /**
@@ -500,3 +499,3 @@ * 平移画布
      */
-    updateLayout(cfg: any, align?: 'center' | 'begin', alignPoint?: IPoint): void;
+    updateLayout(cfg: any, align?: 'center' | 'begin', alignPoint?: IPoint, stack?: boolean): void;
     /**
@@ -503,0 +502,0 @@ * 销毁布局，changeData 时不会再使用原来的布局方法对新数据进行布局

lib/index.d.ts

@@ -422,2 +422,3 @@ import AbstractGraph from './graph/graph';
         lerp: (start: number, end: number, alpha: number) => number;
+        lerpArray: (start: number[], end: number[], alpha: number) => number[];
         roundedHull(polyPoints: import("gl-matrix").vec2[], padding: number): string;
@@ -484,2 +485,6 @@ paddedHull(polyPoints: import("gl-matrix").vec2[], padding: number): string | {
         cloneBesidesImg: (obj: any) => {};
+        getAnimateCfgWithCallback: ({ animateCfg, callback }: {
+            animateCfg: import("./types").GraphAnimateConfig;
+            callback: () => void;
+        }) => import("./types").GraphAnimateConfig;
         uniqueId: (type: string) => string;
@@ -486,0 +491,0 @@ formatPadding: (padding: import("./types").Padding) => number[];

lib/interface/graph.d.ts

@@ -409,3 +409,3 @@ import EventEmitter from '@antv/event-emitter';
      */
-    findAllByState: <T extends Item>(type: ITEM_TYPE, state: string) => T[];
+    findAllByState: <T extends Item>(type: ITEM_TYPE, state: string, additionalFilter?: (item: Item) => boolean) => T[];
     /**
@@ -417,3 +417,3 @@ * 更换布局配置项
      */
-    updateLayout: (cfg: LayoutConfig, align?: 'center' | 'begin', canvasPoint?: IPoint) => void;
+    updateLayout: (cfg: LayoutConfig, align?: 'center' | 'begin', canvasPoint?: IPoint, stack?: boolean) => void;
     /**
@@ -420,0 +420,0 @@ * 重新以当前示例中配置的属性进行一次布局

lib/item/item.js

@@ -98,7 +98,9 @@ "use strict";
 
-    if (!id) {
+    if (typeof id === 'undefined') {
       id = (0, _base.uniqueId)(itemType);
-      this.get('model').id = id;
+    } else if (typeof id !== 'string') {
+      id = String(id);
     }
 
+    this.get('model').id = id;
     this.set('id', id);
@@ -105,0 +107,0 @@ var group = cfg.group;

lib/util/graphic.d.ts

 import { IGroup, BBox } from '@antv/g-base';
-import { EdgeData, IBBox, IShapeBase, LabelStyle, NodeConfig, ComboTree, ComboConfig, ICombo } from '../types';
+import { EdgeData, IBBox, IShapeBase, LabelStyle, NodeConfig, ComboTree, ComboConfig, ICombo, GraphAnimateConfig } from '../types';
 import { IAbstractGraph } from '../interface/graph';
@@ -60,1 +60,5 @@ export declare const getBBox: (element: IShapeBase, group: IGroup) => IBBox;
 export declare const cloneBesidesImg: (obj: any) => {};
+export declare const getAnimateCfgWithCallback: ({ animateCfg, callback }: {
+    animateCfg: GraphAnimateConfig;
+    callback: () => void;
+}) => GraphAnimateConfig;

lib/util/graphic.js

@@ -6,3 +6,3 @@ "use strict";
 });
-exports.truncateLabelByLength = exports.traverseTreeUp = exports.traverseTree = exports.shouldRefreshEdge = exports.reconstructTree = exports.plainCombosToTrees = exports.getTextSize = exports.getLoopCfgs = exports.getLetterWidth = exports.getLabelPosition = exports.getComboBBox = exports.getBBox = exports.cloneBesidesImg = void 0;
+exports.truncateLabelByLength = exports.traverseTreeUp = exports.traverseTree = exports.shouldRefreshEdge = exports.reconstructTree = exports.plainCombosToTrees = exports.getTextSize = exports.getLoopCfgs = exports.getLetterWidth = exports.getLabelPosition = exports.getComboBBox = exports.getBBox = exports.getAnimateCfgWithCallback = exports.cloneBesidesImg = void 0;
 
@@ -754,2 +754,32 @@ var _tslib = require("tslib");
 
-exports.cloneBesidesImg = cloneBesidesImg;
+exports.cloneBesidesImg = cloneBesidesImg;
+
+var getAnimateCfgWithCallback = function getAnimateCfgWithCallback(_a) {
+  var animateCfg = _a.animateCfg,
+      callback = _a.callback;
+  var animateConfig;
+
+  if (!animateCfg) {
+    animateConfig = {
+      duration: 500,
+      callback: callback
+    };
+  } else {
+    animateConfig = (0, _util.clone)(animateCfg);
+
+    if (animateCfg.callback) {
+      var animateCfgCallback_1 = animateCfg.callback;
+
+      animateConfig.callback = function () {
+        callback();
+        animateCfgCallback_1();
+      };
+    } else {
+      animateConfig.callback = callback;
+    }
+  }
+
+  return animateConfig;
+};
+
+exports.getAnimateCfgWithCallback = getAnimateCfgWithCallback;

lib/util/index.d.ts

@@ -38,2 +38,3 @@ import * as MathUtil from './math';
     lerp: (start: number, end: number, alpha: number) => number;
+    lerpArray: (start: number[], end: number[], alpha: number) => number[];
     roundedHull(polyPoints: import("gl-matrix").vec2[], padding: number): string;
@@ -100,2 +101,6 @@ paddedHull(polyPoints: import("gl-matrix").vec2[], padding: number): string | {
     cloneBesidesImg: (obj: any) => {};
+    getAnimateCfgWithCallback: ({ animateCfg, callback }: {
+        animateCfg: import("..").GraphAnimateConfig;
+        callback: () => void;
+    }) => import("..").GraphAnimateConfig;
     uniqueId: (type: string) => string;
@@ -102,0 +107,0 @@ formatPadding: (padding: import("..").Padding) => number[];

lib/util/math.d.ts

@@ -168,7 +168,16 @@ import { Point, IGroup } from '@antv/g-base';
  * alpha = 0 will be start, and alpha = 1 will be end.
- * @param {Number} start
- * @param {Number} end
- * @param {Number} alpha interpolation factor, typically in the closed interval [0, 1]
- * @returns
+ * @param {number} start
+ * @param {number} end
+ * @param {number} alpha interpolation factor, typically in the closed interval [0, 1]
+ * @returns {number}
  */
 export declare const lerp: (start: number, end: number, alpha: number) => number;
+/**
+ * Linearly interpolate between start and end arrays, where alpha is the percent distance along the line.
+ * alpha = 0 will be start, and alpha = 1 will be end.
+ * @param {number[]} start
+ * @param {number[]} end
+ * @param {number} alpha interpolation factor, typically in the closed interval [0, 1]
+ * @returns {number[]}
+ */
+export declare const lerpArray: (start: number[], end: number[], alpha: number) => number[];

lib/util/math.js

@@ -6,3 +6,3 @@ "use strict";
 });
-exports.translate = exports.squareDist = exports.scaleMatrix = exports.scale = exports.rotate = exports.pointRectSquareDist = exports.pointLineSquareDist = exports.pointLineDistance = exports.move = exports.lerp = exports.itemIntersectByLine = exports.isPolygonsIntersect = exports.isPointsOverlap = exports.isPointInPolygon = exports.invertMatrix = exports.intersectBBox = exports.getRectIntersectByPoint = exports.getPointsCenter = exports.getLineIntersect = exports.getEllipseIntersectByPoint = exports.getDegree = exports.getCircleIntersectByPoint = exports.getCircleCenterByPoints = exports.getBBoxBoundLine = exports.getAdjMatrix = exports.fractionToLine = exports.floydWarshall = exports.distance = exports.compare = exports.applyMatrix = exports.Line = void 0;
+exports.translate = exports.squareDist = exports.scaleMatrix = exports.scale = exports.rotate = exports.pointRectSquareDist = exports.pointLineSquareDist = exports.pointLineDistance = exports.move = exports.lerpArray = exports.lerp = exports.itemIntersectByLine = exports.isPolygonsIntersect = exports.isPointsOverlap = exports.isPointInPolygon = exports.invertMatrix = exports.intersectBBox = exports.getRectIntersectByPoint = exports.getPointsCenter = exports.getLineIntersect = exports.getEllipseIntersectByPoint = exports.getDegree = exports.getCircleIntersectByPoint = exports.getCircleCenterByPoints = exports.getBBoxBoundLine = exports.getAdjMatrix = exports.fractionToLine = exports.floydWarshall = exports.distance = exports.compare = exports.applyMatrix = exports.Line = void 0;
 
@@ -993,6 +993,6 @@ var _matrixUtil = require("@antv/matrix-util");
  * alpha = 0 will be start, and alpha = 1 will be end.
- * @param {Number} start
- * @param {Number} end
- * @param {Number} alpha interpolation factor, typically in the closed interval [0, 1]
- * @returns
+ * @param {number} start
+ * @param {number} end
+ * @param {number} alpha interpolation factor, typically in the closed interval [0, 1]
+ * @returns {number}
  */
@@ -1006,3 +1006,25 @@
 };
+/**
+ * Linearly interpolate between start and end arrays, where alpha is the percent distance along the line.
+ * alpha = 0 will be start, and alpha = 1 will be end.
+ * @param {number[]} start
+ * @param {number[]} end
+ * @param {number} alpha interpolation factor, typically in the closed interval [0, 1]
+ * @returns {number[]}
+ */
 
-exports.lerp = lerp;
+
+exports.lerp = lerp;
+
+var lerpArray = function lerpArray(start, end, alpha) {
+  var len = Math.min(start.length, end.length);
+  var out = new Array(len);
+
+  for (var i = 0; i < len; i++) {
+    out[i] = lerp(start[i], end[i], alpha);
+  }
+
+  return out;
+};
+
+exports.lerpArray = lerpArray;

package.json

 {
   "name": "@antv/g6-core",
-  "version": "0.6.15",
+  "version": "0.6.16",
   "description": "A Graph Visualization Framework in JavaScript",
@@ -5,0 +5,0 @@ "keywords": [

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

1158176

increased by0.76%

Lines of code

34066

increased by0.6%

No dependency changes