fix: type for draw function in elements, closes: #4395 (#4398)

* fix: type for draw function in elements, closes: #4395 * fix: force2 with webworker, closes: #4394 * fix: excludeInvisibles with collapse-expand behavior problem; * chore: update version nums * fix: tooltip top position error (#4411) fix: tooltip top position error --------- Co-authored-by: hipi <[email protected]>
antvis · Apr 8, 2023 · a31c45d · a31c45d
1 parent 34eae7d
commit a31c45d
Show file tree

Hide file tree

Showing 18 changed files with 52 additions and 36 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,11 @@
 # ChangeLog
 
+### 4.8.9
+
+- fix: type for draw function in elements, closes: #4395;
+- fix: force2 with webworker, closes: #4394;
+- fix: excludeInvisibles with collapse-expand behavior problem;
+
 ### 4.8.8
 
 - feat: preset layout with gpu layout;

diff --git a/packages/core/package.json b/packages/core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@antv/g6-core",
-  "version": "0.8.8",
+  "version": "0.8.9",
   "description": "A Graph Visualization Framework in JavaScript",
   "keywords": [
     "antv",

diff --git a/packages/core/src/global.ts b/packages/core/src/global.ts
@@ -64,7 +64,7 @@ const colorSet = {
 };
 
 export default {
-  version: '0.8.8',
+  version: '0.8.9',
   rootContainerClassName: 'root-container',
   nodeContainerClassName: 'node-container',
   edgeContainerClassName: 'edge-container',

diff --git a/packages/core/src/interface/shape.ts b/packages/core/src/interface/shape.ts
@@ -31,7 +31,7 @@ export type ShapeOptions = Partial<{
   /**
    * 绘制
    */
-  draw: (cfg?: ModelConfig, group?: IGroup) => IShape;
+  draw: (cfg: ModelConfig, group: IGroup) => IShape;
 
   getCustomConfig: (cfg: ModelConfig) => ModelConfig;
   drawShape: (cfg?: ModelConfig, group?: IGroup) => IShape;

diff --git a/packages/element/package.json b/packages/element/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@antv/g6-element",
-  "version": "0.8.8",
+  "version": "0.8.9",
   "description": "A Graph Visualization Framework in JavaScript",
   "keywords": [
     "antv",
@@ -61,7 +61,7 @@
   },
   "dependencies": {
     "@antv/g-base": "^0.5.1",
-    "@antv/g6-core": "0.8.8",
+    "@antv/g6-core": "0.8.9",
     "@antv/util": "~2.0.5"
   },
   "devDependencies": {

diff --git a/packages/g6/package.json b/packages/g6/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@antv/g6",
-  "version": "4.8.8",
+  "version": "4.8.9",
   "description": "A Graph Visualization Framework in JavaScript",
   "keywords": [
     "antv",
@@ -66,7 +66,7 @@
     ]
   },
   "dependencies": {
-    "@antv/g6-pc": "0.8.8"
+    "@antv/g6-pc": "0.8.9"
   },
   "devDependencies": {
     "@babel/core": "^7.7.7",

diff --git a/packages/g6/src/index.ts b/packages/g6/src/index.ts
@@ -1,7 +1,7 @@
 import G6 from '@antv/g6-pc';
 
-G6.version = '4.8.8';
+G6.version = '4.8.9';
 
 export * from '@antv/g6-pc';
 export default G6;
-export const version = '4.8.8';
+export const version = '4.8.9';
diff --git a/packages/pc/package.json b/packages/pc/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@antv/g6-pc",
-  "version": "0.8.8",
+  "version": "0.8.9",
   "description": "A Graph Visualization Framework in JavaScript",
   "keywords": [
     "antv",
@@ -75,8 +75,8 @@
     "@antv/g-canvas": "^0.5.2",
     "@antv/g-math": "^0.1.1",
     "@antv/g-svg": "^0.5.1",
-    "@antv/g6-core": "0.8.8",
-    "@antv/g6-element": "0.8.8",
+    "@antv/g6-core": "0.8.9",
+    "@antv/g6-element": "0.8.9",
     "@antv/g6-plugin": "^0.8.7",
     "@antv/hierarchy": "^0.6.10",
     "@antv/layout": "^0.3.0",

diff --git a/packages/pc/src/global.ts b/packages/pc/src/global.ts
@@ -7,7 +7,7 @@ const textColor = 'rgb(0, 0, 0)';
 const colorSet = getColorsWithSubjectColor(subjectColor, backColor);
 
 export default {
-  version: '0.8.8',
+  version: '0.8.9',
   rootContainerClassName: 'root-container',
   nodeContainerClassName: 'node-container',
   edgeContainerClassName: 'edge-container',

diff --git a/packages/pc/src/graph/tree-graph.ts b/packages/pc/src/graph/tree-graph.ts
@@ -343,26 +343,31 @@ export default class TreeGraph extends Graph implements ITreeGraph {
     let layoutData = data;
     if (layoutConfig?.excludeInvisibles) {
       data = clone(self.get('data'));
+      const cacheChidMap = {}
       traverseTree<TreeGraphData>(data, subTree => {
         const siblings = subTree.children;
         if (!siblings?.length) return true;
         for (let i = siblings.length - 1; i >= 0; i--) {
           const node = this.findById(siblings[i].id);
-          let isHidden = node ? !node.isVisible() : siblings[i].visible === false;
-          if (isHidden) siblings.splice(i, 1);
+          const isHidden = node ? !node.isVisible() : siblings[i].visible === false;
+          if (isHidden) {
+            cacheChidMap[subTree.id] = cacheChidMap[subTree.id] || [];
+            cacheChidMap[subTree.id].push({
+              idx: i,
+              child: siblings.splice(i, 1)[0],
+            });
+          }
         }
       });
       layoutData = layoutMethod ? layoutMethod(data, self.get('layout')) : data;
       traverseTree<TreeGraphData>(layoutData, subTree => {
-        const node = this.findDataById(subTree.id);
-        if (!node) return;
-        node.data = subTree.data;
-        node.x = subTree.x;
-        node.y = subTree.y;
-      });
-      layoutData = self.get('data');
-      traverseTree<TreeGraphData>(layoutData, subTree => {
-        if (!subTree.data) subTree.data = { ...subTree }
+        const cachedItems = cacheChidMap[subTree.id];
+        if (cachedItems?.length) {
+          for (let i = cachedItems.length - 1; i >= 0; i --) {
+            const { idx, child } = cachedItems[i];
+            subTree.children.splice(idx, 0, child);
+          }
+        }
       });
     } else {
       layoutData = layoutMethod ? layoutMethod(data, self.get('layout')) : data;

diff --git a/packages/pc/src/layout/worker/layout.ts b/packages/pc/src/layout/worker/layout.ts
@@ -29,6 +29,8 @@ export const LayoutWorker = (
     // @ts-ignore
     layout.registerLayout('force', layout.ForceLayout);
     // @ts-ignore
+    layout.registerLayout('force2', layout.Force2Layout);
+    // @ts-ignore
     layout.registerLayout('circular', layout.CircularLayout);
     // @ts-ignore
     layout.registerLayout('dagre', layout.DagreLayout);

diff --git a/packages/plugin/package.json b/packages/plugin/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@antv/g6-plugin",
-  "version": "0.8.8",
+  "version": "0.8.9",
   "description": "G6 Plugin",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -22,8 +22,8 @@
     "@antv/g-base": "^0.5.1",
     "@antv/g-canvas": "^0.5.2",
     "@antv/g-svg": "^0.5.2",
-    "@antv/g6-core": "0.8.8",
-    "@antv/g6-element": "0.8.8",
+    "@antv/g6-core": "0.8.9",
+    "@antv/g6-element": "0.8.9",
     "@antv/matrix-util": "^3.1.0-beta.3",
     "@antv/scale": "^0.3.4",
     "@antv/util": "^2.0.9",

diff --git a/packages/plugin/src/timeBar/index.ts b/packages/plugin/src/timeBar/index.ts
@@ -393,7 +393,7 @@ export default class TimeBar extends Base {
         graph.getEdges().forEach(edge => currentEdgeExistMap[edge.getID()] = true);
 
         if (filterItemTypes.includes('node')) {
-          originNodes.forEach((node: any) => {
+          originNodes?.forEach((node: any) => {
             const date = +(getDate?.(node) || node.date);
             const hitRange = (date >= minDate && date <= maxDate) || shouldIgnore?.('node', node, { min: minDate, max: maxDate });
             const exist = currentNodeExistMap[node.id];

diff --git a/packages/plugin/src/tooltip/index.ts b/packages/plugin/src/tooltip/index.ts
@@ -257,6 +257,9 @@ export default class Tooltip extends Base {
 
     if (y + bbox.height + offsetY > height) {
       res.y -= bbox.height + offsetY;
+      if (res.y < 0) {
+        res.y = 0
+      }
     }
 
     modifyCSS(tooltip, {

diff --git a/packages/site/docs/manual/middle/elements/combos/custom-combo.en.md b/packages/site/docs/manual/middle/elements/combos/custom-combo.en.md
@@ -115,8 +115,8 @@ G6.registerCombo(
       const rect = group.addShape('rect', {
         attrs: {
           ...style,
-          x: -style.width / 2 - (cfg.padding[3] - cfg.padding[1]) / 2,
-          y: -style.height / 2 - (cfg.padding[0] - cfg.padding[2]) / 2,
+          x: -style.width / 2 - padding[3],
+          y: -style.height / 2 - padding[0],
           width: style.width,
           height: style.height,
         },

diff --git a/packages/site/docs/manual/middle/elements/combos/custom-combo.zh.md b/packages/site/docs/manual/middle/elements/combos/custom-combo.zh.md
@@ -106,8 +106,8 @@ G6.registerCombo(
       const rect = group.addShape('rect', {
         attrs: {
           ...style,
-          x: -style.width / 2 - (cfg.padding[3] - cfg.padding[1]) / 2,
-          y: -style.height / 2 - (cfg.padding[0] - cfg.padding[2]) / 2,
+          x: -style.height / 2 - padding[0],
+          y:  -style.width / 2 - padding[3],
           width: style.width,
           height: style.height,
         },

diff --git a/packages/site/examples/interaction/combo/demo/cRect.js b/packages/site/examples/interaction/combo/demo/cRect.js
@@ -41,8 +41,8 @@ G6.registerCombo(
       const rect = group.addShape('rect', {
         attrs: {
           ...style,
-          x: -style.width / 2 - (cfg.padding[3] - cfg.padding[1]) / 2,
-          y: -style.height / 2 - (cfg.padding[0] - cfg.padding[2]) / 2,
+          x: -style.width / 2 - padding[3],
+          y: -style.height / 2 - padding[0],
           width: style.width,
           height: style.height,
         },

diff --git a/packages/site/examples/item/customCombo/demo/cRect.js b/packages/site/examples/item/customCombo/demo/cRect.js
@@ -41,8 +41,8 @@ G6.registerCombo(
       const rect = group.addShape('rect', {
         attrs: {
           ...style,
-          x: -style.width / 2 - (cfg.padding[3] - cfg.padding[1]) / 2,
-          y: -style.height / 2 - (cfg.padding[0] - cfg.padding[2]) / 2,
+          x: -style.width / 2 - padding[3],
+          y: -style.height / 2 - padding[0],
           width: style.width,
           height: style.height,
         },