@antv/g6-core - npm Package Compare versions

Comparing version 0.7.7 to 0.7.8

es/element/shapeBase.js

@@ -75,6 +75,3 @@ function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
   getOptions: function getOptions(cfg, updateType) {
-    if (updateType === 'move' || (updateType === null || updateType === void 0 ? void 0 : updateType.includes('bbox'))) {
-      return {};
-    }
-
+    if (updateType === 'move' || (updateType === null || updateType === void 0 ? void 0 : updateType.includes('bbox'))) return cfg;
     return deepMix({}, this.options, this.getCustomConfig(cfg) || {}, cfg);
@@ -81,0 +78,0 @@ },

es/global.js

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

es/index.d.ts

@@ -484,3 +484,3 @@ import AbstractGraph from './graph/graph';
         cloneBesidesImg: (obj: any) => {};
-        getAnimateCfgWithCallback: ({ animateCfg, callback }: {
+        getAnimateCfgWithCallback: ({ animateCfg, callback, }: {
             animateCfg: import("./types").GraphAnimateConfig;
@@ -487,0 +487,0 @@ callback: () => void;

es/types/index.d.ts

@@ -127,2 +127,3 @@ import { IGroup, Event as GraphEvent, BBox, AnimateCfg, ICanvas, IShape } from '@antv/g-base';
     clockwise: boolean;
+    pointPadding: number;
 }>;
@@ -129,0 +130,0 @@ export interface LayoutConfig {

es/util/graphic.d.ts

@@ -60,5 +60,5 @@ import { IGroup, BBox } from '@antv/g-base';
 export declare const cloneBesidesImg: (obj: any) => {};
-export declare const getAnimateCfgWithCallback: ({ animateCfg, callback }: {
+export declare const getAnimateCfgWithCallback: ({ animateCfg, callback, }: {
     animateCfg: GraphAnimateConfig;
     callback: () => void;
 }) => GraphAnimateConfig;

es/util/graphic.js

@@ -71,96 +71,159 @@ import { __assign } from "tslib";
   var endPoint = [cfg.endPoint.x, cfg.endPoint.y];
-  var rstart = bbox.height / 2;
-  var rend = bbox.height / 2;
+  var halfOfHeight = bbox.height / 2;
+  var halfOfWidth = bbox.width / 2;
+  var rstart = halfOfHeight;
+  var rend = halfOfHeight;
   var sinDeltaStart = rstart * SELF_LINK_SIN;
   var cosDeltaStart = rstart * SELF_LINK_COS;
   var sinDeltaEnd = rend * SELF_LINK_SIN;
-  var cosDeltaEnd = rend * SELF_LINK_COS; // 如果定义了锚点的，直接用锚点坐标，否则，根据自环的 cfg 计算
+  var cosDeltaEnd = rend * SELF_LINK_COS;
+  var shapeType = keyShape.get('type'); // 美观考虑，pointPadding 默认取宽高中最小的1/4
 
+  var defaultPointPadding = Math.min(halfOfHeight / 2, halfOfWidth / 2);
+  var maxPointPadding = Math.min(halfOfHeight, halfOfWidth); // 对于非圆形节点设置的连接点与节点中心坐标（`top-right`，`bottom-right`,`top-left`,`bottom-left`较特殊，为四个角坐标）在 x 轴或 y 轴方向的偏移量，默认为  `节点宽高中最小值的1/4`
+
+  var pointPadding = (loopCfg === null || loopCfg === void 0 ? void 0 : loopCfg.pointPadding) ? Math.min(maxPointPadding, loopCfg === null || loopCfg === void 0 ? void 0 : loopCfg.pointPadding) : defaultPointPadding; // 如果定义了锚点的，直接用锚点坐标，否则，根据自环的 cfg 计算
+
   if (startPoint[0] === endPoint[0] && startPoint[1] === endPoint[1]) {
     switch (position) {
       case 'top':
-        startPoint = [center[0] - sinDeltaStart, center[1] - cosDeltaStart];
-        endPoint = [center[0] + sinDeltaEnd, center[1] - cosDeltaEnd];
+        if (shapeType === 'circle') {
+          startPoint = [center[0] - sinDeltaStart, center[1] - cosDeltaStart];
+          endPoint = [center[0] + sinDeltaEnd, center[1] - cosDeltaEnd];
+        } else {
+          startPoint = [center[0] - pointPadding, center[1] - halfOfHeight];
+          endPoint = [center[0] + pointPadding, center[1] - halfOfHeight];
+        }
+
         break;
 
       case 'top-right':
-        rstart = bbox.height / 2;
-        rend = bbox.width / 2;
-        sinDeltaStart = rstart * SELF_LINK_SIN;
-        cosDeltaStart = rstart * SELF_LINK_COS;
-        sinDeltaEnd = rend * SELF_LINK_SIN;
-        cosDeltaEnd = rend * SELF_LINK_COS;
-        startPoint = [center[0] + sinDeltaStart, center[1] - cosDeltaStart];
-        endPoint = [center[0] + cosDeltaEnd, center[1] - sinDeltaEnd];
+        rstart = halfOfHeight;
+        rend = halfOfWidth;
+
+        if (shapeType === 'circle') {
+          sinDeltaStart = rstart * SELF_LINK_SIN;
+          cosDeltaStart = rstart * SELF_LINK_COS;
+          sinDeltaEnd = rend * SELF_LINK_SIN;
+          cosDeltaEnd = rend * SELF_LINK_COS;
+          startPoint = [center[0] + sinDeltaStart, center[1] - cosDeltaStart];
+          endPoint = [center[0] + cosDeltaEnd, center[1] - sinDeltaEnd];
+        } else {
+          startPoint = [center[0] + halfOfWidth - pointPadding, center[1] - halfOfHeight];
+          endPoint = [center[0] + halfOfWidth, center[1] - halfOfHeight + pointPadding];
+        }
+
         break;
 
       case 'right':
-        rstart = bbox.width / 2;
-        rend = bbox.width / 2;
-        sinDeltaStart = rstart * SELF_LINK_SIN;
-        cosDeltaStart = rstart * SELF_LINK_COS;
-        sinDeltaEnd = rend * SELF_LINK_SIN;
-        cosDeltaEnd = rend * SELF_LINK_COS;
-        startPoint = [center[0] + cosDeltaStart, center[1] - sinDeltaStart];
-        endPoint = [center[0] + cosDeltaEnd, center[1] + sinDeltaEnd];
+        rstart = halfOfWidth;
+        rend = halfOfWidth;
+
+        if (shapeType === 'circle') {
+          sinDeltaStart = rstart * SELF_LINK_SIN;
+          cosDeltaStart = rstart * SELF_LINK_COS;
+          sinDeltaEnd = rend * SELF_LINK_SIN;
+          cosDeltaEnd = rend * SELF_LINK_COS;
+          startPoint = [center[0] + cosDeltaStart, center[1] - sinDeltaStart];
+          endPoint = [center[0] + cosDeltaEnd, center[1] + sinDeltaEnd];
+        } else {
+          startPoint = [center[0] + halfOfWidth, center[1] - pointPadding];
+          endPoint = [center[0] + halfOfWidth, center[1] + pointPadding];
+        }
+
         break;
 
       case 'bottom-right':
-        rstart = bbox.width / 2;
-        rend = bbox.height / 2;
-        sinDeltaStart = rstart * SELF_LINK_SIN;
-        cosDeltaStart = rstart * SELF_LINK_COS;
-        sinDeltaEnd = rend * SELF_LINK_SIN;
-        cosDeltaEnd = rend * SELF_LINK_COS;
-        startPoint = [center[0] + cosDeltaStart, center[1] + sinDeltaStart];
-        endPoint = [center[0] + sinDeltaEnd, center[1] + cosDeltaEnd];
+        rstart = halfOfWidth;
+        rend = halfOfHeight;
+
+        if (shapeType === 'circle') {
+          sinDeltaStart = rstart * SELF_LINK_SIN;
+          cosDeltaStart = rstart * SELF_LINK_COS;
+          sinDeltaEnd = rend * SELF_LINK_SIN;
+          cosDeltaEnd = rend * SELF_LINK_COS;
+          startPoint = [center[0] + cosDeltaStart, center[1] + sinDeltaStart];
+          endPoint = [center[0] + sinDeltaEnd, center[1] + cosDeltaEnd];
+        } else {
+          startPoint = [center[0] + halfOfWidth, center[1] + halfOfHeight - pointPadding];
+          endPoint = [center[0] + halfOfWidth - pointPadding, center[1] + halfOfHeight];
+        }
+
         break;
 
       case 'bottom':
-        rstart = bbox.height / 2;
-        rend = bbox.height / 2;
-        sinDeltaStart = rstart * SELF_LINK_SIN;
-        cosDeltaStart = rstart * SELF_LINK_COS;
-        sinDeltaEnd = rend * SELF_LINK_SIN;
-        cosDeltaEnd = rend * SELF_LINK_COS;
-        startPoint = [center[0] + sinDeltaStart, center[1] + cosDeltaStart];
-        endPoint = [center[0] - sinDeltaEnd, center[1] + cosDeltaEnd];
+        rstart = halfOfHeight;
+        rend = halfOfHeight;
+
+        if (shapeType === 'circle') {
+          sinDeltaStart = rstart * SELF_LINK_SIN;
+          cosDeltaStart = rstart * SELF_LINK_COS;
+          sinDeltaEnd = rend * SELF_LINK_SIN;
+          cosDeltaEnd = rend * SELF_LINK_COS;
+          startPoint = [center[0] + sinDeltaStart, center[1] + cosDeltaStart];
+          endPoint = [center[0] - sinDeltaEnd, center[1] + cosDeltaEnd];
+        } else {
+          startPoint = [center[0] - pointPadding, center[1] + halfOfHeight];
+          endPoint = [center[0] + pointPadding, center[1] + halfOfHeight];
+        }
+
         break;
 
       case 'bottom-left':
-        rstart = bbox.height / 2;
-        rend = bbox.width / 2;
-        sinDeltaStart = rstart * SELF_LINK_SIN;
-        cosDeltaStart = rstart * SELF_LINK_COS;
-        sinDeltaEnd = rend * SELF_LINK_SIN;
-        cosDeltaEnd = rend * SELF_LINK_COS;
-        startPoint = [center[0] - sinDeltaStart, center[1] + cosDeltaStart];
-        endPoint = [center[0] - cosDeltaEnd, center[1] + sinDeltaEnd];
+        rstart = halfOfHeight;
+        rend = halfOfWidth;
+
+        if (shapeType === 'circle') {
+          sinDeltaStart = rstart * SELF_LINK_SIN;
+          cosDeltaStart = rstart * SELF_LINK_COS;
+          sinDeltaEnd = rend * SELF_LINK_SIN;
+          cosDeltaEnd = rend * SELF_LINK_COS;
+          startPoint = [center[0] - sinDeltaStart, center[1] + cosDeltaStart];
+          endPoint = [center[0] - cosDeltaEnd, center[1] + sinDeltaEnd];
+        } else {
+          startPoint = [center[0] - halfOfWidth, center[1] + halfOfHeight - pointPadding];
+          endPoint = [center[0] - halfOfWidth + pointPadding, center[1] + halfOfHeight];
+        }
+
         break;
 
       case 'left':
-        rstart = bbox.width / 2;
-        rend = bbox.width / 2;
-        sinDeltaStart = rstart * SELF_LINK_SIN;
-        cosDeltaStart = rstart * SELF_LINK_COS;
-        sinDeltaEnd = rend * SELF_LINK_SIN;
-        cosDeltaEnd = rend * SELF_LINK_COS;
-        startPoint = [center[0] - cosDeltaStart, center[1] + sinDeltaStart];
-        endPoint = [center[0] - cosDeltaEnd, center[1] - sinDeltaEnd];
+        rstart = halfOfWidth;
+        rend = halfOfWidth;
+
+        if (shapeType === 'circle') {
+          sinDeltaStart = rstart * SELF_LINK_SIN;
+          cosDeltaStart = rstart * SELF_LINK_COS;
+          sinDeltaEnd = rend * SELF_LINK_SIN;
+          cosDeltaEnd = rend * SELF_LINK_COS;
+          startPoint = [center[0] - cosDeltaStart, center[1] + sinDeltaStart];
+          endPoint = [center[0] - cosDeltaEnd, center[1] - sinDeltaEnd];
+        } else {
+          startPoint = [center[0] - halfOfWidth, center[1] - pointPadding];
+          endPoint = [center[0] - halfOfWidth, center[1] + pointPadding];
+        }
+
         break;
 
       case 'top-left':
-        rstart = bbox.width / 2;
-        rend = bbox.height / 2;
-        sinDeltaStart = rstart * SELF_LINK_SIN;
-        cosDeltaStart = rstart * SELF_LINK_COS;
-        sinDeltaEnd = rend * SELF_LINK_SIN;
-        cosDeltaEnd = rend * SELF_LINK_COS;
-        startPoint = [center[0] - cosDeltaStart, center[1] - sinDeltaStart];
-        endPoint = [center[0] - sinDeltaEnd, center[1] - cosDeltaEnd];
+        rstart = halfOfWidth;
+        rend = halfOfHeight;
+
+        if (shapeType === 'circle') {
+          sinDeltaStart = rstart * SELF_LINK_SIN;
+          cosDeltaStart = rstart * SELF_LINK_COS;
+          sinDeltaEnd = rend * SELF_LINK_SIN;
+          cosDeltaEnd = rend * SELF_LINK_COS;
+          startPoint = [center[0] - cosDeltaStart, center[1] - sinDeltaStart];
+          endPoint = [center[0] - sinDeltaEnd, center[1] - cosDeltaEnd];
+        } else {
+          startPoint = [center[0] - halfOfWidth + pointPadding, center[1] - halfOfHeight];
+          endPoint = [center[0] - halfOfWidth, center[1] - halfOfHeight + pointPadding];
+        }
+
         break;
 
       default:
-        rstart = bbox.width / 2;
-        rend = bbox.width / 2;
+        rstart = halfOfWidth;
+        rend = halfOfWidth;
         sinDeltaStart = rstart * SELF_LINK_SIN;
@@ -167,0 +230,0 @@ cosDeltaStart = rstart * SELF_LINK_COS;

es/util/index.d.ts

@@ -100,3 +100,3 @@ import * as MathUtil from './math';
     cloneBesidesImg: (obj: any) => {};
-    getAnimateCfgWithCallback: ({ animateCfg, callback }: {
+    getAnimateCfgWithCallback: ({ animateCfg, callback, }: {
         animateCfg: import("..").GraphAnimateConfig;
@@ -103,0 +103,0 @@ callback: () => void;

lib/element/shapeBase.js

@@ -90,6 +90,3 @@ "use strict";
   getOptions: function getOptions(cfg, updateType) {
-    if (updateType === 'move' || (updateType === null || updateType === void 0 ? void 0 : updateType.includes('bbox'))) {
-      return {};
-    }
-
+    if (updateType === 'move' || (updateType === null || updateType === void 0 ? void 0 : updateType.includes('bbox'))) return cfg;
     return (0, _util.deepMix)({}, this.options, this.getCustomConfig(cfg) || {}, cfg);
@@ -96,0 +93,0 @@ },

lib/global.js

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

lib/index.d.ts

@@ -484,3 +484,3 @@ import AbstractGraph from './graph/graph';
         cloneBesidesImg: (obj: any) => {};
-        getAnimateCfgWithCallback: ({ animateCfg, callback }: {
+        getAnimateCfgWithCallback: ({ animateCfg, callback, }: {
             animateCfg: import("./types").GraphAnimateConfig;
@@ -487,0 +487,0 @@ callback: () => void;

lib/types/index.d.ts

@@ -127,2 +127,3 @@ import { IGroup, Event as GraphEvent, BBox, AnimateCfg, ICanvas, IShape } from '@antv/g-base';
     clockwise: boolean;
+    pointPadding: number;
 }>;
@@ -129,0 +130,0 @@ export interface LayoutConfig {

lib/util/graphic.d.ts

@@ -60,5 +60,5 @@ import { IGroup, BBox } from '@antv/g-base';
 export declare const cloneBesidesImg: (obj: any) => {};
-export declare const getAnimateCfgWithCallback: ({ animateCfg, callback }: {
+export declare const getAnimateCfgWithCallback: ({ animateCfg, callback, }: {
     animateCfg: GraphAnimateConfig;
     callback: () => void;
 }) => GraphAnimateConfig;

lib/util/graphic.js

@@ -90,96 +90,159 @@ "use strict";
   var endPoint = [cfg.endPoint.x, cfg.endPoint.y];
-  var rstart = bbox.height / 2;
-  var rend = bbox.height / 2;
+  var halfOfHeight = bbox.height / 2;
+  var halfOfWidth = bbox.width / 2;
+  var rstart = halfOfHeight;
+  var rend = halfOfHeight;
   var sinDeltaStart = rstart * SELF_LINK_SIN;
   var cosDeltaStart = rstart * SELF_LINK_COS;
   var sinDeltaEnd = rend * SELF_LINK_SIN;
-  var cosDeltaEnd = rend * SELF_LINK_COS; // 如果定义了锚点的，直接用锚点坐标，否则，根据自环的 cfg 计算
+  var cosDeltaEnd = rend * SELF_LINK_COS;
+  var shapeType = keyShape.get('type'); // 美观考虑，pointPadding 默认取宽高中最小的1/4
 
+  var defaultPointPadding = Math.min(halfOfHeight / 2, halfOfWidth / 2);
+  var maxPointPadding = Math.min(halfOfHeight, halfOfWidth); // 对于非圆形节点设置的连接点与节点中心坐标（`top-right`，`bottom-right`,`top-left`,`bottom-left`较特殊，为四个角坐标）在 x 轴或 y 轴方向的偏移量，默认为  `节点宽高中最小值的1/4`
+
+  var pointPadding = (loopCfg === null || loopCfg === void 0 ? void 0 : loopCfg.pointPadding) ? Math.min(maxPointPadding, loopCfg === null || loopCfg === void 0 ? void 0 : loopCfg.pointPadding) : defaultPointPadding; // 如果定义了锚点的，直接用锚点坐标，否则，根据自环的 cfg 计算
+
   if (startPoint[0] === endPoint[0] && startPoint[1] === endPoint[1]) {
     switch (position) {
       case 'top':
-        startPoint = [center[0] - sinDeltaStart, center[1] - cosDeltaStart];
-        endPoint = [center[0] + sinDeltaEnd, center[1] - cosDeltaEnd];
+        if (shapeType === 'circle') {
+          startPoint = [center[0] - sinDeltaStart, center[1] - cosDeltaStart];
+          endPoint = [center[0] + sinDeltaEnd, center[1] - cosDeltaEnd];
+        } else {
+          startPoint = [center[0] - pointPadding, center[1] - halfOfHeight];
+          endPoint = [center[0] + pointPadding, center[1] - halfOfHeight];
+        }
+
         break;
 
       case 'top-right':
-        rstart = bbox.height / 2;
-        rend = bbox.width / 2;
-        sinDeltaStart = rstart * SELF_LINK_SIN;
-        cosDeltaStart = rstart * SELF_LINK_COS;
-        sinDeltaEnd = rend * SELF_LINK_SIN;
-        cosDeltaEnd = rend * SELF_LINK_COS;
-        startPoint = [center[0] + sinDeltaStart, center[1] - cosDeltaStart];
-        endPoint = [center[0] + cosDeltaEnd, center[1] - sinDeltaEnd];
+        rstart = halfOfHeight;
+        rend = halfOfWidth;
+
+        if (shapeType === 'circle') {
+          sinDeltaStart = rstart * SELF_LINK_SIN;
+          cosDeltaStart = rstart * SELF_LINK_COS;
+          sinDeltaEnd = rend * SELF_LINK_SIN;
+          cosDeltaEnd = rend * SELF_LINK_COS;
+          startPoint = [center[0] + sinDeltaStart, center[1] - cosDeltaStart];
+          endPoint = [center[0] + cosDeltaEnd, center[1] - sinDeltaEnd];
+        } else {
+          startPoint = [center[0] + halfOfWidth - pointPadding, center[1] - halfOfHeight];
+          endPoint = [center[0] + halfOfWidth, center[1] - halfOfHeight + pointPadding];
+        }
+
         break;
 
       case 'right':
-        rstart = bbox.width / 2;
-        rend = bbox.width / 2;
-        sinDeltaStart = rstart * SELF_LINK_SIN;
-        cosDeltaStart = rstart * SELF_LINK_COS;
-        sinDeltaEnd = rend * SELF_LINK_SIN;
-        cosDeltaEnd = rend * SELF_LINK_COS;
-        startPoint = [center[0] + cosDeltaStart, center[1] - sinDeltaStart];
-        endPoint = [center[0] + cosDeltaEnd, center[1] + sinDeltaEnd];
+        rstart = halfOfWidth;
+        rend = halfOfWidth;
+
+        if (shapeType === 'circle') {
+          sinDeltaStart = rstart * SELF_LINK_SIN;
+          cosDeltaStart = rstart * SELF_LINK_COS;
+          sinDeltaEnd = rend * SELF_LINK_SIN;
+          cosDeltaEnd = rend * SELF_LINK_COS;
+          startPoint = [center[0] + cosDeltaStart, center[1] - sinDeltaStart];
+          endPoint = [center[0] + cosDeltaEnd, center[1] + sinDeltaEnd];
+        } else {
+          startPoint = [center[0] + halfOfWidth, center[1] - pointPadding];
+          endPoint = [center[0] + halfOfWidth, center[1] + pointPadding];
+        }
+
         break;
 
       case 'bottom-right':
-        rstart = bbox.width / 2;
-        rend = bbox.height / 2;
-        sinDeltaStart = rstart * SELF_LINK_SIN;
-        cosDeltaStart = rstart * SELF_LINK_COS;
-        sinDeltaEnd = rend * SELF_LINK_SIN;
-        cosDeltaEnd = rend * SELF_LINK_COS;
-        startPoint = [center[0] + cosDeltaStart, center[1] + sinDeltaStart];
-        endPoint = [center[0] + sinDeltaEnd, center[1] + cosDeltaEnd];
+        rstart = halfOfWidth;
+        rend = halfOfHeight;
+
+        if (shapeType === 'circle') {
+          sinDeltaStart = rstart * SELF_LINK_SIN;
+          cosDeltaStart = rstart * SELF_LINK_COS;
+          sinDeltaEnd = rend * SELF_LINK_SIN;
+          cosDeltaEnd = rend * SELF_LINK_COS;
+          startPoint = [center[0] + cosDeltaStart, center[1] + sinDeltaStart];
+          endPoint = [center[0] + sinDeltaEnd, center[1] + cosDeltaEnd];
+        } else {
+          startPoint = [center[0] + halfOfWidth, center[1] + halfOfHeight - pointPadding];
+          endPoint = [center[0] + halfOfWidth - pointPadding, center[1] + halfOfHeight];
+        }
+
         break;
 
       case 'bottom':
-        rstart = bbox.height / 2;
-        rend = bbox.height / 2;
-        sinDeltaStart = rstart * SELF_LINK_SIN;
-        cosDeltaStart = rstart * SELF_LINK_COS;
-        sinDeltaEnd = rend * SELF_LINK_SIN;
-        cosDeltaEnd = rend * SELF_LINK_COS;
-        startPoint = [center[0] + sinDeltaStart, center[1] + cosDeltaStart];
-        endPoint = [center[0] - sinDeltaEnd, center[1] + cosDeltaEnd];
+        rstart = halfOfHeight;
+        rend = halfOfHeight;
+
+        if (shapeType === 'circle') {
+          sinDeltaStart = rstart * SELF_LINK_SIN;
+          cosDeltaStart = rstart * SELF_LINK_COS;
+          sinDeltaEnd = rend * SELF_LINK_SIN;
+          cosDeltaEnd = rend * SELF_LINK_COS;
+          startPoint = [center[0] + sinDeltaStart, center[1] + cosDeltaStart];
+          endPoint = [center[0] - sinDeltaEnd, center[1] + cosDeltaEnd];
+        } else {
+          startPoint = [center[0] - pointPadding, center[1] + halfOfHeight];
+          endPoint = [center[0] + pointPadding, center[1] + halfOfHeight];
+        }
+
         break;
 
       case 'bottom-left':
-        rstart = bbox.height / 2;
-        rend = bbox.width / 2;
-        sinDeltaStart = rstart * SELF_LINK_SIN;
-        cosDeltaStart = rstart * SELF_LINK_COS;
-        sinDeltaEnd = rend * SELF_LINK_SIN;
-        cosDeltaEnd = rend * SELF_LINK_COS;
-        startPoint = [center[0] - sinDeltaStart, center[1] + cosDeltaStart];
-        endPoint = [center[0] - cosDeltaEnd, center[1] + sinDeltaEnd];
+        rstart = halfOfHeight;
+        rend = halfOfWidth;
+
+        if (shapeType === 'circle') {
+          sinDeltaStart = rstart * SELF_LINK_SIN;
+          cosDeltaStart = rstart * SELF_LINK_COS;
+          sinDeltaEnd = rend * SELF_LINK_SIN;
+          cosDeltaEnd = rend * SELF_LINK_COS;
+          startPoint = [center[0] - sinDeltaStart, center[1] + cosDeltaStart];
+          endPoint = [center[0] - cosDeltaEnd, center[1] + sinDeltaEnd];
+        } else {
+          startPoint = [center[0] - halfOfWidth, center[1] + halfOfHeight - pointPadding];
+          endPoint = [center[0] - halfOfWidth + pointPadding, center[1] + halfOfHeight];
+        }
+
         break;
 
       case 'left':
-        rstart = bbox.width / 2;
-        rend = bbox.width / 2;
-        sinDeltaStart = rstart * SELF_LINK_SIN;
-        cosDeltaStart = rstart * SELF_LINK_COS;
-        sinDeltaEnd = rend * SELF_LINK_SIN;
-        cosDeltaEnd = rend * SELF_LINK_COS;
-        startPoint = [center[0] - cosDeltaStart, center[1] + sinDeltaStart];
-        endPoint = [center[0] - cosDeltaEnd, center[1] - sinDeltaEnd];
+        rstart = halfOfWidth;
+        rend = halfOfWidth;
+
+        if (shapeType === 'circle') {
+          sinDeltaStart = rstart * SELF_LINK_SIN;
+          cosDeltaStart = rstart * SELF_LINK_COS;
+          sinDeltaEnd = rend * SELF_LINK_SIN;
+          cosDeltaEnd = rend * SELF_LINK_COS;
+          startPoint = [center[0] - cosDeltaStart, center[1] + sinDeltaStart];
+          endPoint = [center[0] - cosDeltaEnd, center[1] - sinDeltaEnd];
+        } else {
+          startPoint = [center[0] - halfOfWidth, center[1] - pointPadding];
+          endPoint = [center[0] - halfOfWidth, center[1] + pointPadding];
+        }
+
         break;
 
       case 'top-left':
-        rstart = bbox.width / 2;
-        rend = bbox.height / 2;
-        sinDeltaStart = rstart * SELF_LINK_SIN;
-        cosDeltaStart = rstart * SELF_LINK_COS;
-        sinDeltaEnd = rend * SELF_LINK_SIN;
-        cosDeltaEnd = rend * SELF_LINK_COS;
-        startPoint = [center[0] - cosDeltaStart, center[1] - sinDeltaStart];
-        endPoint = [center[0] - sinDeltaEnd, center[1] - cosDeltaEnd];
+        rstart = halfOfWidth;
+        rend = halfOfHeight;
+
+        if (shapeType === 'circle') {
+          sinDeltaStart = rstart * SELF_LINK_SIN;
+          cosDeltaStart = rstart * SELF_LINK_COS;
+          sinDeltaEnd = rend * SELF_LINK_SIN;
+          cosDeltaEnd = rend * SELF_LINK_COS;
+          startPoint = [center[0] - cosDeltaStart, center[1] - sinDeltaStart];
+          endPoint = [center[0] - sinDeltaEnd, center[1] - cosDeltaEnd];
+        } else {
+          startPoint = [center[0] - halfOfWidth + pointPadding, center[1] - halfOfHeight];
+          endPoint = [center[0] - halfOfWidth, center[1] - halfOfHeight + pointPadding];
+        }
+
         break;
 
       default:
-        rstart = bbox.width / 2;
-        rend = bbox.width / 2;
+        rstart = halfOfWidth;
+        rend = halfOfWidth;
         sinDeltaStart = rstart * SELF_LINK_SIN;
@@ -186,0 +249,0 @@ cosDeltaStart = rstart * SELF_LINK_COS;

lib/util/index.d.ts

@@ -100,3 +100,3 @@ import * as MathUtil from './math';
     cloneBesidesImg: (obj: any) => {};
-    getAnimateCfgWithCallback: ({ animateCfg, callback }: {
+    getAnimateCfgWithCallback: ({ animateCfg, callback, }: {
         animateCfg: import("..").GraphAnimateConfig;
@@ -103,0 +103,0 @@ callback: () => void;

package.json

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

No alert changes

Improved metrics

Total package byte prevSize

1173146

increased by0.46%

Lines of code

34400

increased by0.27%

No dependency changes