default node support color property

This commit is contained in:
zhanning.bzn 2019-10-12 12:02:37 +08:00
parent 8cc2151e8d
commit d43b2551e8
9 changed files with 64 additions and 78 deletions

View File

@ -1,6 +1,6 @@
{
"name": "@antv/g6",
"version": "3.1.1",
"version": "3.1.2",
"description": "graph visualization frame work",
"main": "build/g6.js",
"homepage": "https://github.com/antvis/g6",

View File

@ -3,7 +3,7 @@
*/
module.exports = {
version: '3.1.1',
version: '3.1.2',
rootContainerClassName: 'root-container',
nodeContainerClassName: 'node-container',
edgeContainerClassName: 'edge-container',

View File

@ -58,17 +58,12 @@ Shape.registerNode('circle', {
labelPosition: 'center',
drawShape(cfg, group) {
const customOptions = this.getCustomConfig(cfg) || {};
const { style: defaultStyle, icon: defaultIcon } = this.options;
const { style: customStyle, icon: customIcon } = customOptions;
const style = deepMix({}, defaultStyle, customStyle, cfg.style);
const { icon: defaultIcon } = this.options;
const { icon: customIcon } = customOptions;
const style = this.getShapeStyle(cfg);
const icon = deepMix({}, defaultIcon, customIcon, cfg.icon);
const size = this.getSize(cfg);
const r = size[0] / 2;
const keyShape = group.addShape('circle', {
attrs: {
...style,
r
}
attrs: style
});
const { width, height, show } = icon;
@ -165,7 +160,11 @@ Shape.registerNode('circle', {
const customOptions = this.getCustomConfig(cfg) || {};
const { style: defaultStyle } = this.options;
const { style: customStyle } = customOptions;
const style = deepMix({}, defaultStyle, customStyle, cfg.style);
const strokeStyle = {
stroke: cfg.color
};
// 如果设置了color则覆盖默认的stroke属性
const style = deepMix({}, defaultStyle, customStyle, strokeStyle, cfg.style);
const size = this.getSize(cfg);
const r = size[0] / 2;
const styles = Util.mix({}, {

View File

@ -55,17 +55,13 @@ Shape.registerNode('diamond', {
labelPosition: 'center',
drawShape(cfg, group) {
const customOptions = this.getCustomConfig(cfg) || {};
const { style: defaultStyle, icon: defaultIcon } = this.options;
const { style: customStyle, icon: customIcon } = customOptions;
const style = deepMix({}, defaultStyle, customStyle, cfg.style);
const { icon: defaultIcon } = this.options;
const { icon: customIcon } = customOptions;
const style = this.getShapeStyle(cfg);
const icon = deepMix({}, defaultIcon, customIcon, cfg.icon);
const path = this.getPath(cfg);
const keyShape = group.addShape('path', {
attrs: {
path,
...style
}
attrs: style
});
const { width: w, height: h, show } = icon;
@ -176,7 +172,11 @@ Shape.registerNode('diamond', {
const customOptions = this.getCustomConfig(cfg) || {};
const { style: defaultStyle } = this.options;
const { style: customStyle } = customOptions;
const style = deepMix({}, defaultStyle, customStyle, cfg.style);
const strokeStyle = {
stroke: cfg.color
};
// 如果设置了color则覆盖默认的stroke属性
const style = deepMix({}, defaultStyle, customStyle, strokeStyle, cfg.style);
const path = this.getPath(cfg);
const styles = { path, ...style };
return styles;

View File

@ -60,21 +60,13 @@ Shape.registerNode('ellipse', {
labelPosition: 'center',
drawShape(cfg, group) {
const customOptions = this.getCustomConfig(cfg) || {};
const { style: defaultStyle, icon: defaultIcon } = this.options;
const { style: customStyle, icon: customIcon } = customOptions;
const style = deepMix({}, defaultStyle, customStyle, cfg.style);
const { icon: defaultIcon } = this.options;
const { icon: customIcon } = customOptions;
const style = this.getShapeStyle(cfg);
const icon = deepMix({}, defaultIcon, customIcon, cfg.icon);
const size = this.getSize(cfg);
const rx = size[0] / 2;
const ry = size[1] / 2;
const keyShape = group.addShape('ellipse', {
attrs: {
...style,
rx,
ry
}
attrs: style
});
const { width, height, show } = icon;
@ -173,7 +165,11 @@ Shape.registerNode('ellipse', {
const customOptions = this.getCustomConfig(cfg) || {};
const { style: defaultStyle } = this.options;
const { style: customStyle } = customOptions;
const style = deepMix({}, defaultStyle, customStyle, cfg.style);
const strokeStyle = {
stroke: cfg.color
};
// 如果设置了color则覆盖默认的stroke属性
const style = deepMix({}, defaultStyle, customStyle, strokeStyle, cfg.style);
const size = this.getSize(cfg);
const rx = size[0] / 2;
const ry = size[1] / 2;

View File

@ -86,21 +86,15 @@ Shape.registerNode('modelRect', {
shapeType: 'modelRect',
drawShape(cfg, group) {
const customOptions = this.getCustomConfig(cfg) || {};
const { style: defaultStyle, preRect: defaultPreRect } = this.options;
const { style: customStyle, preRect: customPreRect } = customOptions;
const style = deepMix({}, defaultStyle, customStyle, cfg.style);
const { preRect: defaultPreRect } = this.options;
const { preRect: customPreRect } = customOptions;
const style = this.getShapeStyle(cfg);
const size = this.getSize(cfg);
const width = size[0];
const height = size[1];
const keyShape = group.addShape('rect', {
attrs: {
...style,
x: -width / 2,
y: -height / 2,
width,
height
}
attrs: style
});
const preRect = deepMix({}, defaultPreRect, customPreRect, cfg.preRect);
@ -314,7 +308,11 @@ Shape.registerNode('modelRect', {
const customOptions = this.getCustomConfig(cfg) || {};
const { style: defaultStyle } = this.options;
const { style: customStyle } = customOptions;
const style = deepMix({}, defaultStyle, customStyle, cfg.style);
const strokeStyle = {
stroke: cfg.color
};
// 如果设置了color则覆盖默认的stroke属性
const style = deepMix({}, defaultStyle, customStyle, strokeStyle, cfg.style);
const size = this.getSize(cfg);
const width = size[0];
const height = size[1];

View File

@ -48,22 +48,10 @@ Shape.registerNode('rect', {
},
shapeType: 'rect',
drawShape(cfg, group) {
const customOptions = this.getCustomConfig(cfg) || {};
const { style: defaultStyle } = this.options;
const { style: customStyle } = customOptions;
const style = deepMix({}, defaultStyle, customStyle, cfg.style);
const size = this.getSize(cfg);
const width = size[0];
const height = size[1];
const style = this.getShapeStyle(cfg);
const keyShape = group.addShape('rect', {
attrs: {
...style,
x: -width / 2,
y: -height / 2,
width,
height
},
attrs: style,
className: 'rect-keyShape'
});
@ -148,7 +136,11 @@ Shape.registerNode('rect', {
const customOptions = this.getCustomConfig(cfg) || {};
const { style: defaultStyle } = this.options;
const { style: customStyle } = customOptions;
const style = deepMix({}, defaultStyle, customStyle, cfg.style);
const strokeStyle = {
stroke: cfg.color
};
// 如果设置了color则覆盖默认的stroke属性
const style = deepMix({}, defaultStyle, customStyle, strokeStyle, cfg.style);
const size = this.getSize(cfg);
const width = size[0];
const height = size[1];

View File

@ -57,17 +57,13 @@ Shape.registerNode('star', {
labelPosition: 'center',
drawShape(cfg, group) {
const customOptions = this.getCustomConfig(cfg) || {};
const { style: defaultStyle, icon: defaultIcon } = this.options;
const { style: customStyle, icon: customIcon } = customOptions;
const style = deepMix({}, defaultStyle, customStyle, cfg.style);
const { icon: defaultIcon } = this.options;
const { icon: customIcon } = customOptions;
const style = this.getShapeStyle(cfg);
const icon = deepMix({}, defaultIcon, customIcon, cfg.icon);
const path = this.getPath(cfg);
const keyShape = group.addShape('path', {
attrs: {
path,
...style
}
attrs: style
});
const { width: w, height: h, show } = icon;
@ -232,7 +228,11 @@ Shape.registerNode('star', {
const customOptions = this.getCustomConfig(cfg) || {};
const { style: defaultStyle } = this.options;
const { style: customStyle } = customOptions;
const style = deepMix({}, defaultStyle, customStyle, cfg.style);
const strokeStyle = {
stroke: cfg.color
};
// 如果设置了color则覆盖默认的stroke属性
const style = deepMix({}, defaultStyle, customStyle, strokeStyle, cfg.style);
const path = this.getPath(cfg);
const styles = { path, ...style };
return styles;

View File

@ -58,18 +58,15 @@ Shape.registerNode('triangle', {
labelPosition: 'bottom',
drawShape(cfg, group) {
const customOptions = this.getCustomConfig(cfg) || {};
const { style: defaultStyle, icon: defaultIcon, direction: defaultDirection } = this.options;
const { style: customStyle, icon: customIcon, direction: customDirection } = customOptions;
const style = deepMix({}, defaultStyle, customStyle, cfg.style);
const { icon: defaultIcon, direction: defaultDirection } = this.options;
const { icon: customIcon, direction: customDirection } = customOptions;
const style = this.getShapeStyle(cfg);
const icon = deepMix({}, defaultIcon, customIcon, cfg.icon);
const direction = cfg.direction || customDirection || defaultDirection;
const path = this.getPath(cfg);
const keyShape = group.addShape('path', {
attrs: {
path,
...style
}
attrs: style
});
const { width: w, height: h, show, offset } = icon;
@ -275,7 +272,11 @@ Shape.registerNode('triangle', {
const customOptions = this.getCustomConfig(cfg) || {};
const { style: defaultStyle } = this.options;
const { style: customStyle } = customOptions;
const style = deepMix({}, defaultStyle, customStyle, cfg.style);
const strokeStyle = {
stroke: cfg.color
};
// 如果设置了color则覆盖默认的stroke属性
const style = deepMix({}, defaultStyle, customStyle, strokeStyle, cfg.style);
const path = this.getPath(cfg);
const styles = { path, ...style };
return styles;