chenxiaopei/StructV2
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feature：添加泄漏区功能部分

Browse Source
This commit is contained in:
黎智洲
2021-05-17 14:02:19 +08:00
parent 7e6789c8de
commit 4c1510da1f
30 changed files with 1381 additions and 584 deletions
Download Patch File Download Diff File Expand all files Collapse all files
demo/dataStruct/Array.js
+12 -12
View File
@@ -8,7 +8,7 @@ class Arrays extends Engine {
return {
element: {
default: {
type: 'rect',
type: 'indexed-node',
label: '[id]',
size: [60, 30],
style: {
@@ -31,27 +31,26 @@ class Arrays extends Engine {
};
}
layout(elements, layoutOptions) {
let arr = elements.default;
layout(elements) {
let arr = elements,
width = arr[0].get('size')[0];
for(let i = 0; i < arr.length; i++) {
let width = arr[i].get('size')[0];
if(i > 0) {
arr[i].set('x', arr[i - 1].get('x') + width);
}
arr[i].set('x', i * width);
}
}
}
const A = function(container) {
return{
engine: new Arrays(container),
data: [[
{ id: 1, external: 'A' },
{ id: 2 },
{ id: 3 },
{ id: 1, index: 0 },
{ id: 2, index: 1 },
{ id: 3, index: 2 },
{ id: 4 },
{ id: 5 },
{ id: 6 },
@@ -66,7 +65,8 @@ const A = function(container) {
{ id: 3 },
{ id: 6, external: 'A' },
{ id: 7 },
{ id: 8 }
{ id: 8 },
{ id: 12 }
]]
}
};
demo/dataStruct/BinaryTree.js
+2 -5
View File
@@ -27,10 +27,7 @@ class BinaryTree extends Engine {
stroke: '#333',
lineAppendWidth: 6,
cursor: 'pointer',
endArrow: {
path: G6.Arrow.triangle(8, 6, 0),
fill: '#333'
},
endArrow: 'default',
startArrow: {
path: G6.Arrow.circle(2, -1),
fill: '#333'
@@ -130,7 +127,7 @@ class BinaryTree extends Engine {
* @param {*} layoutOptions
*/
layout(elements, layoutOptions) {
let nodes = elements.default,
let nodes = elements,
rootNodes = [],
node,
root,
demo/dataStruct/ChainHashTable.js
+23 -4
View File
@@ -107,7 +107,7 @@
layout(elements, layoutOptions) {
let headNode = elements.head;
let headNode = elements.filter(item => item.type === 'head');
for(let i = 0; i < headNode.length; i++) {
let node = headNode[i],
@@ -128,9 +128,9 @@
}
const CHT = function(container) {
const CHT = function(container, options) {
return{
engine: new ChainHashTable(container),
engine: new ChainHashTable(container, options),
data: [
{
head: [{
@@ -153,7 +153,26 @@ const CHT = function(container) {
}]
},
{
head: [{
id: 0,
start: 'node#0'
}, {
id: 2,
start: 'node#2'
}, {
id: 3,
start: 'node#4'
}],
node: [{
id: 0,
next: 1
}, {
id: 1
},{
id: 2
},{
id: 4
}]
}
]
}
demo/dataStruct/GeneralizedList.js
+215
View File
@@ -0,0 +1,215 @@
SV.registerShape('three-cell-node', {
draw(cfg, group) {
cfg.size = cfg.size || [30, 10];
const width = cfg.size[0],
height = cfg.size[1];
const wrapperRect = group.addShape('rect', {
attrs: {
x: width / 2,
y: height / 2,
width: width,
height: height,
stroke: cfg.style.stroke,
fill: '#eee'
},
name: 'wrapper',
draggable: true
});
group.addShape('rect', {
attrs: {
x: width / 2,
y: height / 2,
width: width / 3,
height: height,
fill: cfg.style.fill,
stroke: cfg.style.stroke
},
name: 'left-rect',
draggable: true
});
group.addShape('rect', {
attrs: {
x: width * (5 / 6),
y: height / 2,
width: width / 3,
height: height,
fill: '#eee',
stroke: cfg.style.stroke
},
name: 'mid-rect',
draggable: true
});
if (cfg.label) {
const style = (cfg.labelCfg && cfg.labelCfg.style) || {};
group.addShape('text', {
attrs: {
x: width * (2 / 3),
y: height,
textAlign: 'center',
textBaseline: 'middle',
text: cfg.label,
fill: style.fill || '#000',
fontSize: style.fontSize || 16
},
name: 'text',
draggable: true
});
}
return wrapperRect;
},
getAnchorPoints() {
return [
[0, 0.5],
[0.5, 0.5],
[0.5, 0],
[5 / 6, 0.5]
];
}
});
class GeneralizedList extends Engine {
defineOptions() {
return {
element: {
tableNode: {
type: 'three-cell-node',
label: '[tag]',
size: [90, 30],
style: {
stroke: '#333',
fill: '#b83b5e'
}
},
atomNode: {
type: 'two-cell-node',
label: '[tag]',
size: [60, 30],
style: {
stroke: '#333',
fill: '#b83b5e'
}
}
},
link: {
sub: {
type: 'line',
sourceAnchor: 1,
targetAnchor: 2,
style: {
stroke: '#333',
endArrow: {
path: G6.Arrow.triangle(8, 6, 0),
fill: '#333'
},
startArrow: {
path: G6.Arrow.circle(2, -1),
fill: '#333'
}
}
},
next: {
type: 'line',
sourceAnchor: 3,
targetAnchor: 0,
style: {
stroke: '#333',
endArrow: {
path: G6.Arrow.triangle(8, 6, 0),
fill: '#333'
},
startArrow: {
path: G6.Arrow.circle(2, -1),
fill: '#333'
}
}
}
},
layout: {
xInterval: 40,
yInterval: 20,
}
};
}
/**
* 对子树进行递归布局
* @param node
* @param parent
*/
layoutItem(node, prev, layoutOptions) {
let [width, height] = node.get('size');
if(prev) {
node.set('y', prev.get('y'));
node.set('x', prev.get('x') + layoutOptions.xInterval + width)
}
if(node.next) {
this.layoutItem(node.next, node, layoutOptions);
}
// 存在子节点
if(node.sub) {
node.sub.set('y', node.get('y') + layoutOptions.yInterval + height);
// 子结点还是广义表
if(node.sub.tag === 1) {
node.sub.set('x', node.get('x'));
this.layoutItem(node.sub, null, layoutOptions);
}
else {
let subWidth = node.sub.get('size')[0];
node.sub.set('x', node.get('x') + width - subWidth);
}
}
}
layout(elements, layoutOptions) {
let tableNodes = elements.tableNode,
tableRootNode = null;
for(let i = 0; i < tableNodes.length; i++) {
if(tableNodes[i].root) {
tableRootNode = tableNodes[i];
break;
}
}
if(tableRootNode) {
this.layoutItem(tableRootNode, null, layoutOptions);
}
}
}
const GL = function(container) {
return{
engine: new GeneralizedList(container),
data: [{
"atomNode": [],
"tableNode": [
{
"id": 6385328,
"tag": 1,
"root": true,
"external": [
"gl"
]
}
]
}]
}
};
demo/dataStruct/LinkQueue.js
+123 -111
View File
@@ -1,94 +1,95 @@
G6.registerNode('link-Queue-head', {
draw(cfg, group) {
cfg.size = cfg.size || [30, 10];
// G6.registerNode('link-Queue-head', {
// draw(cfg, group) {
// cfg.size = cfg.size || [30, 10];
const width = cfg.size[0],
height = cfg.size[1];
// const width = cfg.size[0],
// height = cfg.size[1];
const wrapperRect = group.addShape('rect', {
attrs: {
x: width / 2,
y: height / 2,
width: width,
height: height,
stroke: cfg.style.stroke,
fill: 'transparent'
},
name: 'wrapper'
});
// const wrapperRect = group.addShape('rect', {
// attrs: {
// x: width / 2,
// y: height / 2,
// width: width,
// height: height,
// stroke: cfg.style.stroke,
// fill: 'transparent'
// },
// name: 'wrapper'
// });
group.addShape('rect', {
attrs: {
x: width / 2,
y: height / 2,
width: width,
height: height / 2,
fill: cfg.style.fill,
stroke: cfg.style.stroke
},
name: 'top-rect'
});
// group.addShape('rect', {
// attrs: {
// x: width / 2,
// y: height / 2,
// width: width,
// height: height / 2,
// fill: cfg.style.fill,
// stroke: cfg.style.stroke
// },
// name: 'top-rect'
// });
group.addShape('rect', {
attrs: {
x: width / 2,
y: height,
width: width,
height: height / 2,
fill: cfg.style.fill,
stroke: cfg.style.stroke
},
name: 'bottom-rect'
});
// group.addShape('rect', {
// attrs: {
// x: width / 2,
// y: height,
// width: width,
// height: height / 2,
// fill: cfg.style.fill,
// stroke: cfg.style.stroke
// },
// name: 'bottom-rect'
// });
group.addShape('text', {
attrs: {
x: width,
y: height * (3 / 4),
textAlign: 'center',
textBaseline: 'middle',
text: 'front',
fill: '#000',
fontSize: 16
},
name: 'front'
});
// group.addShape('text', {
// attrs: {
// x: width,
// y: height * (3 / 4),
// textAlign: 'center',
// textBaseline: 'middle',
// text: 'front',
// fill: '#000',
// fontSize: 16
// },
// name: 'front'
// });
group.addShape('text', {
attrs: {
x: width,
y: height * (5 / 4),
textAlign: 'center',
textBaseline: 'middle',
text: 'rear',
fill: '#000',
fontSize: 16
},
name: 'rear'
});
// group.addShape('text', {
// attrs: {
// x: width,
// y: height * (5 / 4),
// textAlign: 'center',
// textBaseline: 'middle',
// text: 'rear',
// fill: '#000',
// fontSize: 16
// },
// name: 'rear'
// });
return wrapperRect;
},
// return wrapperRect;
// },
getAnchorPoints() {
return [
[1, 0.25],
[1, 0.75]
];
}
});
// getAnchorPoints() {
// return [
// [1, 0.25],
// [1, 0.75]
// ];
// }
// });
class LinkQueue extends Engine {
defineOptions() {
return {
element: {
head: {
type: 'link-Queue-head',
label: '[id]',
size: [60, 80],
type: 'rect',
label: '[label]',
size: [60, 40],
style: {
stroke: '#333',
fill: '#b83b5e'
@@ -106,9 +107,9 @@ G6.registerNode('link-Queue-head', {
},
link: {
front: {
type: 'line',
sourceAnchor: 0,
targetAnchor: 0,
type: 'polyline',
sourceAnchor: 1,
targetAnchor: 5,
style: {
stroke: '#333',
endArrow: {
@@ -120,7 +121,7 @@ G6.registerNode('link-Queue-head', {
rear: {
type: 'polyline',
sourceAnchor: 1,
targetAnchor: 3,
targetAnchor: 5,
style: {
stroke: '#333',
endArrow: {
@@ -157,10 +158,16 @@ G6.registerNode('link-Queue-head', {
layout: {
xInterval: 50,
yInterval: 50
},
interaction: {
dragNode: ['node']
}
};
}
sourcesPreprocess(sources) {
sources.head[1].external = null;
}
/**
* 对子树进行递归布局
@@ -186,51 +193,56 @@ G6.registerNode('link-Queue-head', {
layout(elements, layoutOptions) {
let head = elements.head[0];
let head1 = elements.head[0],
head2 = elements.head[1],
nodes = elements.node,
headHeight = head1.get('size')[1];
let roots = nodes.filter(item => item.root).reverse();
if(head.front) {
let d = head.get('size')[1] / 2 - head.front.get('size')[1],
x = layoutOptions.xInterval * 2.5,
y = head.front.get('size')[1] / 2 + 1.5 * d;
for(let i = 0; i < roots.length; i++) {
let root = roots[i],
height = root.get('size')[1];
head.front.set({ x, y });
root.set('y', root.get('y') + i * (layoutOptions.yInterval + height));
this.layoutItem(root, null, layoutOptions);
}
if(head.front.next) {
this.layoutItem(head.front.next, head.front, layoutOptions);
}
let x = -50, y = roots.length? roots[roots.length - 1].get('y'): 0,
nodeHeight = roots.length? roots[roots.length - 1].get('size')[1]: 0;
head1.set({ x, y: y + nodeHeight * 3 });
head2.set({ x, y: head1.get('y') + headHeight });
}
}
const data = {
head: [
{
"type": "QPtr",
"id": 140737338526359,
"label": "front",
"front": "node#8358681150976310000",
"external": [
"lq"
]
},
{
"type": "QPtr",
"id": 140737338526360,
"label": "rear",
"rear": "node#15844482482171916",
"external": null
}
],
node: []
}
const LQueue = function(container) {
return{
engine: new LinkQueue(container),
data: [{
head: [{
type: "QPtr",
id: 44,
front: 'node#1',
rear: 'node#13'
}],
node: [
{
id: 1,
next: 12,
root: true
},
{
id: 12,
next: 13
},
{
id: 13,
next: null
}
]
}]
data: [data]
}
};
demo/dataStruct/linkList.js
+16 -18
View File
@@ -13,7 +13,7 @@ class LinkList extends Engine {
size: [60, 30],
style: {
stroke: '#333',
fill: '#b83b5e'
fill: '#eaffd0'
}
}
},
@@ -24,10 +24,7 @@ class LinkList extends Engine {
targetAnchor: 0,
style: {
stroke: '#333',
endArrow: {
path: G6.Arrow.triangle(8, 6, 0),
fill: '#333'
},
endArrow: 'default',
startArrow: {
path: G6.Arrow.circle(2, -1),
fill: '#333'
@@ -41,10 +38,7 @@ class LinkList extends Engine {
targetAnchor: 3,
style: {
stroke: '#333',
endArrow: {
path: G6.Arrow.triangle(6, 6, -2),
fill: '#333'
},
endArrow: 'default',
startArrow: {
path: G6.Arrow.circle(2, -1),
fill: '#333'
@@ -92,7 +86,7 @@ class LinkList extends Engine {
layout(elements, layoutOptions) {
let nodes = elements.default,
let nodes = elements,
rootNodes = [],
node,
i;
@@ -116,9 +110,9 @@ class LinkList extends Engine {
}
const LList = function(container) {
const LList = function(container, options) {
return{
engine: new LinkList(container),
engine: new LinkList(container, options),
data: [[
{ id: 1, root: true, next: 2, external: ['gg'] },
{ id: 2, next: 3 },
@@ -129,15 +123,19 @@ const LList = function(container) {
{ id: 7, next: 8 },
{ id: 8, next: 4 },
{ id: 9, root: true, next: 10 },
{ id: 10 }
{ id: 10, free: true }
],
[
{ id: 1, root: true, next: 2, external: ['gg'] },
{ id: 1, root: true, next: 2 },
{ id: 2, next: 3 },
{ id: 3, next: 6 },
{ id: 6, next: 7 },
{ id: 7, next: 8 },
{ id: 8 }
{ id: 3, next: 8, external: ['gg'] },
{ id: 8, next: 12 },
{ id: 12, next: 13 },
{ id: 13 }
],
[
{ id: 1, root: true, next: 2 },
{ id: 2 }
]]
}
};