@antv/g6-core - npm Package Compare versions

Comparing version 0.3.11 to 0.4.0-beta.0

es/behavior/behavior.js

 import { clone, each, wrapBehavior } from '@antv/util';
 import behaviorOption from './behaviorOption';
 
-var Behavior = function () {
+var Behavior =
+/** @class */
+function () {
   function Behavior() {}
@@ -6,0 +8,0 @@ /**

es/element/combo.js

@@ -33,3 +33,4 @@ import { __assign } from "tslib";
         fill: Global.comboLabel.style.fill,
-        fontSize: Global.comboLabel.style.fontSize
+        fontSize: Global.comboLabel.style.fontSize,
+        fontFamily: Global.windowFontFamily
       }
@@ -36,0 +37,0 @@ },

es/element/combos/rect.js

@@ -21,3 +21,4 @@ import { __assign } from "tslib";
         fill: Global.comboLabel.style.fill,
-        fontSize: Global.comboLabel.style.fontSize
+        fontSize: Global.comboLabel.style.fontSize,
+        fontFamily: Global.windowFontFamily
       }
@@ -24,0 +25,0 @@ },

es/element/edge.js

@@ -65,3 +65,4 @@ /**
         fill: Global.edgeLabel.style.fill,
-        fontSize: Global.edgeLabel.style.fontSize
+        fontSize: Global.edgeLabel.style.fontSize,
+        fontFamily: Global.windowFontFamily
       }
@@ -121,9 +122,8 @@ },
 
-    var group = item.getContainer();
-    var strokeStyle = {
-      stroke: cfg.color
-    };
-    var shape = ((_a = item.getKeyShape) === null || _a === void 0 ? void 0 : _a.call(item)) || group.find(function (element) {
-      return element.get('className') === 'edge-shape';
-    });
+    var group = item.getContainer(); // const strokeStyle: ShapeStyle = {
+    //   stroke: cfg.color,
+    // };
+
+    var shape = ((_a = item.getKeyShape) === null || _a === void 0 ? void 0 : _a.call(item)) || group['shapeMap']['edge-shape']; // group.find((element) => element.get('className') === 'edge-shape');
+
     var size = cfg.size;
@@ -144,4 +144,10 @@ cfg = this.getPathPoints(cfg);
     points.push(endPoint);
-    var currentAttr = shape.attr();
-    var previousStyle = mix({}, strokeStyle, currentAttr, cfg.style);
+    var currentAttr = shape.attr(); // const previousStyle = mix({}, strokeStyle, currentAttr, cfg.style);
+
+    var previousStyle = cfg.style || {};
+
+    if (previousStyle.stroke === undefined) {
+      previousStyle.stroke = cfg.color;
+    }
+
     var source = cfg.sourceNode;
@@ -182,6 +188,6 @@ var target = cfg.targetNode;
 
-      style = mix(strokeStyle, currentAttr, {
-        lineWidth: size,
-        path: path
-      }, cfg.style);
+      style = __assign({}, cfg.style);
+      if (style.lineWidth === undefined) style.lineWdith = (isNumber(size) ? size : size === null || size === void 0 ? void 0 : size[0]) || currentAttr.lineWidth;
+      if (style.path === undefined) style.path = path;
+      if (style.stroke === undefined) style.stroke = currentAttr.stroke || cfg.color;
     }
@@ -197,5 +203,4 @@
     var style = {};
-    var pathShape = group && group.find(function (element) {
-      return element.get('className') === CLS_SHAPE;
-    }); // 不对 pathShape 进行判空，如果线不存在，说明有问题了
+    var pathShape = group === null || group === void 0 ? void 0 : group['shapeMap'][CLS_SHAPE]; // group?.find((element) => element.get('className') === CLS_SHAPE);
+    // 不对 pathShape 进行判空，如果线不存在，说明有问题了
 
@@ -260,5 +265,4 @@ var pointPercent;
     if (isNil(labelCfg.autoRotate)) autoRotate = this.labelAutoRotate;else autoRotate = labelCfg.autoRotate;
-    var pathShape = group && group.find(function (element) {
-      return element.get('className') === CLS_SHAPE;
-    }); // 不对 pathShape 进行判空，如果线不存在，说明有问题了
+    var pathShape = group === null || group === void 0 ? void 0 : group['shapeMap'][CLS_SHAPE]; // group?.find((element) => element.get('className') === CLS_SHAPE);
+    // 不对 pathShape 进行判空，如果线不存在，说明有问题了
 
@@ -356,2 +360,3 @@ var pointPercent;
     });
+    group['shapeMap'][CLS_SHAPE] = shape;
     return shape;
@@ -361,7 +366,3 @@ },
     var defaultLabelCfg = this.options.labelCfg;
-    var defaultFontFamily;
-    if (typeof window !== 'undefined' && typeof window.getComputedStyle !== 'undefined') defaultFontFamily = window.getComputedStyle(document.body, null).getPropertyValue('font-family') || 'Arial, sans-serif';else defaultFontFamily = 'Arial, sans-serif';
-    var labelCfg = deepMix({
-      fontFamily: defaultFontFamily
-    }, defaultLabelCfg, cfg.labelCfg);
+    var labelCfg = deepMix({}, defaultLabelCfg, cfg.labelCfg);
     var labelStyle = this.getLabelStyle(cfg, labelCfg, group);
@@ -374,2 +375,3 @@ var rotate = labelStyle.rotate;
     });
+    group['shapeMap']['text-shape'] = label;
 
@@ -384,2 +386,3 @@ if (!isNaN(rotate) && rotate !== '') {
       rect.set('classname', labelBgClassname);
+      group['shapeMap'][labelBgClassname] = rect;
       label.toFront();
@@ -399,2 +402,3 @@ }
     });
+    group['shapeMap']['text-bg-shape'] = rect;
     if (!isNaN(rotate)) rect.rotateAtStart(rotate);
@@ -401,0 +405,0 @@ return rect;

es/element/node.js

@@ -32,4 +32,7 @@ import { __assign } from "tslib";
   getSize: function getSize(cfg) {
-    var size = cfg.size || this.getOptions({}).size || Global.defaultNode.size; // size 是数组，但长度为1，则补长度为2
+    var _a;
 
+    var size = ((_a = this.mergeStyle) === null || _a === void 0 ? void 0 : _a.size) || cfg.size || this.getOptions({}).size || Global.defaultNode.size; // Global.defaultNode.size; //  
+    // size 是数组，但长度为1，则补长度为2
+
     if (isArray(size) && size.length === 1) {
@@ -66,4 +69,2 @@ size = [size[0], size[0]];
     var size = this.getSize(cfg);
-    var width = size[0];
-    var height = size[1];
     var style;
@@ -75,3 +76,3 @@
           x: 0,
-          y: 0 - height / 2 - offset,
+          y: -size[1] / 2 - offset,
           textBaseline: 'bottom' // 文本在图形的上面
@@ -85,3 +86,3 @@
           x: 0,
-          y: height / 2 + offset,
+          y: size[1] / 2 + offset,
           textBaseline: 'top'
@@ -93,3 +94,3 @@ };
         style = {
-          x: 0 - width / 2 - offset,
+          x: -size[0] / 2 - offset,
           y: 0,
@@ -102,3 +103,3 @@ textAlign: 'right'
         style = {
-          x: width / 2 + offset,
+          x: size[0] / 2 + offset,
           y: 0,
@@ -114,33 +115,18 @@ textAlign: 'left'
   getLabelBgStyleByPosition: function getLabelBgStyleByPosition(label, cfg, labelCfg, group) {
-    if (!label) {
-      return {};
-    }
+    var _a;
 
+    if (!label) return {};
+    var backgroundStyle = (_a = labelCfg.style) === null || _a === void 0 ? void 0 : _a.background;
+    if (!backgroundStyle) return {};
     var bbox = label.getBBox();
-    var backgroundStyle = labelCfg.style && labelCfg.style.background;
-
-    if (!backgroundStyle) {
-      return {};
-    }
-
     var padding = formatPadding(backgroundStyle.padding);
     var backgroundWidth = bbox.width + padding[1] + padding[3];
     var backgroundHeight = bbox.height + padding[0] + padding[2];
-    var offset = labelCfg.offset;
-
-    if (isNil(offset)) {
-      // 考虑 offset = 0 的场景，不用用 labelCfg.offset || Global.nodeLabel.offset
-      offset = this.offset; // 不居中时的偏移量
-    }
-
-    var style;
-    style = {
+    return __assign(__assign({
       x: bbox.minX - padding[3],
       y: bbox.minY - padding[0]
-    };
-    style = __assign(__assign(__assign({}, style), backgroundStyle), {
+    }, backgroundStyle), {
       width: backgroundWidth,
       height: backgroundHeight
     });
-    return style;
   },
@@ -156,2 +142,3 @@ drawShape: function drawShape(cfg, group) {
     });
+    group['shapeMap']['node-shape'] = shape;
     return shape;
@@ -166,13 +153,13 @@ },
   updateLinkPoints: function updateLinkPoints(cfg, group) {
-    var defaultLinkPoints = this.getOptions(cfg).linkPoints;
-    var markLeft = group.find(function (element) {
+    var defaultLinkPoints = (this.mergeStyle || this.getOptions(cfg)).linkPoints;
+    var markLeft = group['shapeMap']['link-point-left'] || group.find(function (element) {
       return element.get('className') === 'link-point-left';
     });
-    var markRight = group.find(function (element) {
+    var markRight = group['shapeMap']['link-point-right'] || group.find(function (element) {
       return element.get('className') === 'link-point-right';
     });
-    var markTop = group.find(function (element) {
+    var markTop = group['shapeMap']['link-point-top'] || group.find(function (element) {
       return element.get('className') === 'link-point-top';
     });
-    var markBottom = group.find(function (element) {
+    var markBottom = group['shapeMap']['link-point-bottom'] || group.find(function (element) {
       return element.get('className') === 'link-point-bottom';
@@ -230,2 +217,3 @@ });
         markLeft.remove();
+        delete group['shapeMap']['link-point-left'];
       } else {
@@ -238,3 +226,4 @@ markLeft.attr(__assign(__assign({}, styles), {
     } else if (left) {
-      group.addShape('circle', {
+      var name_1 = 'link-point-left';
+      group['shapeMap'][name_1] = group.addShape('circle', {
         attrs: __assign(__assign({}, styles), {
@@ -244,4 +233,4 @@ x: -width / 2,
         }),
-        className: 'link-point-left',
-        name: 'link-point-left',
+        className: name_1,
+        name: name_1,
         isAnchorPoint: true
@@ -254,2 +243,3 @@ });
         markRight.remove();
+        delete group['shapeMap']['link-point-right'];
       }
@@ -262,3 +252,4 @@
     } else if (right) {
-      group.addShape('circle', {
+      var name_2 = 'link-point-right';
+      group['shapeMap'][name_2] = group.addShape('circle', {
         attrs: __assign(__assign({}, styles), {
@@ -268,4 +259,4 @@ x: width / 2,
         }),
-        className: 'link-point-right',
-        name: 'link-point-right',
+        className: name_2,
+        name: name_2,
         isAnchorPoint: true
@@ -278,2 +269,3 @@ });
         markTop.remove();
+        delete group['shapeMap']['link-point-top'];
       }
@@ -286,3 +278,4 @@
     } else if (top) {
-      group.addShape('circle', {
+      var name_3 = 'link-point-top';
+      group['shapeMap'][name_3] = group.addShape('circle', {
         attrs: __assign(__assign({}, styles), {
@@ -292,4 +285,4 @@ x: 0,
         }),
-        className: 'link-point-top',
-        name: 'link-point-top',
+        className: name_3,
+        name: name_3,
         isAnchorPoint: true
@@ -302,2 +295,3 @@ });
         markBottom.remove();
+        delete group['shapeMap']['link-point-bottom'];
       } else {
@@ -310,3 +304,4 @@ markBottom.attr(__assign(__assign({}, styles), {
     } else if (bottom) {
-      group.addShape('circle', {
+      var name_4 = 'link-point-bottom';
+      group['shapeMap'][name_4] = group.addShape('circle', {
         attrs: __assign(__assign({}, styles), {
@@ -316,4 +311,4 @@ x: 0,
         }),
-        className: 'link-point-bottom',
-        name: 'link-point-bottom',
+        className: name_4,
+        name: name_4,
         isAnchorPoint: true
@@ -323,7 +318,10 @@ });
   },
-  updateShape: function updateShape(cfg, item, keyShapeStyle, hasIcon) {
+  updateShape: function updateShape(cfg, item, keyShapeStyle, hasIcon, updateType) {
     var keyShape = item.get('keyShape');
     keyShape.attr(__assign({}, keyShapeStyle));
-    this.updateLabel(cfg, item); // special for some types of nodes
 
+    if (!undefined || (updateType === null || updateType === void 0 ? void 0 : updateType.includes('label'))) {
+      this.updateLabel(cfg, item, updateType);
+    }
+
     if (hasIcon) {
@@ -337,8 +335,8 @@ this.updateIcon(cfg, item);
     var group = item.getContainer();
-    var icon = this.getOptions(cfg).icon;
+    var icon = (this.mergeStyle || this.getOptions(cfg)).icon;
     var show = (cfg.icon ? cfg.icon : {
       show: undefined
     }).show;
-    var iconShape = group.find(function (element) {
-      return element.get('className') === _this.type + "-icon";
+    var iconShape = group['shapeMap'][this.type + "-icon"] || group.find(function (ele) {
+      return ele.get('name') === _this.type + "-icon";
     });
@@ -367,3 +365,4 @@
           h = icon.height;
-      group.addShape('image', {
+      var name_5 = this.type + "-icon";
+      group['shapeMap'][name_5] = group.addShape('image', {
         attrs: __assign(__assign({}, icon), {
@@ -373,8 +372,8 @@ x: -w / 2,
         }),
-        className: this.type + "-icon",
-        name: this.type + "-icon"
+        className: name_5,
+        name: name_5
       }); // to ensure the label is on the top of all the shapes
 
-      var labelShape = group.find(function (element) {
-        return element.get('className') === "node-label";
+      var labelShape = group['shapeMap']['node-label'] || group.find(function (ele) {
+        return ele.get('name') === 'node-label';
       });
@@ -381,0 +380,0 @@

es/element/nodes/image.js

 import { __assign } from "tslib";
 import Shape from '../shape';
+import Global from '../../global';
 /**
@@ -11,2 +12,7 @@ * 基本的图片，可以添加文本，默认文本在图片的下面
     size: 200,
+    labelCfg: {
+      style: {
+        fontFamily: Global.windowFontFamily
+      }
+    },
     clipCfg: {
@@ -39,4 +45,3 @@ show: false,
   drawShape: function drawShape(cfg, group) {
-    var shapeType = this.shapeType; // || this.type，都已经加了 shapeType
-
+    var shapeType = this.shapeType;
     var style = this.getShapeStyle(cfg);
@@ -54,3 +59,3 @@ delete style.fill;
   drawClip: function drawClip(cfg, shape) {
-    var clip = this.getOptions(cfg).clipCfg;
+    var clip = (this.mergeStyle || this.getOptions(cfg)).clipCfg;
 
@@ -122,5 +127,7 @@ if (!clip.show) {
   getShapeStyle: function getShapeStyle(cfg) {
-    var defaultStyle = this.getOptions(cfg).style;
+    var _a = this.mergeStyle || this.getOptions(cfg),
+        defaultStyle = _a.style,
+        img = _a.img;
+
     var size = this.getSize(cfg);
-    var img = this.getOptions(cfg).img;
     var width = size[0];
@@ -147,3 +154,3 @@ var height = size[1];
     var shapeClassName = this.itemType + "-shape";
-    var shape = group.find(function (element) {
+    var shape = group['shapeMap'][shapeClassName] || group.find(function (element) {
       return element.get('className') === shapeClassName;
@@ -153,3 +160,3 @@ }) || item.getKeyShape();
 
-    if (shape) {
+    if (shape && !shape.destroyed) {
       shape.attr(shapeStyle);
@@ -156,0 +163,0 @@ }

es/element/nodes/simple-circle.js

@@ -20,3 +20,4 @@ import { __assign } from "tslib";
         fill: Global.nodeLabel.style.fill,
-        fontSize: Global.nodeLabel.style.fontSize
+        fontSize: Global.nodeLabel.style.fontSize,
+        fontFamily: Global.windowFontFamily
       }
@@ -29,9 +30,13 @@ },
   labelPosition: 'center',
+  shapeMap: {},
   drawShape: function drawShape(cfg, group) {
     var style = this.getShapeStyle(cfg);
+    var name = this.type + "-keyShape";
     var keyShape = group.addShape('circle', {
       attrs: style,
       className: this.type + "-keyShape",
+      name: name,
       draggable: true
     });
+    group['shapeMap'][name] = keyShape;
     return keyShape;
@@ -46,3 +51,3 @@ },
   getShapeStyle: function getShapeStyle(cfg) {
-    var defaultStyle = this.getOptions(cfg).style;
+    var defaultStyle = (this.mergeStyle || this.getOptions(cfg)).style;
     var strokeStyle = {
@@ -64,3 +69,3 @@ stroke: cfg.color
   },
-  update: function update(cfg, item) {
+  update: function update(cfg, item, updateType) {
     var size = this.getSize(cfg); // 下面这些属性需要覆盖默认样式与目前样式，但若在 cfg 中有指定则应该被 cfg 的相应配置覆盖。
@@ -75,4 +80,4 @@
     var style = deepMix({}, keyShape.attr(), strokeStyle, cfg.style);
-    this.updateShape(cfg, item, style, true);
+    this.updateShape(cfg, item, style, true, updateType);
   }
 }, 'single-node');

es/element/nodes/simple-rect.js

@@ -19,3 +19,4 @@ import { __assign } from "tslib";
         fill: Global.nodeLabel.style.fill,
-        fontSize: Global.nodeLabel.style.fontSize
+        fontSize: Global.nodeLabel.style.fontSize,
+        fontFamily: Global.windowFontFamily
       }
@@ -47,3 +48,3 @@ },
   getShapeStyle: function getShapeStyle(cfg) {
-    var defaultStyle = this.getOptions(cfg).style;
+    var defaultStyle = (this.mergeStyle || this.getOptions(cfg)).style;
     var strokeStyle = {
@@ -67,6 +68,6 @@ stroke: cfg.color
   },
-  update: function update(cfg, item) {
+  update: function update(cfg, item, updateType) {
     var group = item.getContainer(); // 这里不传 cfg 参数是因为 cfg.style 需要最后覆盖样式
 
-    var defaultStyle = this.getOptions({}).style;
+    var defaultStyle = (this.mergeStyle || this.getOptions(cfg)).style;
     var size = this.getSize(cfg);
@@ -91,4 +92,4 @@ var keyShape = item.get('keyShape');
     style = mix(style, cfg.style);
-    this.updateShape(cfg, item, style, false);
+    this.updateShape(cfg, item, style, false, updateType);
   }
 }, 'single-node');

es/element/shape.js

@@ -53,2 +53,3 @@ import { __assign } from "tslib";
     var shape = this.getShape(type);
+    group['shapeMap'] = {};
     var rst = shape.draw(cfg, group);
@@ -70,7 +71,10 @@
   baseUpdate: function baseUpdate(type, cfg, item, updateType) {
-    var shape = this.getShape(type);
+    var _a, _b;
 
+    var shape = this.getShape(type); // 防止没定义 update 函数
+
     if (shape.update) {
-      // 防止没定义 update 函数
-      shape.update(cfg, item, updateType);
+      // shape.mergeStyle = updateType === 'move' || updateType === 'bbox' ? {} : shape.getOptions?.(cfg);
+      shape.mergeStyle = (_a = shape.getOptions) === null || _a === void 0 ? void 0 : _a.call(shape, cfg, updateType);
+      (_b = shape.update) === null || _b === void 0 ? void 0 : _b.call(shape, cfg, item, updateType);
     }
@@ -179,3 +183,5 @@
 
-var Shape = function () {
+var Shape =
+/** @class */
+function () {
   function Shape() {}
@@ -182,0 +188,0 @@

es/element/shapeBase.js

@@ -53,3 +53,14 @@ function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
   // 默认样式及配置
-  options: {},
+  options: {
+    labelCfg: {
+      style: {
+        fontFamily: Global.windowFontFamily
+      }
+    },
+    descriptionCfg: {
+      style: {
+        fontFamily: Global.windowFontFamily
+      }
+    }
+  },
   itemType: '',
@@ -65,19 +76,7 @@
   getOptions: function getOptions(cfg, updateType) {
-    if (updateType === 'move' || updateType === 'bbox') {
+    if (updateType === 'move' || (updateType === null || updateType === void 0 ? void 0 : updateType.includes('bbox'))) {
       return {};
     }
 
-    return deepMix({
-      // 解决局部渲染导致的文字移动残影问题
-      labelCfg: {
-        style: {
-          fontFamily: typeof window !== 'undefined' && window.getComputedStyle ? window.getComputedStyle(document.body, null).getPropertyValue('font-family') || 'Arial, sans-serif' : 'Arial, sans-serif'
-        }
-      },
-      descriptionCfg: {
-        style: {
-          fontFamily: typeof window !== 'undefined' && window.getComputedStyle ? window.getComputedStyle(document.body, null).getPropertyValue('font-family') || 'Arial, sans-serif' : 'Arial, sans-serif'
-        }
-      }
-    }, this.options, this.getCustomConfig(cfg) || {}, cfg);
+    return deepMix({}, this.options, this.getCustomConfig(cfg) || {}, cfg);
   },
@@ -93,4 +92,7 @@
   draw: function draw(cfg, group) {
+    group['shapeMap'] = {};
+    this.mergeStyle = this.getOptions(cfg);
     var shape = this.drawShape(cfg, group);
     shape.set('className', this.itemType + CLS_SHAPE_SUFFIX);
+    group['shapeMap'][this.itemType + CLS_SHAPE_SUFFIX] = shape;
 
@@ -100,2 +102,3 @@ if (cfg.label) {
       label.set('className', this.itemType + CLS_LABEL_SUFFIX);
+      group['shapeMap'][this.itemType + CLS_LABEL_SUFFIX] = label;
     }
@@ -117,3 +120,3 @@
   drawLabel: function drawLabel(cfg, group) {
-    var defaultLabelCfg = this.getOptions(cfg).labelCfg; // image的情况下有可能为null
+    var defaultLabelCfg = (this.mergeStyle || this.getOptions(cfg) || {}).labelCfg; // image的情况下有可能为null
 
@@ -130,2 +133,3 @@ var labelCfg = defaultLabelCfg || {};
     });
+    group['shapeMap']['text-shape'] = label;
 
@@ -165,2 +169,3 @@ if (!isNaN(rotate) && rotate !== '') {
       rect.set('classname', labelBgClassname);
+      group['shapeMap'][labelBgClassname] = rect;
       label.toFront();
@@ -179,2 +184,3 @@ }
     });
+    group['shapeMap']['text-bg-shape'] = rect;
     return rect;
@@ -202,6 +208,3 @@ },
     var defaultStyle = Global[attrName] ? Global[attrName].style : null;
-
-    var labelStyle = __assign(__assign(__assign({}, defaultStyle), calculateStyle), labelCfg.style);
-
-    return labelStyle;
+    return __assign(__assign(__assign({}, defaultStyle), calculateStyle), labelCfg.style);
   },
@@ -228,2 +231,4 @@
   updateShapeStyle: function updateShapeStyle(cfg, item, updateType) {
+    var _a;
+
     var group = item.getContainer();
@@ -234,3 +239,3 @@ var shape = item.getKeyShape();
     var _loop_1 = function _loop_1(key) {
-      var _a;
+      var _b;
 
@@ -241,11 +246,8 @@ var style = shapeStyle[key];
         // 更新图元素样式，支持更新子元素
-        var subShape = group.find(function (element) {
+        var subShape = ((_a = group['shapeMap']) === null || _a === void 0 ? void 0 : _a[key]) || group.find(function (element) {
           return element.get('name') === key;
         });
-
-        if (subShape) {
-          subShape.attr(style);
-        }
+        subShape === null || subShape === void 0 ? void 0 : subShape.attr(style);
       } else {
-        shape.attr((_a = {}, _a[key] = style, _a));
+        shape.attr((_b = {}, _b[key] = style, _b));
       }
@@ -259,37 +261,37 @@ };
   updateLabel: function updateLabel(cfg, item, updateType) {
-    var group = item.getContainer();
-    var defaultLabelCfg = this.getOptions({}, updateType).labelCfg;
-    var labelClassName = this.itemType + CLS_LABEL_SUFFIX;
-    var label = group.find(function (element) {
-      return element.get('className') === labelClassName;
-    });
-    var labelBgClassname = this.itemType + CLS_LABEL_BG_SUFFIX;
-    var labelBg = group.find(function (element) {
-      return element.get('classname') === labelBgClassname;
-    }); // 防止 cfg.label = "" 的情况
+    var _a, _b; // 防止 cfg.label = "" 的情况
 
+
     if (cfg.label || cfg.label === '') {
-      // 若传入的新配置中有 label，（用户没传入但原先有 label，label 也会有值）
+      var group = item.getContainer();
+      var _c = (this.mergeStyle || this.getOptions({}, updateType) || {}).labelCfg,
+          labelCfg = _c === void 0 ? {} : _c;
+      var labelClassName_1 = this.itemType + CLS_LABEL_SUFFIX;
+      var label = group['shapeMap'][labelClassName_1] || group.find(function (ele) {
+        return ele.get('className') === labelClassName_1;
+      });
+      var labelBgClassname_1 = this.itemType + CLS_LABEL_BG_SUFFIX;
+      var labelBg = group['shapeMap'][labelBgClassname_1] || group.find(function (ele) {
+        return ele.get('className') === labelBgClassname_1;
+      }); // 若传入的新配置中有 label，（用户没传入但原先有 label，label 也会有值）
+
       if (!label) {
         // 若原先不存在 label，则绘制一个新的 label
         var newLabel = this.drawLabel(cfg, group);
-        newLabel.set('className', labelClassName);
+        newLabel.set('className', labelClassName_1);
+        group['shapeMap'][labelClassName_1] = newLabel;
       } else {
         // 若原先存在 label，则更新样式。与 getLabelStyle 不同在于这里需要融合当前 label 的样式
-        // 用于融合 style 以外的属性：position, offset, ...
-        var currentLabelCfg = {};
+        // 融合 style 以外的属性：position, offset, ...
+        if (!updateType || updateType === 'bbox|label' || this.itemType === 'edge' && updateType !== 'style') {
+          labelCfg = deepMix(labelCfg, cfg.labelCfg);
+        } // 获取位置信息
 
-        if (item.getModel) {
-          currentLabelCfg = item.getModel().labelCfg;
-        } // 这里不能去掉
 
-
-        var labelCfg = deepMix({}, defaultLabelCfg, currentLabelCfg, cfg.labelCfg); // 获取位置信息
-
         var calculateStyle = this.getLabelStyleByPosition(cfg, labelCfg, group); // 取 nodeLabel，edgeLabel 的配置项
 
-        var cfgStyle = cfg.labelCfg ? cfg.labelCfg.style : undefined;
-        var cfgBgStyle = labelCfg.style && labelCfg.style.background; // 需要融合当前 label 的样式 label.attr()。不再需要全局/默认样式，因为已经应用在当前的 label 上
+        var cfgStyle = (_a = cfg.labelCfg) === null || _a === void 0 ? void 0 : _a.style; // const cfgBgStyle = labelCfg.style?.background;
+        // 需要融合当前 label 的样式 label.attr()。不再需要全局/默认样式，因为已经应用在当前的 label 上
 
-        var labelStyle = __assign(__assign(__assign({}, label.attr()), calculateStyle), cfgStyle);
+        var labelStyle = __assign(__assign({}, calculateStyle), cfgStyle);
 
@@ -303,8 +305,9 @@ var rotate = labelStyle.rotate;
           rotateMatrix = transform(rotateMatrix, [['t', -labelStyle.x, -labelStyle.y], ['r', rotate], ['t', labelStyle.x, labelStyle.y]]);
-          label.resetMatrix();
-          label.attr(__assign(__assign({}, labelStyle), {
-            matrix: rotateMatrix
-          }));
+          labelStyle.matrix = rotateMatrix;
+          label.attr(labelStyle);
         } else {
-          label.resetMatrix();
+          if (((_b = label.getMatrix()) === null || _b === void 0 ? void 0 : _b[4]) !== 1) {
+            label.resetMatrix();
+          }
+
           label.attr(labelStyle);
@@ -316,3 +319,4 @@ }
             labelBg = this.drawLabelBg(cfg, group, label);
-            labelBg.set('classname', labelBgClassname);
+            labelBg.set('classname', labelBgClassname_1);
+            group['shapeMap'][labelBgClassname_1] = labelBg;
             label.toFront();
@@ -322,7 +326,4 @@ }
           var calculateBgStyle = this.getLabelBgStyleByPosition(label, cfg, labelCfg, group);
+          var labelBgStyle = calculateBgStyle;
 
-          var labelBgStyle = __assign(__assign({}, calculateBgStyle), cfgBgStyle);
-
-          labelBg.resetMatrix();
-
           if (!isNaN(rotate) && rotate !== '') {
@@ -332,2 +333,4 @@ var bgRotateMatrix = [1, 0, 0, 0, 1, 0, 0, 0, 1];
             labelBgStyle.matrix = bgRotateMatrix;
+          } else {
+            labelBg.resetMatrix();
           }
@@ -356,2 +359,4 @@
 
+    var _c;
+
     var shape = item.get('keyShape');
@@ -389,3 +394,3 @@ if (!shape || shape.destroyed) return;
       var _loop_2 = function _loop_2(key) {
-        var _c;
+        var _d;
 
@@ -395,12 +400,9 @@ var style = styles[key];
         if (isPlainObject(style) && !ARROWS.includes(key)) {
-          var subShape = group.find(function (element) {
+          var subShape = ((_c = group['shapeMap']) === null || _c === void 0 ? void 0 : _c[key]) || group.find(function (element) {
             return element.get('name') === key;
           });
-
-          if (subShape) {
-            subShape.attr(style);
-          }
+          subShape === null || subShape === void 0 ? void 0 : subShape.attr(style);
         } else {
           // 非纯对象，则认为是设置到 keyShape 上面的
-          shape.attr((_c = {}, _c[key] = style, _c));
+          shape.attr((_d = {}, _d[key] = style, _d));
         }
@@ -441,4 +443,4 @@ }; // style 为要设置的状态的样式
         if (isPlainObject(style) && !ARROWS.includes(p)) {
-          var subShape_1 = group.find(function (element) {
-            return element.get('name') === p;
+          var subShape_1 = group['shapeMap'][p] || group.find(function (ele) {
+            return ele.get('name') === p;
           });
@@ -506,3 +508,3 @@
       var _loop_4 = function _loop_4(originKey) {
-        var _d, _e;
+        var _e, _f;
 
@@ -512,4 +514,4 @@ var style = originstyles[originKey];
         if (isPlainObject(style) && !ARROWS.includes(originKey)) {
-          var subShape = group.find(function (element) {
-            return element.get('name') === originKey;
+          var subShape = group['shapeMap'][originKey] || group.find(function (ele) {
+            return ele.get('name') === originKey;
           });
@@ -542,6 +544,6 @@
             if (!keyShapeName_1) {
-              shape.attr((_d = {}, _d[originKey] = value_4, _d));
+              shape.attr((_e = {}, _e[originKey] = value_4, _e));
             }
           } else {
-            shape.attr((_e = {}, _e[originKey] = value_4, _e));
+            shape.attr((_f = {}, _f[originKey] = value_4, _f));
           }
@@ -548,0 +550,0 @@ }

es/global.d.ts

@@ -183,3 +183,4 @@ declare const _default: {
     };
+    windowFontFamily: string;
 };
 export default _default;

es/global.js

@@ -50,3 +50,3 @@ var subjectColor = 'rgb(95, 149, 255)';
 export default {
-  version: '0.3.11',
+  version: '0.4.0-beta.0',
   rootContainerClassName: 'root-container',
@@ -237,3 +237,4 @@ nodeContainerClassName: 'node-container',
     lineDash: [5, 5]
-  }
+  },
+  windowFontFamily: typeof window !== 'undefined' && window.getComputedStyle ? window.getComputedStyle(document.body, null).getPropertyValue('font-family') || 'Arial, sans-serif' : 'Arial, sans-serif'
 };

es/graph/controller/event.js

@@ -1,2 +0,4 @@
-var EventController = function () {
+var EventController =
+/** @class */
+function () {
   function EventController(graph) {
@@ -3,0 +5,0 @@ this.graph = graph;

es/graph/controller/item.js

@@ -15,3 +15,5 @@ import { __assign } from "tslib";
 
-var ItemController = function () {
+var ItemController =
+/** @class */
+function () {
   function ItemController(graph) {
@@ -283,3 +285,3 @@ var _this = this;
       var edges_1 = item.getEdges();
-      var refreshEdge = updateType === 'bbox' || updateType === 'move';
+      var refreshEdge = (updateType === null || updateType === void 0 ? void 0 : updateType.includes('bbox')) || updateType === 'move';
 
@@ -298,3 +300,3 @@ if (type === NODE) {
           each(edges_1, function (edge) {
-            edge.refresh();
+            edge.refresh(updateType);
           });
@@ -584,3 +586,4 @@ }
 
-    if (item.hasState(stateName) === value && value || isString(value) && item.hasState(stateName)) {
+    if (item.hasState(stateName) === value && value || // 当该状态已经存在且现在需要设置为 true 时，不需要继续。当该状态不存在，且设置为 false 时，需要继续
+    isString(value) && item.hasState(stateName)) {
       // 当该状态 value 是字符串，且已经存在该状态，不需要继续
@@ -587,0 +590,0 @@ return;

es/graph/controller/layout.js

@@ -5,3 +5,5 @@ import { __assign, __rest } from "tslib";
 
-var LayoutController = function () {
+var LayoutController =
+/** @class */
+function () {
   function LayoutController(graph) {
@@ -8,0 +10,0 @@ this.graph = graph;

es/graph/controller/mode.js

 import { each, isArray, isString } from '@antv/util';
 import Behavior from '../../behavior/behavior';
 
-var ModeController = function () {
+var ModeController =
+/** @class */
+function () {
   function ModeController(graph) {
@@ -6,0 +8,0 @@ this.graph = graph;

es/graph/controller/view.d.ts

 import { Point } from '@antv/g-base';
-import { Item, GraphAnimateConfig } from '../../types';
+import { Item, GraphAnimateConfig, FitViewRules } from '../../types';
 import { IAbstractGraph } from '../../interface/graph';
@@ -11,2 +11,3 @@ export default class ViewController {
     fitView(): void;
+    fitViewByRules(rules: FitViewRules): void;
     getFormatPadding(): number[];
@@ -13,0 +14,0 @@ focusPoint(point: Point, animate?: boolean, animateCfg?: GraphAnimateConfig): void;

es/graph/controller/view.js

@@ -6,3 +6,5 @@ import { __assign } from "tslib";
 
-var ViewController = function () {
+var ViewController =
+/** @class */
+function () {
   function ViewController(graph) {
@@ -67,2 +69,54 @@ this.destroyed = false;
     }
+  }; // fit view graph by rule
+
+
+  ViewController.prototype.fitViewByRules = function (rules) {
+    var _a = rules.onlyOutOfViewPort,
+        onlyOutOfViewPort = _a === void 0 ? false : _a,
+        _b = rules.direction,
+        direction = _b === void 0 ? 'both' : _b,
+        _c = rules.ratioRule,
+        ratioRule = _c === void 0 ? 'min' : _c;
+    var graph = this.graph;
+    var padding = this.getFormatPadding();
+    var width = graph.get('width');
+    var height = graph.get('height');
+    var group = graph.get('group');
+    group.resetMatrix();
+    var bbox = group.getCanvasBBox();
+    if (bbox.width === 0 || bbox.height === 0) return;
+    var viewCenter = this.getViewCenter();
+    var groupCenter = {
+      x: bbox.x + bbox.width / 2,
+      y: bbox.y + bbox.height / 2
+    };
+    graph.translate(viewCenter.x - groupCenter.x, viewCenter.y - groupCenter.y);
+    var wRatio = (width - padding[1] - padding[3]) / bbox.width;
+    var hRatio = (height - padding[0] - padding[2]) / bbox.height;
+    var ratio;
+
+    if (direction === 'x') {
+      ratio = wRatio;
+    } else if (direction === 'y') {
+      ratio = hRatio;
+    } else {
+      // ratioRule
+      ratio = ratioRule === 'max' ? Math.max(wRatio, hRatio) : Math.min(wRatio, hRatio);
+    } // 如果设置了仅对超出视口宽高的场景进行fitview，则没超出的场景zoom取1
+
+
+    if (onlyOutOfViewPort) {
+      ratio = ratio < 1 ? ratio : 1;
+    }
+
+    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');
+    }
+
+    graph.zoomTo(endZoom, viewCenter);
   };
@@ -69,0 +123,0 @@

es/graph/graph.d.ts

@@ -6,3 +6,3 @@ import EventEmitter from '@antv/event-emitter';
 import { IEdge, INode, ICombo } from '../interface/item';
-import { GraphAnimateConfig, GraphOptions, EdgeConfig, GraphData, Item, ITEM_TYPE, ModelConfig, NodeConfig, NodeMap, Padding, TreeGraphData, ComboConfig, ModeOption, ModeType, States, HullCfg, IG6GraphEvent, IPoint } from '../types';
+import { GraphAnimateConfig, GraphOptions, EdgeConfig, GraphData, Item, ITEM_TYPE, ModelConfig, NodeConfig, NodeMap, Padding, TreeGraphData, ComboConfig, ModeOption, ModeType, States, HullCfg, IG6GraphEvent, IPoint, FitViewRules } from '../types';
 import Hull from '../item/hull';
@@ -174,4 +174,5 @@ export interface PrivateGraphOption extends GraphOptions {
      * @param {object} padding 四周围边距
+     * @param {FitViewRules} rules fitView的规则
      */
-    fitView(padding?: Padding): void;
+    fitView(padding?: Padding, rules?: FitViewRules): void;
     /**
@@ -178,0 +179,0 @@ * 调整视口适应视图，不缩放，仅将图 bbox 中心对齐到画布中心

es/index.d.ts

@@ -1,2 +0,1 @@
-/// <reference types="_gl-matrix@3.3.0@gl-matrix" />
 import AbstractGraph from './graph/graph';
@@ -197,2 +196,3 @@ import Shape, { Arrow, Marker } from './element';
     };
+    windowFontFamily: string;
 };
@@ -386,2 +386,3 @@ export * from './types';
         };
+        windowFontFamily: string;
     };
@@ -427,3 +428,3 @@ Util: {
         }[];
-        getSpline: (points: import("./types").IPoint[]) => any[][];
+        getSpline: (points: import("./types").IPoint[]) => import("@antv/path-util/lib/types").PathCommand[];
         getControlPoint: (startPoint: import("./types").IPoint, endPoint: import("./types").IPoint, percent?: number, offset?: number) => import("./types").IPoint;
@@ -449,3 +450,4 @@ pointsToPolygon: (points: import("./types").IPoint[] | (string | {
             fontStyle: "normal" | "italic" | "oblique";
-            fontWeight?: number | "normal" | "bold" | "bolder" | "lighter";
+            fontFamily: string;
+            fontWeight: number | "bold" | "normal" | "bolder" | "lighter";
             fill: string;
@@ -461,2 +463,3 @@ rotateCenter: string;
             offset: number;
+            fillOpacity: number;
             background?: {
@@ -463,0 +466,0 @@ fill?: string;

es/interface/behavior.js

 import { __extends } from "tslib";
 import { Event as GraphEvent } from '@antv/g-base';
 
-var G6GraphEvent = function (_super) {
+var G6GraphEvent =
+/** @class */
+function (_super) {
   __extends(G6GraphEvent, _super);
@@ -6,0 +8,0 @@

es/interface/graph.d.ts

 import EventEmitter from '@antv/event-emitter';
 import { IGroup, Point } from '@antv/g-base';
 import Graph from '../graph/graph';
-import { EdgeConfig, GraphData, Item, ITEM_TYPE, ModelConfig, NodeConfig, Padding, TreeGraphData, LayoutConfig, GraphOptions, ModeOption, ModeType, ComboConfig, GraphAnimateConfig, StackData, HullCfg, IG6GraphEvent, IPoint } from '../types';
+import { EdgeConfig, GraphData, Item, ITEM_TYPE, ModelConfig, NodeConfig, Padding, TreeGraphData, LayoutConfig, GraphOptions, ModeOption, ModeType, ComboConfig, GraphAnimateConfig, StackData, HullCfg, IG6GraphEvent, IPoint, FitViewRules } from '../types';
 import { IEdge, INode, ICombo } from './item';
@@ -133,4 +133,5 @@ import Hull from '../item/hull';
      * @param {Padding} padding 四周围边距
+     * @param {FitViewRules} rules fitView的规则
      */
-    fitView: (padding?: Padding) => void;
+    fitView: (padding?: Padding, rules?: FitViewRules) => void;
     /**
@@ -137,0 +138,0 @@ * 调整视口适应视图，不缩放，仅将图 bbox 中心对齐到画布中心

es/interface/shape.d.ts

 import { IGroup, IShape } from '@antv/g-base';
-import { IPoint, Item, LabelStyle, ModelConfig } from '../types';
+import { IPoint, Item, LabelStyle, ModelConfig, UpdateType } from '../types';
 export declare type ILabelConfig = Partial<{
@@ -54,3 +54,3 @@ position: string;
     getAnchorPoints: (cfg?: ModelConfig) => number[][] | undefined;
-    update: (cfg: ModelConfig, item: Item) => void;
+    update: (cfg: ModelConfig, item: Item, updateType?: UpdateType) => void;
     getSize: (cfg: ModelConfig) => number[];
@@ -57,0 +57,0 @@ _getTextAlign: (labelPosition: string, angle: number) => string;

es/item/combo.js

@@ -11,3 +11,5 @@ import { __assign, __extends } from "tslib";
 
-var Combo = function (_super) {
+var Combo =
+/** @class */
+function (_super) {
   __extends(Combo, _super);
@@ -284,2 +286,3 @@
 
+      group['shapeMap'] = {};
       this.clearCache();
@@ -286,0 +289,0 @@ this.set(CACHE_SIZE, null);

es/item/edge.js

@@ -14,3 +14,5 @@ import { __extends } from "tslib";
 
-var Edge = function (_super) {
+var Edge =
+/** @class */
+function (_super) {
   __extends(Edge, _super);
@@ -168,3 +170,3 @@
 
-    var cfg = updateType === 'move' ? model : _super.prototype.getShapeCfg.call(this, model);
+    var cfg = (updateType === null || updateType === void 0 ? void 0 : updateType.includes('move')) ? model : _super.prototype.getShapeCfg.call(this, model);
 
@@ -171,0 +173,0 @@ if (linkCenter) {

es/item/hull.js

@@ -15,3 +15,5 @@ import { __assign } from "tslib";
 
-var Hull = function () {
+var Hull =
+/** @class */
+function () {
   function Hull(graph, cfg) {
@@ -118,3 +120,4 @@ this.cfg = deepMix(this.getDefaultCfg(), cfg);
       id: this.id,
-      name: this.cfg.id
+      name: this.cfg.id,
+      capture: false
     });
@@ -121,0 +124,0 @@ this.group.toBack();

es/item/item.js

@@ -11,3 +11,5 @@ import { __assign } from "tslib";
 
-var ItemBase = function () {
+var ItemBase =
+/** @class */
+function () {
   function ItemBase(cfg) {
@@ -197,17 +199,18 @@ this._cfg = {};
       // 第一次 set originStyle，直接拿首次渲染所有图形的 attrs
-      var originStyles_1 = {};
-      each(children, function (child) {
+      var originStyles = {};
+
+      for (var i = 0; i < children.length; i++) {
+        var child = children[i];
         var shapeType = child.get('type');
-        var name = child.get('name');
+        var name_1 = child.get('name');
 
-        if (name && name !== keyShapeName) {
-          originStyles_1[name] = shapeType !== 'image' ? clone(child.attr()) : self.getShapeStyleByName(name); // The text's position and matrix is not allowed to be affected by states
+        if (name_1 && name_1 !== keyShapeName) {
+          originStyles[name_1] = shapeType !== 'image' ? clone(child.attr()) : self.getShapeStyleByName(name_1); // The text's position and matrix is not allowed to be affected by states
 
-          if (originStyles_1[name] && shapeType === 'text') {
-            delete originStyles_1[name].x;
-            delete originStyles_1[name].y;
-            delete originStyles_1[name].matrix;
+          if (shapeType === 'text' && originStyles[name_1]) {
+            delete originStyles[name_1].x;
+            delete originStyles[name_1].y;
+            delete originStyles[name_1].matrix;
           }
         } else {
-          // !name || name === keyShape
           var keyShapeStyle = self.getShapeStyleByName(); // 可优化，需要去除 child.attr 中其他 shape 名的对象
@@ -219,33 +222,36 @@
           if (!keyShapeName) {
-            Object.assign(originStyles_1, keyShapeStyle);
+            Object.assign(originStyles, keyShapeStyle);
           } else {
             // 若 keyShape 有 name 且 !name，这个图形不是 keyShape，给这个图形一个 name
-            if (!name) {
+            if (!name_1) {
               var shapeName = uniqueId('shape');
               child.set('name', shapeName);
-              originStyles_1[shapeName] = shapeType !== 'image' ? clone(child.attr()) : self.getShapeStyleByName(name);
+              group['shapeMap'][shapeName] = child;
+              originStyles[shapeName] = shapeType !== 'image' ? clone(child.attr()) : self.getShapeStyleByName(name_1);
             } else {
-              originStyles_1[keyShapeName] = keyShapeStyle;
+              originStyles[keyShapeName] = keyShapeStyle;
             }
           }
         }
-      });
-      self.set('originStyle', originStyles_1);
+      }
+
+      self.set('originStyle', originStyles);
     } else {
       // 第二次 set originStyles，需要找到不是 stateStyles 的样式，更新到 originStyles 中
       // 上一次设置的 originStyle，是初始的 shape attrs
-      var styles_1 = this.getOriginStyle(); // let styles: ShapeStyle = {};
+      var styles_1 = this.get('originStyle'); // let styles: ShapeStyle = {};
 
       if (keyShapeName && !styles_1[keyShapeName]) styles_1[keyShapeName] = {}; // 获取当前状态样式
 
-      var currentStatesStyle_1 = this.getCurrentStatesStyle(); // 遍历当前所有图形的 attrs，找到不是 stateStyles 的样式更新到 originStyles 中
+      var currentStatesStyle_1 = this.getCurrentStatesStyle();
 
-      each(children, function (child) {
-        var name = child.get('name');
+      var _loop_1 = function _loop_1(i) {
+        var child = children[i];
+        var name_2 = child.get('name');
         var shapeAttrs = child.attr();
 
-        if (name && name !== keyShapeName) {
+        if (name_2 && name_2 !== keyShapeName) {
           // 有 name 的非 keyShape 图形
-          var shapeStateStyle_1 = currentStatesStyle_1[name];
-          if (!styles_1[name]) styles_1[name] = {};
+          var shapeStateStyle_1 = currentStatesStyle_1[name_2];
+          if (!styles_1[name_2]) styles_1[name_2] = {};
 
@@ -255,6 +261,6 @@ if (shapeStateStyle_1) {
               var value = shapeAttrs[key];
-              if (value !== shapeStateStyle_1[key]) styles_1[name][key] = value;
+              if (value !== shapeStateStyle_1[key]) styles_1[name_2][key] = value;
             });
           } else {
-            styles_1[name] = child.get('type') !== 'image' ? clone(shapeAttrs) : self.getShapeStyleByName(name);
+            styles_1[name_2] = child.get('type') !== 'image' ? clone(shapeAttrs) : self.getShapeStyleByName(name_2);
           }
@@ -267,3 +273,3 @@ } else {
 
-            if (!isPlainObject(subStyle) || styleKey === keyShapeName) {
+            if (styleKey === keyShapeName || !isPlainObject(subStyle)) {
               keyShapeStateStyles_1[styleKey] = subStyle;
@@ -281,8 +287,14 @@ }
         }
-      });
-      if (styles_1.path) delete styles_1.path;
-      if (styles_1.matrix) delete styles_1.matrix;
-      if (styles_1.x) delete styles_1.x;
-      if (styles_1.y) delete styles_1.y;
+      }; // 遍历当前所有图形的 attrs，找到不是 stateStyles 的样式更新到 originStyles 中
 
+
+      for (var i = 0; i < children.length; i++) {
+        _loop_1(i);
+      }
+
+      delete styles_1.path;
+      delete styles_1.matrix;
+      delete styles_1.x;
+      delete styles_1.y;
+
       if (styles_1[keyShapeName]) {
@@ -390,5 +402,3 @@ delete styles_1[keyShapeName].x;
     if (name) {
-      currentShape = group.find(function (element) {
-        return element.get('name') === name;
-      });
+      currentShape = group['shapeMap'][name]; // group.find((element) => element.get('name') === name) as IShapeBase;
     } else {
@@ -450,3 +460,3 @@ currentShape = this.getKeyShape();
     if (!states || !states.length) {
-      return this.getOriginStyle();
+      return this.get('originStyle');
     }
@@ -683,3 +693,3 @@
 
-      this.updateShape();
+      this.updateShape(updateType);
     }
@@ -862,2 +872,3 @@
 
+      group['shapeMap'] = {};
       this.clearCache();
@@ -864,0 +875,0 @@ group.remove();

es/item/node.js

@@ -8,3 +8,5 @@ import { __extends } from "tslib";
 
-var Node = function (_super) {
+var Node =
+/** @class */
+function (_super) {
   __extends(Node, _super);
@@ -260,6 +262,3 @@
     var index = edges.indexOf(edge);
-
-    if (index > -1) {
-      edges.splice(index, 1);
-    }
+    if (index > -1) edges.splice(index, 1);
   };
@@ -281,6 +280,3 @@
 
-    if (!cfg) {
-      return undefined;
-    }
-
+    if (!cfg) return undefined;
     var existX = !isNil(cfg.x);
@@ -291,11 +287,6 @@ var existY = !isNil(cfg.y);
 
-    if (keys.length === 1 && (existX || existY) || keys.length === 2 && existX && existY) {
-      return 'move';
-    }
-
-    if (isNumber(cfg.x) || isNumber(cfg.y) || cfg.type || cfg.anchorPoints || cfg.size || (cfg === null || cfg === void 0 ? void 0 : cfg.style) && (((_a = cfg === null || cfg === void 0 ? void 0 : cfg.style) === null || _a === void 0 ? void 0 : _a.r) || ((_b = cfg === null || cfg === void 0 ? void 0 : cfg.style) === null || _b === void 0 ? void 0 : _b.width) || ((_c = cfg === null || cfg === void 0 ? void 0 : cfg.style) === null || _c === void 0 ? void 0 : _c.height) || ((_d = cfg === null || cfg === void 0 ? void 0 : cfg.style) === null || _d === void 0 ? void 0 : _d.rx) || ((_e = cfg === null || cfg === void 0 ? void 0 : cfg.style) === null || _e === void 0 ? void 0 : _e.ry))) {
-      return 'bbox';
-    }
-
-    return 'style';
+    if (keys.length === 1 && (existX || existY) || keys.length === 2 && existX && existY) return 'move';
+    if (isNumber(cfg.x) || isNumber(cfg.y) || cfg.type || cfg.anchorPoints || cfg.size || (cfg === null || cfg === void 0 ? void 0 : cfg.style) && (((_a = cfg === null || cfg === void 0 ? void 0 : cfg.style) === null || _a === void 0 ? void 0 : _a.r) || ((_b = cfg === null || cfg === void 0 ? void 0 : cfg.style) === null || _b === void 0 ? void 0 : _b.width) || ((_c = cfg === null || cfg === void 0 ? void 0 : cfg.style) === null || _c === void 0 ? void 0 : _c.height) || ((_d = cfg === null || cfg === void 0 ? void 0 : cfg.style) === null || _d === void 0 ? void 0 : _d.rx) || ((_e = cfg === null || cfg === void 0 ? void 0 : cfg.style) === null || _e === void 0 ? void 0 : _e.ry))) return 'bbox|label';
+    var updateLabel = keys.includes('label') || keys.includes('labelCfg');
+    return updateLabel ? 'style|label' : 'style';
   };
@@ -302,0 +293,0 @@

es/types/index.d.ts

@@ -7,3 +7,3 @@ import { IGroup, Event as GraphEvent, BBox, AnimateCfg, ICanvas, IShape } from '@antv/g-base';
 export * from '../interface';
-export declare type UpdateType = 'move' | 'bbox' | 'style' | undefined;
+export declare type UpdateType = 'move' | 'bbox' | 'style' | 'bbox|label' | 'style|label' | undefined;
 export declare type Item = INode | IEdge | ICombo;
@@ -300,3 +300,4 @@ export interface IG6GraphEvent extends GraphEvent {
     fontStyle: 'normal' | 'italic' | 'oblique';
-    fontWeight?: 'normal' | 'bold' | 'bolder' | 'lighter' | number;
+    fontFamily: string;
+    fontWeight: 'normal' | 'bold' | 'bolder' | 'lighter' | number;
     fill: string | null;
@@ -312,2 +313,3 @@ rotateCenter: string;
     offset: number;
+    fillOpacity: number;
     background?: {
@@ -722,1 +724,6 @@ fill?: string;
 }
+export interface FitViewRules {
+    onlyOutOfViewPort?: boolean;
+    direction?: 'x' | 'y' | 'both';
+    ratioRule?: 'max' | 'min';
+}

es/util/base.js

@@ -1,2 +0,2 @@
-import { isString, isNumber, isNil, isArray } from '@antv/util';
+import { isString, isNumber, isArray } from '@antv/util';
 import { G6GraphEvent } from '../interface/behavior';
@@ -13,20 +13,30 @@ export var uniqueId = function uniqueId(type) {
 export var formatPadding = function formatPadding(padding) {
-  var top = 0;
-  var left = 0;
-  var right = 0;
-  var bottom = 0;
+  if (isArray(padding)) {
+    switch (padding.length) {
+      case 4:
+        return padding;
 
+      case 3:
+        padding.push(padding[1]);
+        return padding;
+
+      case 2:
+        return padding.concat(padding);
+
+      case 1:
+        return [padding[0], padding[0], padding[0], padding[0]];
+
+      default:
+        return [0, 0, 0, 0];
+    }
+  }
+
   if (isNumber(padding)) {
-    top = left = right = bottom = padding;
+    return [padding, padding, padding, padding];
   } else if (isString(padding)) {
     var intPadding = parseInt(padding, 10);
-    top = left = right = bottom = intPadding;
-  } else if (isArray(padding)) {
-    top = padding[0];
-    right = !isNil(padding[1]) ? padding[1] : padding[0];
-    bottom = !isNil(padding[2]) ? padding[2] : padding[0];
-    left = !isNil(padding[3]) ? padding[3] : right;
+    return [intPadding, intPadding, intPadding, intPadding];
   }
 
-  return [top, right, bottom, left];
+  return [0, 0, 0, 0];
 };
@@ -33,0 +43,0 @@ /**

es/util/index.d.ts

@@ -1,2 +0,1 @@
-/// <reference types="_gl-matrix@3.3.0@gl-matrix" />
 import * as MathUtil from './math';
@@ -43,3 +42,3 @@ import { ext, mat3 } from '@antv/matrix-util';
     }[];
-    getSpline: (points: import("..").IPoint[]) => any[][];
+    getSpline: (points: import("..").IPoint[]) => import("@antv/path-util/lib/types").PathCommand[];
     getControlPoint: (startPoint: import("..").IPoint, endPoint: import("..").IPoint, percent?: number, offset?: number) => import("..").IPoint;
@@ -65,3 +64,4 @@ pointsToPolygon: (points: import("..").IPoint[] | (string | {
         fontStyle: "normal" | "italic" | "oblique";
-        fontWeight?: number | "normal" | "bold" | "bolder" | "lighter";
+        fontFamily: string;
+        fontWeight: number | "bold" | "normal" | "bolder" | "lighter";
         fill: string;
@@ -77,2 +77,3 @@ rotateCenter: string;
         offset: number;
+        fillOpacity: number;
         background?: {
@@ -79,0 +80,0 @@ fill?: string;

es/util/math.js

@@ -136,14 +136,11 @@ import { mat3, vec3, ext, vec2 } from '@antv/matrix-util';
   var dy = y - cy;
-  var d = Math.sqrt(dx * dx + dy * dy);
 
-  if (d < r) {
+  if (dx * dx + dy * dy < r * r) {
     return null;
   }
 
-  var signX = Math.sign(dx);
-  var signY = Math.sign(dy);
   var angle = Math.atan(dy / dx);
   return {
-    x: cx + Math.abs(r * Math.cos(angle)) * signX,
-    y: cy + Math.abs(r * Math.sin(angle)) * signY
+    x: cx + Math.abs(r * Math.cos(angle)) * Math.sign(dx),
+    y: cy + Math.abs(r * Math.sin(angle)) * Math.sign(dy)
   };
@@ -650,3 +647,5 @@ };
 
-var Line = function () {
+var Line =
+/** @class */
+function () {
   function Line(x1, y1, x2, y2) {
@@ -653,0 +652,0 @@ this.x1 = x1;

es/util/path.d.ts

@@ -7,3 +7,3 @@ import { vec2 } from '@antv/matrix-util';
  */
-export declare const getSpline: (points: IPoint[]) => any[][];
+export declare const getSpline: (points: IPoint[]) => import("@antv/path-util/lib/types").PathCommand[];
 /**
@@ -10,0 +10,0 @@ * 根据起始点、相对位置、偏移量计算控制点

es/util/validation.js

@@ -14,3 +14,5 @@ import { __spreadArray } from "tslib";
 export var dataValidation = function dataValidation(data) {
-  // 1. 必须传入数据
+  var _a; // 1. 必须传入数据
+
+
   if (!data) {
@@ -24,4 +26,4 @@ console.error('G6 Error Tips: the data must be defined');
       edges = data.edges,
-      _a = data.combos,
-      combos = _a === void 0 ? [] : _a;
+      _b = data.combos,
+      combos = _b === void 0 ? [] : _b;
 
@@ -55,7 +57,7 @@ if (!nodes && !edges) {
   });
-  var comboIds = combos.map(function (combo) {
+  var comboIds = (_a = combos) === null || _a === void 0 ? void 0 : _a.map(function (combo) {
     return combo.id;
   });
 
-  var ids = __spreadArray(__spreadArray([], nodeIds), comboIds);
+  var ids = __spreadArray(__spreadArray([], nodeIds, true), comboIds, true);
 
@@ -62,0 +64,0 @@ var nonEdges = (edges || []).find(function (edge) {

lib/behavior/behavior.js

@@ -14,3 +14,5 @@ "use strict";
 
-var Behavior = function () {
+var Behavior =
+/** @class */
+function () {
   function Behavior() {}
@@ -17,0 +19,0 @@ /**

lib/element/combo.js

@@ -42,3 +42,4 @@ "use strict";
         fill: _global.default.comboLabel.style.fill,
-        fontSize: _global.default.comboLabel.style.fontSize
+        fontSize: _global.default.comboLabel.style.fontSize,
+        fontFamily: _global.default.windowFontFamily
       }
@@ -45,0 +46,0 @@ },

lib/element/combos/rect.js

@@ -29,3 +29,4 @@ "use strict";
         fill: _global.default.comboLabel.style.fill,
-        fontSize: _global.default.comboLabel.style.fontSize
+        fontSize: _global.default.comboLabel.style.fontSize,
+        fontFamily: _global.default.windowFontFamily
       }
@@ -32,0 +33,0 @@ },

lib/element/edge.js

@@ -77,3 +77,4 @@ "use strict";
         fill: _global.default.edgeLabel.style.fill,
-        fontSize: _global.default.edgeLabel.style.fontSize
+        fontSize: _global.default.edgeLabel.style.fontSize,
+        fontFamily: _global.default.windowFontFamily
       }
@@ -133,9 +134,8 @@ },
 
-    var group = item.getContainer();
-    var strokeStyle = {
-      stroke: cfg.color
-    };
-    var shape = ((_a = item.getKeyShape) === null || _a === void 0 ? void 0 : _a.call(item)) || group.find(function (element) {
-      return element.get('className') === 'edge-shape';
-    });
+    var group = item.getContainer(); // const strokeStyle: ShapeStyle = {
+    //   stroke: cfg.color,
+    // };
+
+    var shape = ((_a = item.getKeyShape) === null || _a === void 0 ? void 0 : _a.call(item)) || group['shapeMap']['edge-shape']; // group.find((element) => element.get('className') === 'edge-shape');
+
     var size = cfg.size;
@@ -156,4 +156,10 @@ cfg = this.getPathPoints(cfg);
     points.push(endPoint);
-    var currentAttr = shape.attr();
-    var previousStyle = (0, _util.mix)({}, strokeStyle, currentAttr, cfg.style);
+    var currentAttr = shape.attr(); // const previousStyle = mix({}, strokeStyle, currentAttr, cfg.style);
+
+    var previousStyle = cfg.style || {};
+
+    if (previousStyle.stroke === undefined) {
+      previousStyle.stroke = cfg.color;
+    }
+
     var source = cfg.sourceNode;
@@ -194,6 +200,6 @@ var target = cfg.targetNode;
 
-      style = (0, _util.mix)(strokeStyle, currentAttr, {
-        lineWidth: size,
-        path: path
-      }, cfg.style);
+      style = (0, _tslib.__assign)({}, cfg.style);
+      if (style.lineWidth === undefined) style.lineWdith = ((0, _util.isNumber)(size) ? size : size === null || size === void 0 ? void 0 : size[0]) || currentAttr.lineWidth;
+      if (style.path === undefined) style.path = path;
+      if (style.stroke === undefined) style.stroke = currentAttr.stroke || cfg.color;
     }
@@ -209,5 +215,4 @@
     var style = {};
-    var pathShape = group && group.find(function (element) {
-      return element.get('className') === CLS_SHAPE;
-    }); // 不对 pathShape 进行判空，如果线不存在，说明有问题了
+    var pathShape = group === null || group === void 0 ? void 0 : group['shapeMap'][CLS_SHAPE]; // group?.find((element) => element.get('className') === CLS_SHAPE);
+    // 不对 pathShape 进行判空，如果线不存在，说明有问题了
 
@@ -270,5 +275,4 @@ var pointPercent;
     if ((0, _util.isNil)(labelCfg.autoRotate)) autoRotate = this.labelAutoRotate;else autoRotate = labelCfg.autoRotate;
-    var pathShape = group && group.find(function (element) {
-      return element.get('className') === CLS_SHAPE;
-    }); // 不对 pathShape 进行判空，如果线不存在，说明有问题了
+    var pathShape = group === null || group === void 0 ? void 0 : group['shapeMap'][CLS_SHAPE]; // group?.find((element) => element.get('className') === CLS_SHAPE);
+    // 不对 pathShape 进行判空，如果线不存在，说明有问题了
 
@@ -366,2 +370,3 @@ var pointPercent;
     });
+    group['shapeMap'][CLS_SHAPE] = shape;
     return shape;
@@ -371,7 +376,3 @@ },
     var defaultLabelCfg = this.options.labelCfg;
-    var defaultFontFamily;
-    if (typeof window !== 'undefined' && typeof window.getComputedStyle !== 'undefined') defaultFontFamily = window.getComputedStyle(document.body, null).getPropertyValue('font-family') || 'Arial, sans-serif';else defaultFontFamily = 'Arial, sans-serif';
-    var labelCfg = (0, _util.deepMix)({
-      fontFamily: defaultFontFamily
-    }, defaultLabelCfg, cfg.labelCfg);
+    var labelCfg = (0, _util.deepMix)({}, defaultLabelCfg, cfg.labelCfg);
     var labelStyle = this.getLabelStyle(cfg, labelCfg, group);
@@ -384,2 +385,3 @@ var rotate = labelStyle.rotate;
     });
+    group['shapeMap']['text-shape'] = label;
 
@@ -394,2 +396,3 @@ if (!isNaN(rotate) && rotate !== '') {
       rect.set('classname', labelBgClassname);
+      group['shapeMap'][labelBgClassname] = rect;
       label.toFront();
@@ -409,2 +412,3 @@ }
     });
+    group['shapeMap']['text-bg-shape'] = rect;
     if (!isNaN(rotate)) rect.rotateAtStart(rotate);
@@ -411,0 +415,0 @@ return rect;

lib/element/node.js

@@ -42,5 +42,8 @@ "use strict";
   getSize: function getSize(cfg) {
-    var size = cfg.size || this.getOptions({}).size || _global.default.defaultNode.size; // size 是数组，但长度为1，则补长度为2
+    var _a;
 
+    var size = ((_a = this.mergeStyle) === null || _a === void 0 ? void 0 : _a.size) || cfg.size || this.getOptions({}).size || _global.default.defaultNode.size; // Global.defaultNode.size; //  
+    // size 是数组，但长度为1，则补长度为2
 
+
     if ((0, _util.isArray)(size) && size.length === 1) {
@@ -77,4 +80,2 @@ size = [size[0], size[0]];
     var size = this.getSize(cfg);
-    var width = size[0];
-    var height = size[1];
     var style;
@@ -86,3 +87,3 @@
           x: 0,
-          y: 0 - height / 2 - offset,
+          y: -size[1] / 2 - offset,
           textBaseline: 'bottom' // 文本在图形的上面
@@ -96,3 +97,3 @@
           x: 0,
-          y: height / 2 + offset,
+          y: size[1] / 2 + offset,
           textBaseline: 'top'
@@ -104,3 +105,3 @@ };
         style = {
-          x: 0 - width / 2 - offset,
+          x: -size[0] / 2 - offset,
           y: 0,
@@ -113,3 +114,3 @@ textAlign: 'right'
         style = {
-          x: width / 2 + offset,
+          x: size[0] / 2 + offset,
           y: 0,
@@ -125,33 +126,18 @@ textAlign: 'left'
   getLabelBgStyleByPosition: function getLabelBgStyleByPosition(label, cfg, labelCfg, group) {
-    if (!label) {
-      return {};
-    }
+    var _a;
 
+    if (!label) return {};
+    var backgroundStyle = (_a = labelCfg.style) === null || _a === void 0 ? void 0 : _a.background;
+    if (!backgroundStyle) return {};
     var bbox = label.getBBox();
-    var backgroundStyle = labelCfg.style && labelCfg.style.background;
-
-    if (!backgroundStyle) {
-      return {};
-    }
-
     var padding = (0, _base.formatPadding)(backgroundStyle.padding);
     var backgroundWidth = bbox.width + padding[1] + padding[3];
     var backgroundHeight = bbox.height + padding[0] + padding[2];
-    var offset = labelCfg.offset;
-
-    if ((0, _util.isNil)(offset)) {
-      // 考虑 offset = 0 的场景，不用用 labelCfg.offset || Global.nodeLabel.offset
-      offset = this.offset; // 不居中时的偏移量
-    }
-
-    var style;
-    style = {
+    return (0, _tslib.__assign)((0, _tslib.__assign)({
       x: bbox.minX - padding[3],
       y: bbox.minY - padding[0]
-    };
-    style = (0, _tslib.__assign)((0, _tslib.__assign)((0, _tslib.__assign)({}, style), backgroundStyle), {
+    }, backgroundStyle), {
       width: backgroundWidth,
       height: backgroundHeight
     });
-    return style;
   },
@@ -167,2 +153,3 @@ drawShape: function drawShape(cfg, group) {
     });
+    group['shapeMap']['node-shape'] = shape;
     return shape;
@@ -177,13 +164,13 @@ },
   updateLinkPoints: function updateLinkPoints(cfg, group) {
-    var defaultLinkPoints = this.getOptions(cfg).linkPoints;
-    var markLeft = group.find(function (element) {
+    var defaultLinkPoints = (this.mergeStyle || this.getOptions(cfg)).linkPoints;
+    var markLeft = group['shapeMap']['link-point-left'] || group.find(function (element) {
       return element.get('className') === 'link-point-left';
     });
-    var markRight = group.find(function (element) {
+    var markRight = group['shapeMap']['link-point-right'] || group.find(function (element) {
       return element.get('className') === 'link-point-right';
     });
-    var markTop = group.find(function (element) {
+    var markTop = group['shapeMap']['link-point-top'] || group.find(function (element) {
       return element.get('className') === 'link-point-top';
     });
-    var markBottom = group.find(function (element) {
+    var markBottom = group['shapeMap']['link-point-bottom'] || group.find(function (element) {
       return element.get('className') === 'link-point-bottom';
@@ -241,2 +228,3 @@ });
         markLeft.remove();
+        delete group['shapeMap']['link-point-left'];
       } else {
@@ -249,3 +237,4 @@ markLeft.attr((0, _tslib.__assign)((0, _tslib.__assign)({}, styles), {
     } else if (left) {
-      group.addShape('circle', {
+      var name_1 = 'link-point-left';
+      group['shapeMap'][name_1] = group.addShape('circle', {
         attrs: (0, _tslib.__assign)((0, _tslib.__assign)({}, styles), {
@@ -255,4 +244,4 @@ x: -width / 2,
         }),
-        className: 'link-point-left',
-        name: 'link-point-left',
+        className: name_1,
+        name: name_1,
         isAnchorPoint: true
@@ -265,2 +254,3 @@ });
         markRight.remove();
+        delete group['shapeMap']['link-point-right'];
       }
@@ -273,3 +263,4 @@
     } else if (right) {
-      group.addShape('circle', {
+      var name_2 = 'link-point-right';
+      group['shapeMap'][name_2] = group.addShape('circle', {
         attrs: (0, _tslib.__assign)((0, _tslib.__assign)({}, styles), {
@@ -279,4 +270,4 @@ x: width / 2,
         }),
-        className: 'link-point-right',
-        name: 'link-point-right',
+        className: name_2,
+        name: name_2,
         isAnchorPoint: true
@@ -289,2 +280,3 @@ });
         markTop.remove();
+        delete group['shapeMap']['link-point-top'];
       }
@@ -297,3 +289,4 @@
     } else if (top) {
-      group.addShape('circle', {
+      var name_3 = 'link-point-top';
+      group['shapeMap'][name_3] = group.addShape('circle', {
         attrs: (0, _tslib.__assign)((0, _tslib.__assign)({}, styles), {
@@ -303,4 +296,4 @@ x: 0,
         }),
-        className: 'link-point-top',
-        name: 'link-point-top',
+        className: name_3,
+        name: name_3,
         isAnchorPoint: true
@@ -313,2 +306,3 @@ });
         markBottom.remove();
+        delete group['shapeMap']['link-point-bottom'];
       } else {
@@ -321,3 +315,4 @@ markBottom.attr((0, _tslib.__assign)((0, _tslib.__assign)({}, styles), {
     } else if (bottom) {
-      group.addShape('circle', {
+      var name_4 = 'link-point-bottom';
+      group['shapeMap'][name_4] = group.addShape('circle', {
         attrs: (0, _tslib.__assign)((0, _tslib.__assign)({}, styles), {
@@ -327,4 +322,4 @@ x: 0,
         }),
-        className: 'link-point-bottom',
-        name: 'link-point-bottom',
+        className: name_4,
+        name: name_4,
         isAnchorPoint: true
@@ -334,7 +329,10 @@ });
   },
-  updateShape: function updateShape(cfg, item, keyShapeStyle, hasIcon) {
+  updateShape: function updateShape(cfg, item, keyShapeStyle, hasIcon, updateType) {
     var keyShape = item.get('keyShape');
     keyShape.attr((0, _tslib.__assign)({}, keyShapeStyle));
-    this.updateLabel(cfg, item); // special for some types of nodes
 
+    if (!undefined || (updateType === null || updateType === void 0 ? void 0 : updateType.includes('label'))) {
+      this.updateLabel(cfg, item, updateType);
+    }
+
     if (hasIcon) {
@@ -348,8 +346,8 @@ this.updateIcon(cfg, item);
     var group = item.getContainer();
-    var icon = this.getOptions(cfg).icon;
+    var icon = (this.mergeStyle || this.getOptions(cfg)).icon;
     var show = (cfg.icon ? cfg.icon : {
       show: undefined
     }).show;
-    var iconShape = group.find(function (element) {
-      return element.get('className') === _this.type + "-icon";
+    var iconShape = group['shapeMap'][this.type + "-icon"] || group.find(function (ele) {
+      return ele.get('name') === _this.type + "-icon";
     });
@@ -378,3 +376,4 @@
           h = icon.height;
-      group.addShape('image', {
+      var name_5 = this.type + "-icon";
+      group['shapeMap'][name_5] = group.addShape('image', {
         attrs: (0, _tslib.__assign)((0, _tslib.__assign)({}, icon), {
@@ -384,8 +383,8 @@ x: -w / 2,
         }),
-        className: this.type + "-icon",
-        name: this.type + "-icon"
+        className: name_5,
+        name: name_5
       }); // to ensure the label is on the top of all the shapes
 
-      var labelShape = group.find(function (element) {
-        return element.get('className') === "node-label";
+      var labelShape = group['shapeMap']['node-label'] || group.find(function (ele) {
+        return ele.get('name') === 'node-label';
       });
@@ -392,0 +391,0 @@

lib/element/nodes/image.js

@@ -7,2 +7,4 @@ "use strict";
 
+var _global = _interopRequireDefault(require("../../global"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -17,2 +19,7 @@
     size: 200,
+    labelCfg: {
+      style: {
+        fontFamily: _global.default.windowFontFamily
+      }
+    },
     clipCfg: {
@@ -45,4 +52,3 @@ show: false,
   drawShape: function drawShape(cfg, group) {
-    var shapeType = this.shapeType; // || this.type，都已经加了 shapeType
-
+    var shapeType = this.shapeType;
     var style = this.getShapeStyle(cfg);
@@ -60,3 +66,3 @@ delete style.fill;
   drawClip: function drawClip(cfg, shape) {
-    var clip = this.getOptions(cfg).clipCfg;
+    var clip = (this.mergeStyle || this.getOptions(cfg)).clipCfg;
 
@@ -128,5 +134,7 @@ if (!clip.show) {
   getShapeStyle: function getShapeStyle(cfg) {
-    var defaultStyle = this.getOptions(cfg).style;
+    var _a = this.mergeStyle || this.getOptions(cfg),
+        defaultStyle = _a.style,
+        img = _a.img;
+
     var size = this.getSize(cfg);
-    var img = this.getOptions(cfg).img;
     var width = size[0];
@@ -152,3 +160,3 @@ var height = size[1];
     var shapeClassName = this.itemType + "-shape";
-    var shape = group.find(function (element) {
+    var shape = group['shapeMap'][shapeClassName] || group.find(function (element) {
       return element.get('className') === shapeClassName;
@@ -158,3 +166,3 @@ }) || item.getKeyShape();
 
-    if (shape) {
+    if (shape && !shape.destroyed) {
       shape.attr(shapeStyle);
@@ -161,0 +169,0 @@ }

lib/element/nodes/simple-circle.js

@@ -28,3 +28,4 @@ "use strict";
         fill: _global.default.nodeLabel.style.fill,
-        fontSize: _global.default.nodeLabel.style.fontSize
+        fontSize: _global.default.nodeLabel.style.fontSize,
+        fontFamily: _global.default.windowFontFamily
       }
@@ -37,9 +38,13 @@ },
   labelPosition: 'center',
+  shapeMap: {},
   drawShape: function drawShape(cfg, group) {
     var style = this.getShapeStyle(cfg);
+    var name = this.type + "-keyShape";
     var keyShape = group.addShape('circle', {
       attrs: style,
       className: this.type + "-keyShape",
+      name: name,
       draggable: true
     });
+    group['shapeMap'][name] = keyShape;
     return keyShape;
@@ -54,3 +59,3 @@ },
   getShapeStyle: function getShapeStyle(cfg) {
-    var defaultStyle = this.getOptions(cfg).style;
+    var defaultStyle = (this.mergeStyle || this.getOptions(cfg)).style;
     var strokeStyle = {
@@ -70,3 +75,3 @@ stroke: cfg.color
   },
-  update: function update(cfg, item) {
+  update: function update(cfg, item, updateType) {
     var size = this.getSize(cfg); // 下面这些属性需要覆盖默认样式与目前样式，但若在 cfg 中有指定则应该被 cfg 的相应配置覆盖。
@@ -81,4 +86,4 @@
     var style = (0, _util.deepMix)({}, keyShape.attr(), strokeStyle, cfg.style);
-    this.updateShape(cfg, item, style, true);
+    this.updateShape(cfg, item, style, true, updateType);
   }
 }, 'single-node');

lib/element/nodes/simple-rect.js

@@ -27,3 +27,4 @@ "use strict";
         fill: _global.default.nodeLabel.style.fill,
-        fontSize: _global.default.nodeLabel.style.fontSize
+        fontSize: _global.default.nodeLabel.style.fontSize,
+        fontFamily: _global.default.windowFontFamily
       }
@@ -55,3 +56,3 @@ },
   getShapeStyle: function getShapeStyle(cfg) {
-    var defaultStyle = this.getOptions(cfg).style;
+    var defaultStyle = (this.mergeStyle || this.getOptions(cfg)).style;
     var strokeStyle = {
@@ -73,6 +74,6 @@ stroke: cfg.color
   },
-  update: function update(cfg, item) {
+  update: function update(cfg, item, updateType) {
     var group = item.getContainer(); // 这里不传 cfg 参数是因为 cfg.style 需要最后覆盖样式
 
-    var defaultStyle = this.getOptions({}).style;
+    var defaultStyle = (this.mergeStyle || this.getOptions(cfg)).style;
     var size = this.getSize(cfg);
@@ -97,4 +98,4 @@ var keyShape = item.get('keyShape');
     style = (0, _util.mix)(style, cfg.style);
-    this.updateShape(cfg, item, style, false);
+    this.updateShape(cfg, item, style, false, updateType);
   }
 }, 'single-node');

lib/element/shape.js

@@ -63,2 +63,3 @@ "use strict";
     var shape = this.getShape(type);
+    group['shapeMap'] = {};
     var rst = shape.draw(cfg, group);
@@ -80,7 +81,10 @@
   baseUpdate: function baseUpdate(type, cfg, item, updateType) {
-    var shape = this.getShape(type);
+    var _a, _b;
 
+    var shape = this.getShape(type); // 防止没定义 update 函数
+
     if (shape.update) {
-      // 防止没定义 update 函数
-      shape.update(cfg, item, updateType);
+      // shape.mergeStyle = updateType === 'move' || updateType === 'bbox' ? {} : shape.getOptions?.(cfg);
+      shape.mergeStyle = (_a = shape.getOptions) === null || _a === void 0 ? void 0 : _a.call(shape, cfg, updateType);
+      (_b = shape.update) === null || _b === void 0 ? void 0 : _b.call(shape, cfg, item, updateType);
     }
@@ -190,3 +194,5 @@
 
-var Shape = function () {
+var Shape =
+/** @class */
+function () {
   function Shape() {}
@@ -193,0 +199,0 @@

lib/element/shapeBase.js

@@ -68,3 +68,14 @@ "use strict";
   // 默认样式及配置
-  options: {},
+  options: {
+    labelCfg: {
+      style: {
+        fontFamily: _global.default.windowFontFamily
+      }
+    },
+    descriptionCfg: {
+      style: {
+        fontFamily: _global.default.windowFontFamily
+      }
+    }
+  },
   itemType: '',
@@ -80,19 +91,7 @@
   getOptions: function getOptions(cfg, updateType) {
-    if (updateType === 'move' || updateType === 'bbox') {
+    if (updateType === 'move' || (updateType === null || updateType === void 0 ? void 0 : updateType.includes('bbox'))) {
       return {};
     }
 
-    return (0, _util.deepMix)({
-      // 解决局部渲染导致的文字移动残影问题
-      labelCfg: {
-        style: {
-          fontFamily: typeof window !== 'undefined' && window.getComputedStyle ? window.getComputedStyle(document.body, null).getPropertyValue('font-family') || 'Arial, sans-serif' : 'Arial, sans-serif'
-        }
-      },
-      descriptionCfg: {
-        style: {
-          fontFamily: typeof window !== 'undefined' && window.getComputedStyle ? window.getComputedStyle(document.body, null).getPropertyValue('font-family') || 'Arial, sans-serif' : 'Arial, sans-serif'
-        }
-      }
-    }, this.options, this.getCustomConfig(cfg) || {}, cfg);
+    return (0, _util.deepMix)({}, this.options, this.getCustomConfig(cfg) || {}, cfg);
   },
@@ -108,4 +107,7 @@
   draw: function draw(cfg, group) {
+    group['shapeMap'] = {};
+    this.mergeStyle = this.getOptions(cfg);
     var shape = this.drawShape(cfg, group);
     shape.set('className', this.itemType + CLS_SHAPE_SUFFIX);
+    group['shapeMap'][this.itemType + CLS_SHAPE_SUFFIX] = shape;
 
@@ -115,2 +117,3 @@ if (cfg.label) {
       label.set('className', this.itemType + CLS_LABEL_SUFFIX);
+      group['shapeMap'][this.itemType + CLS_LABEL_SUFFIX] = label;
     }
@@ -132,3 +135,3 @@
   drawLabel: function drawLabel(cfg, group) {
-    var defaultLabelCfg = this.getOptions(cfg).labelCfg; // image的情况下有可能为null
+    var defaultLabelCfg = (this.mergeStyle || this.getOptions(cfg) || {}).labelCfg; // image的情况下有可能为null
 
@@ -145,2 +148,3 @@ var labelCfg = defaultLabelCfg || {};
     });
+    group['shapeMap']['text-shape'] = label;
 
@@ -180,2 +184,3 @@ if (!isNaN(rotate) && rotate !== '') {
       rect.set('classname', labelBgClassname);
+      group['shapeMap'][labelBgClassname] = rect;
       label.toFront();
@@ -194,2 +199,3 @@ }
     });
+    group['shapeMap']['text-bg-shape'] = rect;
     return rect;
@@ -217,4 +223,3 @@ },
     var defaultStyle = _global.default[attrName] ? _global.default[attrName].style : null;
-    var labelStyle = (0, _tslib.__assign)((0, _tslib.__assign)((0, _tslib.__assign)({}, defaultStyle), calculateStyle), labelCfg.style);
-    return labelStyle;
+    return (0, _tslib.__assign)((0, _tslib.__assign)((0, _tslib.__assign)({}, defaultStyle), calculateStyle), labelCfg.style);
   },
@@ -241,2 +246,4 @@
   updateShapeStyle: function updateShapeStyle(cfg, item, updateType) {
+    var _a;
+
     var group = item.getContainer();
@@ -247,3 +254,3 @@ var shape = item.getKeyShape();
     var _loop_1 = function _loop_1(key) {
-      var _a;
+      var _b;
 
@@ -254,11 +261,8 @@ var style = shapeStyle[key];
         // 更新图元素样式，支持更新子元素
-        var subShape = group.find(function (element) {
+        var subShape = ((_a = group['shapeMap']) === null || _a === void 0 ? void 0 : _a[key]) || group.find(function (element) {
           return element.get('name') === key;
         });
-
-        if (subShape) {
-          subShape.attr(style);
-        }
+        subShape === null || subShape === void 0 ? void 0 : subShape.attr(style);
       } else {
-        shape.attr((_a = {}, _a[key] = style, _a));
+        shape.attr((_b = {}, _b[key] = style, _b));
       }
@@ -272,37 +276,37 @@ };
   updateLabel: function updateLabel(cfg, item, updateType) {
-    var group = item.getContainer();
-    var defaultLabelCfg = this.getOptions({}, updateType).labelCfg;
-    var labelClassName = this.itemType + CLS_LABEL_SUFFIX;
-    var label = group.find(function (element) {
-      return element.get('className') === labelClassName;
-    });
-    var labelBgClassname = this.itemType + CLS_LABEL_BG_SUFFIX;
-    var labelBg = group.find(function (element) {
-      return element.get('classname') === labelBgClassname;
-    }); // 防止 cfg.label = "" 的情况
+    var _a, _b; // 防止 cfg.label = "" 的情况
 
+
     if (cfg.label || cfg.label === '') {
-      // 若传入的新配置中有 label，（用户没传入但原先有 label，label 也会有值）
+      var group = item.getContainer();
+      var _c = (this.mergeStyle || this.getOptions({}, updateType) || {}).labelCfg,
+          labelCfg = _c === void 0 ? {} : _c;
+      var labelClassName_1 = this.itemType + CLS_LABEL_SUFFIX;
+      var label = group['shapeMap'][labelClassName_1] || group.find(function (ele) {
+        return ele.get('className') === labelClassName_1;
+      });
+      var labelBgClassname_1 = this.itemType + CLS_LABEL_BG_SUFFIX;
+      var labelBg = group['shapeMap'][labelBgClassname_1] || group.find(function (ele) {
+        return ele.get('className') === labelBgClassname_1;
+      }); // 若传入的新配置中有 label，（用户没传入但原先有 label，label 也会有值）
+
       if (!label) {
         // 若原先不存在 label，则绘制一个新的 label
         var newLabel = this.drawLabel(cfg, group);
-        newLabel.set('className', labelClassName);
+        newLabel.set('className', labelClassName_1);
+        group['shapeMap'][labelClassName_1] = newLabel;
       } else {
         // 若原先存在 label，则更新样式。与 getLabelStyle 不同在于这里需要融合当前 label 的样式
-        // 用于融合 style 以外的属性：position, offset, ...
-        var currentLabelCfg = {};
+        // 融合 style 以外的属性：position, offset, ...
+        if (!updateType || updateType === 'bbox|label' || this.itemType === 'edge' && updateType !== 'style') {
+          labelCfg = (0, _util.deepMix)(labelCfg, cfg.labelCfg);
+        } // 获取位置信息
 
-        if (item.getModel) {
-          currentLabelCfg = item.getModel().labelCfg;
-        } // 这里不能去掉
 
-
-        var labelCfg = (0, _util.deepMix)({}, defaultLabelCfg, currentLabelCfg, cfg.labelCfg); // 获取位置信息
-
         var calculateStyle = this.getLabelStyleByPosition(cfg, labelCfg, group); // 取 nodeLabel，edgeLabel 的配置项
 
-        var cfgStyle = cfg.labelCfg ? cfg.labelCfg.style : undefined;
-        var cfgBgStyle = labelCfg.style && labelCfg.style.background; // 需要融合当前 label 的样式 label.attr()。不再需要全局/默认样式，因为已经应用在当前的 label 上
+        var cfgStyle = (_a = cfg.labelCfg) === null || _a === void 0 ? void 0 : _a.style; // const cfgBgStyle = labelCfg.style?.background;
+        // 需要融合当前 label 的样式 label.attr()。不再需要全局/默认样式，因为已经应用在当前的 label 上
 
-        var labelStyle = (0, _tslib.__assign)((0, _tslib.__assign)((0, _tslib.__assign)({}, label.attr()), calculateStyle), cfgStyle);
+        var labelStyle = (0, _tslib.__assign)((0, _tslib.__assign)({}, calculateStyle), cfgStyle);
         var rotate = labelStyle.rotate;
@@ -315,8 +319,9 @@ delete labelStyle.rotate; // 计算 label 的旋转矩阵
           rotateMatrix = transform(rotateMatrix, [['t', -labelStyle.x, -labelStyle.y], ['r', rotate], ['t', labelStyle.x, labelStyle.y]]);
-          label.resetMatrix();
-          label.attr((0, _tslib.__assign)((0, _tslib.__assign)({}, labelStyle), {
-            matrix: rotateMatrix
-          }));
+          labelStyle.matrix = rotateMatrix;
+          label.attr(labelStyle);
         } else {
-          label.resetMatrix();
+          if (((_b = label.getMatrix()) === null || _b === void 0 ? void 0 : _b[4]) !== 1) {
+            label.resetMatrix();
+          }
+
           label.attr(labelStyle);
@@ -328,3 +333,4 @@ }
             labelBg = this.drawLabelBg(cfg, group, label);
-            labelBg.set('classname', labelBgClassname);
+            labelBg.set('classname', labelBgClassname_1);
+            group['shapeMap'][labelBgClassname_1] = labelBg;
             label.toFront();
@@ -334,4 +340,3 @@ }
           var calculateBgStyle = this.getLabelBgStyleByPosition(label, cfg, labelCfg, group);
-          var labelBgStyle = (0, _tslib.__assign)((0, _tslib.__assign)({}, calculateBgStyle), cfgBgStyle);
-          labelBg.resetMatrix();
+          var labelBgStyle = calculateBgStyle;
 
@@ -342,2 +347,4 @@ if (!isNaN(rotate) && rotate !== '') {
             labelBgStyle.matrix = bgRotateMatrix;
+          } else {
+            labelBg.resetMatrix();
           }
@@ -366,2 +373,4 @@
 
+    var _c;
+
     var shape = item.get('keyShape');
@@ -399,3 +408,3 @@ if (!shape || shape.destroyed) return;
       var _loop_2 = function _loop_2(key) {
-        var _c;
+        var _d;
 
@@ -405,12 +414,9 @@ var style = styles[key];
         if ((0, _util.isPlainObject)(style) && !ARROWS.includes(key)) {
-          var subShape = group.find(function (element) {
+          var subShape = ((_c = group['shapeMap']) === null || _c === void 0 ? void 0 : _c[key]) || group.find(function (element) {
             return element.get('name') === key;
           });
-
-          if (subShape) {
-            subShape.attr(style);
-          }
+          subShape === null || subShape === void 0 ? void 0 : subShape.attr(style);
         } else {
           // 非纯对象，则认为是设置到 keyShape 上面的
-          shape.attr((_c = {}, _c[key] = style, _c));
+          shape.attr((_d = {}, _d[key] = style, _d));
         }
@@ -451,4 +457,4 @@ }; // style 为要设置的状态的样式
         if ((0, _util.isPlainObject)(style) && !ARROWS.includes(p)) {
-          var subShape_1 = group.find(function (element) {
-            return element.get('name') === p;
+          var subShape_1 = group['shapeMap'][p] || group.find(function (ele) {
+            return ele.get('name') === p;
           });
@@ -516,3 +522,3 @@
       var _loop_4 = function _loop_4(originKey) {
-        var _d, _e;
+        var _e, _f;
 
@@ -522,4 +528,4 @@ var style = originstyles[originKey];
         if ((0, _util.isPlainObject)(style) && !ARROWS.includes(originKey)) {
-          var subShape = group.find(function (element) {
-            return element.get('name') === originKey;
+          var subShape = group['shapeMap'][originKey] || group.find(function (ele) {
+            return ele.get('name') === originKey;
           });
@@ -552,6 +558,6 @@
             if (!keyShapeName_1) {
-              shape.attr((_d = {}, _d[originKey] = value_4, _d));
+              shape.attr((_e = {}, _e[originKey] = value_4, _e));
             }
           } else {
-            shape.attr((_e = {}, _e[originKey] = value_4, _e));
+            shape.attr((_f = {}, _f[originKey] = value_4, _f));
           }
@@ -558,0 +564,0 @@ }

lib/element/xml.js

@@ -6,7 +6,7 @@ "use strict";
 });
-exports.parseXML = parseXML;
-exports.getBBox = getBBox;
-exports.generateTarget = generateTarget;
 exports.compareTwoTarget = compareTwoTarget;
 exports.createNodeFromXML = createNodeFromXML;
+exports.generateTarget = generateTarget;
+exports.getBBox = getBBox;
+exports.parseXML = parseXML;
 exports.xmlDataRenderer = void 0;
@@ -13,0 +13,0 @@

lib/global.d.ts

@@ -183,3 +183,4 @@ declare const _default: {
     };
+    windowFontFamily: string;
 };
 export default _default;

lib/global.js

@@ -56,3 +56,3 @@ "use strict";
 var _default = {
-  version: '0.3.11',
+  version: '0.4.0-beta.0',
   rootContainerClassName: 'root-container',
@@ -243,4 +243,5 @@ nodeContainerClassName: 'node-container',
     lineDash: [5, 5]
-  }
+  },
+  windowFontFamily: typeof window !== 'undefined' && window.getComputedStyle ? window.getComputedStyle(document.body, null).getPropertyValue('font-family') || 'Arial, sans-serif' : 'Arial, sans-serif'
 };
 exports.default = _default;

lib/graph/controller/event.js

@@ -8,3 +8,5 @@ "use strict";
 
-var EventController = function () {
+var EventController =
+/** @class */
+function () {
   function EventController(graph) {
@@ -11,0 +13,0 @@ this.graph = graph;

lib/graph/controller/index.js

@@ -6,24 +6,24 @@ "use strict";
 });
-Object.defineProperty(exports, "ModeController", {
+Object.defineProperty(exports, "ItemController", {
   enumerable: true,
   get: function get() {
-    return _mode.default;
+    return _item.default;
   }
 });
-Object.defineProperty(exports, "ViewController", {
+Object.defineProperty(exports, "ModeController", {
   enumerable: true,
   get: function get() {
-    return _view.default;
+    return _mode.default;
   }
 });
-Object.defineProperty(exports, "ItemController", {
+Object.defineProperty(exports, "StateController", {
   enumerable: true,
   get: function get() {
-    return _item.default;
+    return _state.default;
   }
 });
-Object.defineProperty(exports, "StateController", {
+Object.defineProperty(exports, "ViewController", {
   enumerable: true,
   get: function get() {
-    return _state.default;
+    return _view.default;
   }
@@ -30,0 +30,0 @@ });

lib/graph/controller/item.js

@@ -30,3 +30,5 @@ "use strict";
 
-var ItemController = function () {
+var ItemController =
+/** @class */
+function () {
   function ItemController(graph) {
@@ -298,3 +300,3 @@ var _this = this;
       var edges_1 = item.getEdges();
-      var refreshEdge = updateType === 'bbox' || updateType === 'move';
+      var refreshEdge = (updateType === null || updateType === void 0 ? void 0 : updateType.includes('bbox')) || updateType === 'move';
 
@@ -313,3 +315,3 @@ if (type === NODE) {
           (0, _util.each)(edges_1, function (edge) {
-            edge.refresh();
+            edge.refresh(updateType);
           });
@@ -599,3 +601,4 @@ }
 
-    if (item.hasState(stateName) === value && value || (0, _util.isString)(value) && item.hasState(stateName)) {
+    if (item.hasState(stateName) === value && value || // 当该状态已经存在且现在需要设置为 true 时，不需要继续。当该状态不存在，且设置为 false 时，需要继续
+    (0, _util.isString)(value) && item.hasState(stateName)) {
       // 当该状态 value 是字符串，且已经存在该状态，不需要继续
@@ -602,0 +605,0 @@ return;

lib/graph/controller/layout.js

@@ -14,3 +14,5 @@ "use strict";
 
-var LayoutController = function () {
+var LayoutController =
+/** @class */
+function () {
   function LayoutController(graph) {
@@ -17,0 +19,0 @@ this.graph = graph;

lib/graph/controller/mode.js

@@ -14,3 +14,5 @@ "use strict";
 
-var ModeController = function () {
+var ModeController =
+/** @class */
+function () {
   function ModeController(graph) {
@@ -17,0 +19,0 @@ this.graph = graph;

lib/graph/controller/state.js

@@ -12,3 +12,5 @@ "use strict";
 
-var StateController = function () {
+var StateController =
+/** @class */
+function () {
   function StateController(graph) {
@@ -15,0 +17,0 @@ this.graph = graph;

lib/graph/controller/view.d.ts

 import { Point } from '@antv/g-base';
-import { Item, GraphAnimateConfig } from '../../types';
+import { Item, GraphAnimateConfig, FitViewRules } from '../../types';
 import { IAbstractGraph } from '../../interface/graph';
@@ -11,2 +11,3 @@ export default class ViewController {
     fitView(): void;
+    fitViewByRules(rules: FitViewRules): void;
     getFormatPadding(): number[];
@@ -13,0 +14,0 @@ focusPoint(point: Point, animate?: boolean, animateCfg?: GraphAnimateConfig): void;

lib/graph/controller/view.js

@@ -16,3 +16,5 @@ "use strict";
 
-var ViewController = function () {
+var ViewController =
+/** @class */
+function () {
   function ViewController(graph) {
@@ -77,2 +79,54 @@ this.destroyed = false;
     }
+  }; // fit view graph by rule
+
+
+  ViewController.prototype.fitViewByRules = function (rules) {
+    var _a = rules.onlyOutOfViewPort,
+        onlyOutOfViewPort = _a === void 0 ? false : _a,
+        _b = rules.direction,
+        direction = _b === void 0 ? 'both' : _b,
+        _c = rules.ratioRule,
+        ratioRule = _c === void 0 ? 'min' : _c;
+    var graph = this.graph;
+    var padding = this.getFormatPadding();
+    var width = graph.get('width');
+    var height = graph.get('height');
+    var group = graph.get('group');
+    group.resetMatrix();
+    var bbox = group.getCanvasBBox();
+    if (bbox.width === 0 || bbox.height === 0) return;
+    var viewCenter = this.getViewCenter();
+    var groupCenter = {
+      x: bbox.x + bbox.width / 2,
+      y: bbox.y + bbox.height / 2
+    };
+    graph.translate(viewCenter.x - groupCenter.x, viewCenter.y - groupCenter.y);
+    var wRatio = (width - padding[1] - padding[3]) / bbox.width;
+    var hRatio = (height - padding[0] - padding[2]) / bbox.height;
+    var ratio;
+
+    if (direction === 'x') {
+      ratio = wRatio;
+    } else if (direction === 'y') {
+      ratio = hRatio;
+    } else {
+      // ratioRule
+      ratio = ratioRule === 'max' ? Math.max(wRatio, hRatio) : Math.min(wRatio, hRatio);
+    } // 如果设置了仅对超出视口宽高的场景进行fitview，则没超出的场景zoom取1
+
+
+    if (onlyOutOfViewPort) {
+      ratio = ratio < 1 ? ratio : 1;
+    }
+
+    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');
+    }
+
+    graph.zoomTo(endZoom, viewCenter);
   };
@@ -79,0 +133,0 @@

lib/graph/graph.d.ts

@@ -6,3 +6,3 @@ import EventEmitter from '@antv/event-emitter';
 import { IEdge, INode, ICombo } from '../interface/item';
-import { GraphAnimateConfig, GraphOptions, EdgeConfig, GraphData, Item, ITEM_TYPE, ModelConfig, NodeConfig, NodeMap, Padding, TreeGraphData, ComboConfig, ModeOption, ModeType, States, HullCfg, IG6GraphEvent, IPoint } from '../types';
+import { GraphAnimateConfig, GraphOptions, EdgeConfig, GraphData, Item, ITEM_TYPE, ModelConfig, NodeConfig, NodeMap, Padding, TreeGraphData, ComboConfig, ModeOption, ModeType, States, HullCfg, IG6GraphEvent, IPoint, FitViewRules } from '../types';
 import Hull from '../item/hull';
@@ -174,4 +174,5 @@ export interface PrivateGraphOption extends GraphOptions {
      * @param {object} padding 四周围边距
+     * @param {FitViewRules} rules fitView的规则
      */
-    fitView(padding?: Padding): void;
+    fitView(padding?: Padding, rules?: FitViewRules): void;
     /**
@@ -178,0 +179,0 @@ * 调整视口适应视图，不缩放，仅将图 bbox 中心对齐到画布中心

lib/index.d.ts

@@ -1,2 +0,1 @@
-/// <reference types="_gl-matrix@3.3.0@gl-matrix" />
 import AbstractGraph from './graph/graph';
@@ -197,2 +196,3 @@ import Shape, { Arrow, Marker } from './element';
     };
+    windowFontFamily: string;
 };
@@ -386,2 +386,3 @@ export * from './types';
         };
+        windowFontFamily: string;
     };
@@ -427,3 +428,3 @@ Util: {
         }[];
-        getSpline: (points: import("./types").IPoint[]) => any[][];
+        getSpline: (points: import("./types").IPoint[]) => import("@antv/path-util/lib/types").PathCommand[];
         getControlPoint: (startPoint: import("./types").IPoint, endPoint: import("./types").IPoint, percent?: number, offset?: number) => import("./types").IPoint;
@@ -449,3 +450,4 @@ pointsToPolygon: (points: import("./types").IPoint[] | (string | {
             fontStyle: "normal" | "italic" | "oblique";
-            fontWeight?: number | "normal" | "bold" | "bolder" | "lighter";
+            fontFamily: string;
+            fontWeight: number | "bold" | "normal" | "bolder" | "lighter";
             fill: string;
@@ -461,2 +463,3 @@ rotateCenter: string;
             offset: number;
+            fillOpacity: number;
             background?: {
@@ -463,0 +466,0 @@ fill?: string;

lib/index.js

@@ -26,2 +26,8 @@ "use strict";
 };
+Object.defineProperty(exports, "AbstractEvent", {
+  enumerable: true,
+  get: function get() {
+    return _event.default;
+  }
+});
 Object.defineProperty(exports, "AbstractGraph", {
@@ -33,6 +39,6 @@ enumerable: true,
 });
-Object.defineProperty(exports, "Shape", {
+Object.defineProperty(exports, "AbstractLayout", {
   enumerable: true,
   get: function get() {
-    return _element.default;
+    return _layout.default;
   }
@@ -46,24 +52,25 @@ });
 });
-Object.defineProperty(exports, "Marker", {
+exports.BaseGlobal = void 0;
+Object.defineProperty(exports, "Combo", {
   enumerable: true,
   get: function get() {
-    return _element.Marker;
+    return _combo.default;
   }
 });
-Object.defineProperty(exports, "Util", {
+Object.defineProperty(exports, "Edge", {
   enumerable: true,
   get: function get() {
-    return _util.default;
+    return _edge.default;
   }
 });
-Object.defineProperty(exports, "AbstractLayout", {
+Object.defineProperty(exports, "Hull", {
   enumerable: true,
   get: function get() {
-    return _layout.default;
+    return _hull.default;
   }
 });
-Object.defineProperty(exports, "AbstractEvent", {
+Object.defineProperty(exports, "Marker", {
   enumerable: true,
   get: function get() {
-    return _event.default;
+    return _element.Marker;
   }
@@ -77,21 +84,15 @@ });
 });
-Object.defineProperty(exports, "Edge", {
+Object.defineProperty(exports, "Shape", {
   enumerable: true,
   get: function get() {
-    return _edge.default;
+    return _element.default;
   }
 });
-Object.defineProperty(exports, "Hull", {
+Object.defineProperty(exports, "Util", {
   enumerable: true,
   get: function get() {
-    return _hull.default;
+    return _util.default;
   }
 });
-Object.defineProperty(exports, "Combo", {
-  enumerable: true,
-  get: function get() {
-    return _combo.default;
-  }
-});
-exports.default = exports.BaseGlobal = exports.registerBehavior = exports.registerEdge = exports.registerCombo = exports.registerNode = void 0;
+exports.registerNode = exports.registerEdge = exports.registerCombo = exports.registerBehavior = exports.default = void 0;
 
@@ -98,0 +99,0 @@ var _behavior = _interopRequireDefault(require("./behavior"));

lib/interface/behavior.js

@@ -12,3 +12,5 @@ "use strict";
 
-var G6GraphEvent = function (_super) {
+var G6GraphEvent =
+/** @class */
+function (_super) {
   (0, _tslib.__extends)(G6GraphEvent, _super);
@@ -15,0 +17,0 @@

lib/interface/graph.d.ts

 import EventEmitter from '@antv/event-emitter';
 import { IGroup, Point } from '@antv/g-base';
 import Graph from '../graph/graph';
-import { EdgeConfig, GraphData, Item, ITEM_TYPE, ModelConfig, NodeConfig, Padding, TreeGraphData, LayoutConfig, GraphOptions, ModeOption, ModeType, ComboConfig, GraphAnimateConfig, StackData, HullCfg, IG6GraphEvent, IPoint } from '../types';
+import { EdgeConfig, GraphData, Item, ITEM_TYPE, ModelConfig, NodeConfig, Padding, TreeGraphData, LayoutConfig, GraphOptions, ModeOption, ModeType, ComboConfig, GraphAnimateConfig, StackData, HullCfg, IG6GraphEvent, IPoint, FitViewRules } from '../types';
 import { IEdge, INode, ICombo } from './item';
@@ -133,4 +133,5 @@ import Hull from '../item/hull';
      * @param {Padding} padding 四周围边距
+     * @param {FitViewRules} rules fitView的规则
      */
-    fitView: (padding?: Padding) => void;
+    fitView: (padding?: Padding, rules?: FitViewRules) => void;
     /**
@@ -137,0 +138,0 @@ * 调整视口适应视图，不缩放，仅将图 bbox 中心对齐到画布中心

lib/interface/shape.d.ts

 import { IGroup, IShape } from '@antv/g-base';
-import { IPoint, Item, LabelStyle, ModelConfig } from '../types';
+import { IPoint, Item, LabelStyle, ModelConfig, UpdateType } from '../types';
 export declare type ILabelConfig = Partial<{
@@ -54,3 +54,3 @@ position: string;
     getAnchorPoints: (cfg?: ModelConfig) => number[][] | undefined;
-    update: (cfg: ModelConfig, item: Item) => void;
+    update: (cfg: ModelConfig, item: Item, updateType?: UpdateType) => void;
     getSize: (cfg: ModelConfig) => number[];
@@ -57,0 +57,0 @@ _getTextAlign: (labelPosition: string, angle: number) => string;

lib/item/combo.js

@@ -25,3 +25,5 @@ "use strict";
 
-var Combo = function (_super) {
+var Combo =
+/** @class */
+function (_super) {
   (0, _tslib.__extends)(Combo, _super);
@@ -298,2 +300,3 @@
 
+      group['shapeMap'] = {};
       this.clearCache();
@@ -300,0 +303,0 @@ this.set(CACHE_SIZE, null);

lib/item/edge.js

@@ -26,3 +26,5 @@ "use strict";
 
-var Edge = function (_super) {
+var Edge =
+/** @class */
+function (_super) {
   (0, _tslib.__extends)(Edge, _super);
@@ -180,3 +182,3 @@
 
-    var cfg = updateType === 'move' ? model : _super.prototype.getShapeCfg.call(this, model);
+    var cfg = (updateType === null || updateType === void 0 ? void 0 : updateType.includes('move')) ? model : _super.prototype.getShapeCfg.call(this, model);
 
@@ -183,0 +185,0 @@ if (linkCenter) {

lib/item/hull.js

@@ -28,3 +28,5 @@ "use strict";
  */
-var Hull = function () {
+var Hull =
+/** @class */
+function () {
   function Hull(graph, cfg) {
@@ -131,3 +133,4 @@ this.cfg = (0, _util.deepMix)(this.getDefaultCfg(), cfg);
       id: this.id,
-      name: this.cfg.id
+      name: this.cfg.id,
+      capture: false
     });
@@ -134,0 +137,0 @@ this.group.toBack();

lib/item/item.js

@@ -26,3 +26,5 @@ "use strict";
 
-var ItemBase = function () {
+var ItemBase =
+/** @class */
+function () {
   function ItemBase(cfg) {
@@ -212,17 +214,18 @@ this._cfg = {};
       // 第一次 set originStyle，直接拿首次渲染所有图形的 attrs
-      var originStyles_1 = {};
-      (0, _util.each)(children, function (child) {
+      var originStyles = {};
+
+      for (var i = 0; i < children.length; i++) {
+        var child = children[i];
         var shapeType = child.get('type');
-        var name = child.get('name');
+        var name_1 = child.get('name');
 
-        if (name && name !== keyShapeName) {
-          originStyles_1[name] = shapeType !== 'image' ? (0, _util.clone)(child.attr()) : self.getShapeStyleByName(name); // The text's position and matrix is not allowed to be affected by states
+        if (name_1 && name_1 !== keyShapeName) {
+          originStyles[name_1] = shapeType !== 'image' ? (0, _util.clone)(child.attr()) : self.getShapeStyleByName(name_1); // The text's position and matrix is not allowed to be affected by states
 
-          if (originStyles_1[name] && shapeType === 'text') {
-            delete originStyles_1[name].x;
-            delete originStyles_1[name].y;
-            delete originStyles_1[name].matrix;
+          if (shapeType === 'text' && originStyles[name_1]) {
+            delete originStyles[name_1].x;
+            delete originStyles[name_1].y;
+            delete originStyles[name_1].matrix;
           }
         } else {
-          // !name || name === keyShape
           var keyShapeStyle = self.getShapeStyleByName(); // 可优化，需要去除 child.attr 中其他 shape 名的对象
@@ -234,33 +237,36 @@
           if (!keyShapeName) {
-            Object.assign(originStyles_1, keyShapeStyle);
+            Object.assign(originStyles, keyShapeStyle);
           } else {
             // 若 keyShape 有 name 且 !name，这个图形不是 keyShape，给这个图形一个 name
-            if (!name) {
+            if (!name_1) {
               var shapeName = (0, _base.uniqueId)('shape');
               child.set('name', shapeName);
-              originStyles_1[shapeName] = shapeType !== 'image' ? (0, _util.clone)(child.attr()) : self.getShapeStyleByName(name);
+              group['shapeMap'][shapeName] = child;
+              originStyles[shapeName] = shapeType !== 'image' ? (0, _util.clone)(child.attr()) : self.getShapeStyleByName(name_1);
             } else {
-              originStyles_1[keyShapeName] = keyShapeStyle;
+              originStyles[keyShapeName] = keyShapeStyle;
             }
           }
         }
-      });
-      self.set('originStyle', originStyles_1);
+      }
+
+      self.set('originStyle', originStyles);
     } else {
       // 第二次 set originStyles，需要找到不是 stateStyles 的样式，更新到 originStyles 中
       // 上一次设置的 originStyle，是初始的 shape attrs
-      var styles_1 = this.getOriginStyle(); // let styles: ShapeStyle = {};
+      var styles_1 = this.get('originStyle'); // let styles: ShapeStyle = {};
 
       if (keyShapeName && !styles_1[keyShapeName]) styles_1[keyShapeName] = {}; // 获取当前状态样式
 
-      var currentStatesStyle_1 = this.getCurrentStatesStyle(); // 遍历当前所有图形的 attrs，找到不是 stateStyles 的样式更新到 originStyles 中
+      var currentStatesStyle_1 = this.getCurrentStatesStyle();
 
-      (0, _util.each)(children, function (child) {
-        var name = child.get('name');
+      var _loop_1 = function _loop_1(i) {
+        var child = children[i];
+        var name_2 = child.get('name');
         var shapeAttrs = child.attr();
 
-        if (name && name !== keyShapeName) {
+        if (name_2 && name_2 !== keyShapeName) {
           // 有 name 的非 keyShape 图形
-          var shapeStateStyle_1 = currentStatesStyle_1[name];
-          if (!styles_1[name]) styles_1[name] = {};
+          var shapeStateStyle_1 = currentStatesStyle_1[name_2];
+          if (!styles_1[name_2]) styles_1[name_2] = {};
 
@@ -270,6 +276,6 @@ if (shapeStateStyle_1) {
               var value = shapeAttrs[key];
-              if (value !== shapeStateStyle_1[key]) styles_1[name][key] = value;
+              if (value !== shapeStateStyle_1[key]) styles_1[name_2][key] = value;
             });
           } else {
-            styles_1[name] = child.get('type') !== 'image' ? (0, _util.clone)(shapeAttrs) : self.getShapeStyleByName(name);
+            styles_1[name_2] = child.get('type') !== 'image' ? (0, _util.clone)(shapeAttrs) : self.getShapeStyleByName(name_2);
           }
@@ -282,3 +288,3 @@ } else {
 
-            if (!(0, _util.isPlainObject)(subStyle) || styleKey === keyShapeName) {
+            if (styleKey === keyShapeName || !(0, _util.isPlainObject)(subStyle)) {
               keyShapeStateStyles_1[styleKey] = subStyle;
@@ -296,8 +302,14 @@ }
         }
-      });
-      if (styles_1.path) delete styles_1.path;
-      if (styles_1.matrix) delete styles_1.matrix;
-      if (styles_1.x) delete styles_1.x;
-      if (styles_1.y) delete styles_1.y;
+      }; // 遍历当前所有图形的 attrs，找到不是 stateStyles 的样式更新到 originStyles 中
 
+
+      for (var i = 0; i < children.length; i++) {
+        _loop_1(i);
+      }
+
+      delete styles_1.path;
+      delete styles_1.matrix;
+      delete styles_1.x;
+      delete styles_1.y;
+
       if (styles_1[keyShapeName]) {
@@ -406,5 +418,3 @@ delete styles_1[keyShapeName].x;
     if (name) {
-      currentShape = group.find(function (element) {
-        return element.get('name') === name;
-      });
+      currentShape = group['shapeMap'][name]; // group.find((element) => element.get('name') === name) as IShapeBase;
     } else {
@@ -466,3 +476,3 @@ currentShape = this.getKeyShape();
     if (!states || !states.length) {
-      return this.getOriginStyle();
+      return this.get('originStyle');
     }
@@ -699,3 +709,3 @@
 
-      this.updateShape();
+      this.updateShape(updateType);
     }
@@ -878,2 +888,3 @@
 
+      group['shapeMap'] = {};
       this.clearCache();
@@ -880,0 +891,0 @@ group.remove();

lib/item/node.js

@@ -21,3 +21,5 @@ "use strict";
 
-var Node = function (_super) {
+var Node =
+/** @class */
+function (_super) {
   (0, _tslib.__extends)(Node, _super);
@@ -273,6 +275,3 @@
     var index = edges.indexOf(edge);
-
-    if (index > -1) {
-      edges.splice(index, 1);
-    }
+    if (index > -1) edges.splice(index, 1);
   };
@@ -294,6 +293,3 @@
 
-    if (!cfg) {
-      return undefined;
-    }
-
+    if (!cfg) return undefined;
     var existX = !(0, _util.isNil)(cfg.x);
@@ -304,11 +300,6 @@ var existY = !(0, _util.isNil)(cfg.y);
 
-    if (keys.length === 1 && (existX || existY) || keys.length === 2 && existX && existY) {
-      return 'move';
-    }
-
-    if ((0, _util.isNumber)(cfg.x) || (0, _util.isNumber)(cfg.y) || cfg.type || cfg.anchorPoints || cfg.size || (cfg === null || cfg === void 0 ? void 0 : cfg.style) && (((_a = cfg === null || cfg === void 0 ? void 0 : cfg.style) === null || _a === void 0 ? void 0 : _a.r) || ((_b = cfg === null || cfg === void 0 ? void 0 : cfg.style) === null || _b === void 0 ? void 0 : _b.width) || ((_c = cfg === null || cfg === void 0 ? void 0 : cfg.style) === null || _c === void 0 ? void 0 : _c.height) || ((_d = cfg === null || cfg === void 0 ? void 0 : cfg.style) === null || _d === void 0 ? void 0 : _d.rx) || ((_e = cfg === null || cfg === void 0 ? void 0 : cfg.style) === null || _e === void 0 ? void 0 : _e.ry))) {
-      return 'bbox';
-    }
-
-    return 'style';
+    if (keys.length === 1 && (existX || existY) || keys.length === 2 && existX && existY) return 'move';
+    if ((0, _util.isNumber)(cfg.x) || (0, _util.isNumber)(cfg.y) || cfg.type || cfg.anchorPoints || cfg.size || (cfg === null || cfg === void 0 ? void 0 : cfg.style) && (((_a = cfg === null || cfg === void 0 ? void 0 : cfg.style) === null || _a === void 0 ? void 0 : _a.r) || ((_b = cfg === null || cfg === void 0 ? void 0 : cfg.style) === null || _b === void 0 ? void 0 : _b.width) || ((_c = cfg === null || cfg === void 0 ? void 0 : cfg.style) === null || _c === void 0 ? void 0 : _c.height) || ((_d = cfg === null || cfg === void 0 ? void 0 : cfg.style) === null || _d === void 0 ? void 0 : _d.rx) || ((_e = cfg === null || cfg === void 0 ? void 0 : cfg.style) === null || _e === void 0 ? void 0 : _e.ry))) return 'bbox|label';
+    var updateLabel = keys.includes('label') || keys.includes('labelCfg');
+    return updateLabel ? 'style|label' : 'style';
   };
@@ -315,0 +306,0 @@

lib/types/index.d.ts

@@ -7,3 +7,3 @@ import { IGroup, Event as GraphEvent, BBox, AnimateCfg, ICanvas, IShape } from '@antv/g-base';
 export * from '../interface';
-export declare type UpdateType = 'move' | 'bbox' | 'style' | undefined;
+export declare type UpdateType = 'move' | 'bbox' | 'style' | 'bbox|label' | 'style|label' | undefined;
 export declare type Item = INode | IEdge | ICombo;
@@ -300,3 +300,4 @@ export interface IG6GraphEvent extends GraphEvent {
     fontStyle: 'normal' | 'italic' | 'oblique';
-    fontWeight?: 'normal' | 'bold' | 'bolder' | 'lighter' | number;
+    fontFamily: string;
+    fontWeight: 'normal' | 'bold' | 'bolder' | 'lighter' | number;
     fill: string | null;
@@ -312,2 +313,3 @@ rotateCenter: string;
     offset: number;
+    fillOpacity: number;
     background?: {
@@ -722,1 +724,6 @@ fill?: string;
 }
+export interface FitViewRules {
+    onlyOutOfViewPort?: boolean;
+    direction?: 'x' | 'y' | 'both';
+    ratioRule?: 'max' | 'min';
+}

lib/util/base.js

@@ -6,3 +6,3 @@ "use strict";
 });
-exports.processParallelEdges = exports.calculationItemsBBox = exports.isNaN = exports.isViewportChanged = exports.cloneEvent = exports.formatPadding = exports.uniqueId = void 0;
+exports.uniqueId = exports.processParallelEdges = exports.isViewportChanged = exports.isNaN = exports.formatPadding = exports.cloneEvent = exports.calculationItemsBBox = void 0;
 
@@ -26,20 +26,30 @@ var _util = require("@antv/util");
 var formatPadding = function formatPadding(padding) {
-  var top = 0;
-  var left = 0;
-  var right = 0;
-  var bottom = 0;
+  if ((0, _util.isArray)(padding)) {
+    switch (padding.length) {
+      case 4:
+        return padding;
 
+      case 3:
+        padding.push(padding[1]);
+        return padding;
+
+      case 2:
+        return padding.concat(padding);
+
+      case 1:
+        return [padding[0], padding[0], padding[0], padding[0]];
+
+      default:
+        return [0, 0, 0, 0];
+    }
+  }
+
   if ((0, _util.isNumber)(padding)) {
-    top = left = right = bottom = padding;
+    return [padding, padding, padding, padding];
   } else if ((0, _util.isString)(padding)) {
     var intPadding = parseInt(padding, 10);
-    top = left = right = bottom = intPadding;
-  } else if ((0, _util.isArray)(padding)) {
-    top = padding[0];
-    right = !(0, _util.isNil)(padding[1]) ? padding[1] : padding[0];
-    bottom = !(0, _util.isNil)(padding[2]) ? padding[2] : padding[0];
-    left = !(0, _util.isNil)(padding[3]) ? padding[3] : right;
+    return [intPadding, intPadding, intPadding, intPadding];
   }
 
-  return [top, right, bottom, left];
+  return [0, 0, 0, 0];
 };
@@ -46,0 +56,0 @@ /**

lib/util/graphic.js

@@ -6,3 +6,3 @@ "use strict";
 });
-exports.cloneBesidesImg = exports.shouldRefreshEdge = exports.getComboBBox = exports.reconstructTree = exports.plainCombosToTrees = exports.getTextSize = exports.getLetterWidth = exports.traverseTreeUp = exports.traverseTree = exports.getLabelPosition = exports.getLoopCfgs = exports.getBBox = void 0;
+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;
 
@@ -9,0 +9,0 @@ var _tslib = require("tslib");

lib/util/index.d.ts

@@ -1,2 +0,1 @@
-/// <reference types="_gl-matrix@3.3.0@gl-matrix" />
 import * as MathUtil from './math';
@@ -43,3 +42,3 @@ import { ext, mat3 } from '@antv/matrix-util';
     }[];
-    getSpline: (points: import("..").IPoint[]) => any[][];
+    getSpline: (points: import("..").IPoint[]) => import("@antv/path-util/lib/types").PathCommand[];
     getControlPoint: (startPoint: import("..").IPoint, endPoint: import("..").IPoint, percent?: number, offset?: number) => import("..").IPoint;
@@ -65,3 +64,4 @@ pointsToPolygon: (points: import("..").IPoint[] | (string | {
         fontStyle: "normal" | "italic" | "oblique";
-        fontWeight?: number | "normal" | "bold" | "bolder" | "lighter";
+        fontFamily: string;
+        fontWeight: number | "bold" | "normal" | "bolder" | "lighter";
         fill: string;
@@ -77,2 +77,3 @@ rotateCenter: string;
         offset: number;
+        fillOpacity: number;
         background?: {
@@ -79,0 +80,0 @@ fill?: string;

lib/util/math.js

@@ -6,3 +6,3 @@ "use strict";
 });
-exports.pointLineDistance = exports.pointRectSquareDist = exports.isPointsOverlap = exports.pointLineSquareDist = exports.squareDist = exports.getPointsCenter = exports.fractionToLine = exports.itemIntersectByLine = exports.getBBoxBoundLine = exports.Line = exports.isPolygonsIntersect = exports.intersectBBox = exports.isPointInPolygon = exports.getDegree = exports.rotate = exports.scale = exports.move = exports.translate = exports.getAdjMatrix = exports.floydWarshall = exports.scaleMatrix = exports.distance = exports.getCircleCenterByPoints = exports.invertMatrix = exports.applyMatrix = exports.getEllipseIntersectByPoint = exports.getCircleIntersectByPoint = exports.getRectIntersectByPoint = exports.getLineIntersect = exports.compare = void 0;
+exports.translate = exports.squareDist = exports.scaleMatrix = exports.scale = exports.rotate = exports.pointRectSquareDist = exports.pointLineSquareDist = exports.pointLineDistance = exports.move = 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;
 
@@ -155,14 +155,11 @@ var _matrixUtil = require("@antv/matrix-util");
   var dy = y - cy;
-  var d = Math.sqrt(dx * dx + dy * dy);
 
-  if (d < r) {
+  if (dx * dx + dy * dy < r * r) {
     return null;
   }
 
-  var signX = Math.sign(dx);
-  var signY = Math.sign(dy);
   var angle = Math.atan(dy / dx);
   return {
-    x: cx + Math.abs(r * Math.cos(angle)) * signX,
-    y: cy + Math.abs(r * Math.sin(angle)) * signY
+    x: cx + Math.abs(r * Math.cos(angle)) * Math.sign(dx),
+    y: cy + Math.abs(r * Math.sin(angle)) * Math.sign(dy)
   };
@@ -721,3 +718,5 @@ };
 
-var Line = function () {
+var Line =
+/** @class */
+function () {
   function Line(x1, y1, x2, y2) {
@@ -724,0 +723,0 @@ this.x1 = x1;

lib/util/path.d.ts

@@ -7,3 +7,3 @@ import { vec2 } from '@antv/matrix-util';
  */
-export declare const getSpline: (points: IPoint[]) => any[][];
+export declare const getSpline: (points: IPoint[]) => import("@antv/path-util/lib/types").PathCommand[];
 /**
@@ -10,0 +10,0 @@ * 根据起始点、相对位置、偏移量计算控制点

lib/util/path.js

@@ -6,5 +6,6 @@ "use strict";
 });
+exports.getSpline = exports.getControlPoint = exports.getClosedSpline = void 0;
+exports.paddedHull = paddedHull;
+exports.pointsToPolygon = exports.pathToPoints = void 0;
 exports.roundedHull = roundedHull;
-exports.paddedHull = paddedHull;
-exports.getClosedSpline = exports.pathToPoints = exports.pointsToPolygon = exports.getControlPoint = exports.getSpline = void 0;
 
@@ -11,0 +12,0 @@ var _matrixUtil = require("@antv/matrix-util");

lib/util/validation.js

@@ -23,3 +23,5 @@ "use strict";
 var dataValidation = function dataValidation(data) {
-  // 1. 必须传入数据
+  var _a; // 1. 必须传入数据
+
+
   if (!data) {
@@ -33,4 +35,4 @@ console.error('G6 Error Tips: the data must be defined');
       edges = data.edges,
-      _a = data.combos,
-      combos = _a === void 0 ? [] : _a;
+      _b = data.combos,
+      combos = _b === void 0 ? [] : _b;
 
@@ -64,6 +66,6 @@ if (!nodes && !edges) {
   });
-  var comboIds = combos.map(function (combo) {
+  var comboIds = (_a = combos) === null || _a === void 0 ? void 0 : _a.map(function (combo) {
     return combo.id;
   });
-  var ids = (0, _tslib.__spreadArray)((0, _tslib.__spreadArray)([], nodeIds), comboIds);
+  var ids = (0, _tslib.__spreadArray)((0, _tslib.__spreadArray)([], nodeIds, true), comboIds, true);
   var nonEdges = (edges || []).find(function (edge) {
@@ -70,0 +72,0 @@ return !ids.includes(edge.source) || !ids.includes(edge.target);

package.json

 {
   "name": "@antv/g6-core",
-  "version": "0.3.11",
+  "version": "0.4.0-beta.0",
   "description": "A Graph Visualization Framework in JavaScript",
@@ -66,3 +66,3 @@ "keywords": [
     "@antv/g-math": "^0.1.1",
-    "@antv/matrix-util": "^3.1.0-beta.2",
+    "@antv/matrix-util": "^3.1.0-beta.3",
     "@antv/path-util": "^2.0.3",
@@ -97,4 +97,5 @@ "@antv/util": "~2.0.5",
     "ts-loader": "^7.0.3",
-    "typescript": "^3.9.5"
+    "typescript": "^3.9.5",
+    "stats-js": "^1.0.1"
   }
 }

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

Worsened metrics

Total package byte prevSize

1035244

decreased by-7.45%

Dev dependency count

25

increased by4.17%

Number of package files

197

decreased by-2.96%

Lines of code

30568

decreased by-8.06%

Dependency changes

• Updated@antv/matrix-util@^3.1.0-beta.3