mirror of
https://gitee.com/antv/g6.git
synced 2024-11-29 18:28:19 +08:00
fix: implement onZoom as empty function for 3d node (#4647)
* fix: implement onZoom as empty function for 3d node * chore: refine * chore: lint
This commit is contained in:
Yanyan Wang
GitHub
parent
1cb99d0bbf
commit
7d6959ed1b
@ -69,7 +69,7 @@ G6 concentrates on the principle of 'good by default'. In addition, the custom m
|
||||
## Installation (5.0 Alpha)
|
||||
|
||||
```bash
|
||||
$ npm install @antv/g6@5.0.0-alpha.7
|
||||
$ npm install @antv/g6@5.0.0-alpha.8
|
||||
```
|
||||
|
||||
## Usage (5.0 Alpha)
|
||||
|
||||
@ -57,7 +57,7 @@ GIF 未完整加载，[点此看原图](https://mdn.alipayobjects.com/huamei_qa8
|
||||
## 安装 (5.0 Alpha)
|
||||
|
||||
```bash
|
||||
$ npm install @antv/g6@5.0.0-alpha.7
|
||||
$ npm install @antv/g6@5.0.0-alpha.8
|
||||
```
|
||||
|
||||
## 使用 (5.0 Alpha)
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@antv/g6",
|
||||
"version": "5.0.0-alpha.7",
|
||||
"version": "5.0.0-alpha.8",
|
||||
"description": "A Graph Visualization Framework in JavaScript",
|
||||
"keywords": [
|
||||
"antv",
|
||||
@ -15,10 +15,7 @@
|
||||
"bugs": {
|
||||
"url": "https://github.com/antvis/g6/issues"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/antvis/g6"
|
||||
},
|
||||
"repository": "git@github.com/antvis/g6.git",
|
||||
"license": "MIT",
|
||||
"author": "https://github.com/orgs/antvis/people",
|
||||
"main": "lib/index.js",
|
||||
@ -68,7 +65,6 @@
|
||||
"@antv/g-plugin-control": "^1.7.43",
|
||||
"@antv/g-svg": "^1.8.36",
|
||||
"@antv/g-webgl": "^1.7.44",
|
||||
"@antv/g6": "^4.8.13",
|
||||
"@antv/graphlib": "^2.0.0",
|
||||
"@antv/gui": "^0.5.0-alpha.16",
|
||||
"@antv/layout": "^1.2.0",
|
||||
@ -81,6 +77,7 @@
|
||||
"typedoc-plugin-markdown": "^3.14.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@antv/g6": "^4.8.13",
|
||||
"@types/jest": "^29.5.1",
|
||||
"@types/node": "13.11.1",
|
||||
"@typescript-eslint/eslint-plugin": "^4.18.0",
|
||||
|
||||
@ -189,4 +189,6 @@ export abstract class BaseNode3D extends BaseNode {
|
||||
): DisplayObject {
|
||||
return upsertShape3D(type, id, style as GShapeStyle, shapeMap, this.device);
|
||||
}
|
||||
|
||||
public onZoom = (shapeMap: NodeShapeMap, zoom: number) => {};
|
||||
}
|
||||
|
||||
@ -1,3 +1,3 @@
|
||||
export * from './circle';
|
||||
export * from './sphere';
|
||||
export * from './rect'
|
||||
export * from './rect';
|
||||
|
||||
@ -3,119 +3,122 @@ import { NodeDisplayModel } from '../../../types';
|
||||
import { State } from '../../../types/item';
|
||||
|
||||
import {
|
||||
NodeModelData,
|
||||
NodeShapeMap,
|
||||
NodeShapeStyles,
|
||||
NodeModelData,
|
||||
NodeShapeMap,
|
||||
NodeShapeStyles,
|
||||
} from '../../../types/node';
|
||||
import { BaseNode } from './base';
|
||||
|
||||
export class RectNode extends BaseNode {
|
||||
override defaultStyles = {
|
||||
keyShape: {
|
||||
x: 0,
|
||||
y: 0,
|
||||
width: 32,
|
||||
height: 32,
|
||||
},
|
||||
};
|
||||
mergedStyles: NodeShapeStyles;
|
||||
constructor(props) {
|
||||
super(props);
|
||||
// suggest to merge default styles like this to avoid style value missing
|
||||
// this.defaultStyles = mergeStyles([this.baseDefaultStyles, this.defaultStyles]);
|
||||
override defaultStyles = {
|
||||
keyShape: {
|
||||
x: 0,
|
||||
y: 0,
|
||||
width: 32,
|
||||
height: 32,
|
||||
},
|
||||
};
|
||||
mergedStyles: NodeShapeStyles;
|
||||
constructor(props) {
|
||||
super(props);
|
||||
// suggest to merge default styles like this to avoid style value missing
|
||||
// this.defaultStyles = mergeStyles([this.baseDefaultStyles, this.defaultStyles]);
|
||||
}
|
||||
|
||||
public override drawKeyShape(
|
||||
model: NodeDisplayModel,
|
||||
shapeMap: NodeShapeMap,
|
||||
diffData?: { previous: NodeModelData; current: NodeModelData },
|
||||
diffState?: { previous: State[]; current: State[] },
|
||||
): DisplayObject {
|
||||
return this.upsertShape(
|
||||
'rect',
|
||||
'keyShape',
|
||||
{
|
||||
...this.mergedStyles.keyShape,
|
||||
x:
|
||||
(this.mergedStyles.keyShape.x as number) -
|
||||
this.mergedStyles.keyShape.width / 2,
|
||||
y:
|
||||
(this.mergedStyles.keyShape.y as number) -
|
||||
this.mergedStyles.keyShape.height / 2,
|
||||
},
|
||||
shapeMap,
|
||||
model,
|
||||
);
|
||||
}
|
||||
|
||||
public draw(
|
||||
model: NodeDisplayModel,
|
||||
shapeMap: NodeShapeMap,
|
||||
diffData?: { previous: NodeModelData; current: NodeModelData },
|
||||
diffState?: { previous: State[]; current: State[] },
|
||||
): NodeShapeMap {
|
||||
const { data = {} } = model;
|
||||
let shapes: NodeShapeMap = { keyShape: undefined };
|
||||
|
||||
// keyShape
|
||||
shapes.keyShape = this.drawKeyShape(model, shapeMap, diffData);
|
||||
|
||||
// labelShape
|
||||
if (data.labelShape) {
|
||||
shapes.labelShape = this.drawLabelShape(model, shapeMap, diffData);
|
||||
}
|
||||
|
||||
public override drawKeyShape(
|
||||
model: NodeDisplayModel,
|
||||
shapeMap: NodeShapeMap,
|
||||
diffData?: { previous: NodeModelData; current: NodeModelData },
|
||||
diffState?: { previous: State[]; current: State[] },
|
||||
): DisplayObject {
|
||||
return this.upsertShape(
|
||||
'rect',
|
||||
'keyShape',
|
||||
{
|
||||
...this.mergedStyles.keyShape,
|
||||
x: this.mergedStyles.keyShape.x as number - this.mergedStyles.keyShape.width / 2,
|
||||
y: this.mergedStyles.keyShape.y as number - this.mergedStyles.keyShape.height / 2
|
||||
},
|
||||
shapeMap,
|
||||
model,
|
||||
);
|
||||
// haloShape
|
||||
if (data.haloShape && this.drawHaloShape) {
|
||||
shapes.haloShape = this.drawHaloShape(model, shapeMap, diffData);
|
||||
}
|
||||
|
||||
public draw(
|
||||
model: NodeDisplayModel,
|
||||
shapeMap: NodeShapeMap,
|
||||
diffData?: { previous: NodeModelData; current: NodeModelData },
|
||||
diffState?: { previous: State[]; current: State[] },
|
||||
): NodeShapeMap {
|
||||
const { data = {} } = model;
|
||||
let shapes: NodeShapeMap = { keyShape: undefined };
|
||||
|
||||
// keyShape
|
||||
shapes.keyShape = this.drawKeyShape(model, shapeMap, diffData);
|
||||
|
||||
// labelShape
|
||||
if (data.labelShape) {
|
||||
shapes.labelShape = this.drawLabelShape(model, shapeMap, diffData);
|
||||
}
|
||||
|
||||
// haloShape
|
||||
if (data.haloShape && this.drawHaloShape) {
|
||||
shapes.haloShape = this.drawHaloShape(model, shapeMap, diffData);
|
||||
}
|
||||
|
||||
// labelBackgroundShape
|
||||
if (data.labelBackgroundShape) {
|
||||
shapes.labelBackgroundShape = this.drawLabelBackgroundShape(
|
||||
model,
|
||||
shapeMap,
|
||||
diffData,
|
||||
);
|
||||
}
|
||||
|
||||
// anchor shapes
|
||||
if (data.anchorShapes) {
|
||||
const anchorShapes = this.drawAnchorShapes(
|
||||
model,
|
||||
shapeMap,
|
||||
diffData,
|
||||
diffState,
|
||||
);
|
||||
shapes = {
|
||||
...shapes,
|
||||
...anchorShapes,
|
||||
};
|
||||
}
|
||||
|
||||
// iconShape
|
||||
if (data.iconShape) {
|
||||
shapes.iconShape = this.drawIconShape(model, shapeMap, diffData);
|
||||
}
|
||||
|
||||
// badgeShape
|
||||
if (data.badgeShapes) {
|
||||
const badgeShapes = this.drawBadgeShapes(
|
||||
model,
|
||||
shapeMap,
|
||||
diffData,
|
||||
diffState,
|
||||
);
|
||||
shapes = {
|
||||
...shapes,
|
||||
...badgeShapes,
|
||||
};
|
||||
}
|
||||
|
||||
// otherShapes
|
||||
if (data.otherShapes && this.drawOtherShapes) {
|
||||
shapes = {
|
||||
...shapes,
|
||||
...this.drawOtherShapes(model, shapeMap, diffData),
|
||||
};
|
||||
}
|
||||
return shapes;
|
||||
// labelBackgroundShape
|
||||
if (data.labelBackgroundShape) {
|
||||
shapes.labelBackgroundShape = this.drawLabelBackgroundShape(
|
||||
model,
|
||||
shapeMap,
|
||||
diffData,
|
||||
);
|
||||
}
|
||||
|
||||
}
|
||||
// anchor shapes
|
||||
if (data.anchorShapes) {
|
||||
const anchorShapes = this.drawAnchorShapes(
|
||||
model,
|
||||
shapeMap,
|
||||
diffData,
|
||||
diffState,
|
||||
);
|
||||
shapes = {
|
||||
...shapes,
|
||||
...anchorShapes,
|
||||
};
|
||||
}
|
||||
|
||||
// iconShape
|
||||
if (data.iconShape) {
|
||||
shapes.iconShape = this.drawIconShape(model, shapeMap, diffData);
|
||||
}
|
||||
|
||||
// badgeShape
|
||||
if (data.badgeShapes) {
|
||||
const badgeShapes = this.drawBadgeShapes(
|
||||
model,
|
||||
shapeMap,
|
||||
diffData,
|
||||
diffState,
|
||||
);
|
||||
shapes = {
|
||||
...shapes,
|
||||
...badgeShapes,
|
||||
};
|
||||
}
|
||||
|
||||
// otherShapes
|
||||
if (data.otherShapes && this.drawOtherShapes) {
|
||||
shapes = {
|
||||
...shapes,
|
||||
...this.drawOtherShapes(model, shapeMap, diffData),
|
||||
};
|
||||
}
|
||||
return shapes;
|
||||
}
|
||||
}
|
||||
|
||||
@ -35,6 +35,6 @@ export {
|
||||
demo,
|
||||
demoFor4,
|
||||
bugReproduce,
|
||||
rect
|
||||
rect,
|
||||
visual,
|
||||
};
|
||||
|
||||
Loading…
Reference in New Issue
Block a user