修改pctree的bug
This commit is contained in:
parent
7713ddf065
commit
da7781d0df
@ -13,7 +13,7 @@ SV.registerLayout('ChainHashTable', {
|
||||
element: {
|
||||
head: {
|
||||
type: 'two-cell-node',
|
||||
label: '[id]',
|
||||
label: '[data]',
|
||||
size: [70, 40],
|
||||
style: {
|
||||
stroke: '#333',
|
||||
@ -22,7 +22,7 @@ SV.registerLayout('ChainHashTable', {
|
||||
},
|
||||
node: {
|
||||
type: 'link-list-node',
|
||||
label: '[id]',
|
||||
label: '[data]',
|
||||
size: [60, 30],
|
||||
style: {
|
||||
stroke: '#333',
|
||||
@ -70,7 +70,7 @@ SV.registerLayout('ChainHashTable', {
|
||||
anchor: 1,
|
||||
offset: 8,
|
||||
style: {
|
||||
fill: '#f08a5d'
|
||||
fill: '#f08a5d'
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
@ -1,14 +1,25 @@
|
||||
|
||||
|
||||
|
||||
SV.registerLayout('PCTree', {
|
||||
|
||||
SV.registerLayout('PCTree', {
|
||||
|
||||
sourcesPreprocess(sources) {
|
||||
|
||||
for(let i = 0; i < sources.length; i++){
|
||||
if(sources[i].root){
|
||||
sources[i].rootLabel = ['data', 'parent', 'firstChild'];
|
||||
let headNodes = sources.filter(item => item.type === 'PCTreeHead');
|
||||
|
||||
for(let i = 0; i < headNodes.length; i++){
|
||||
|
||||
let dataNode = {
|
||||
type: 'PCTreePreHead',
|
||||
id: headNodes[i].id + '_0',
|
||||
data: headNodes[i].preData,
|
||||
indexLeft: headNodes[i].index,
|
||||
root: headNodes[i].root
|
||||
}
|
||||
|
||||
if(dataNode.root){
|
||||
dataNode.indexTop = 'data';
|
||||
headNodes[i].indexTop = ' parent firstChild'
|
||||
}
|
||||
sources.push(dataNode)
|
||||
}
|
||||
|
||||
return sources;
|
||||
@ -17,12 +28,25 @@ SV.registerLayout('PCTree', {
|
||||
defineOptions() {
|
||||
return {
|
||||
node: {
|
||||
PCTreeHead: {
|
||||
type: 'three-cell',
|
||||
label: ['[data]','[parent]'],
|
||||
size: [210, 33],
|
||||
PCTreePreHead: {
|
||||
type: 'rect',
|
||||
label: '[data]',
|
||||
size: [60, 34],
|
||||
labelOptions: {
|
||||
style: { fontSize: 16 }
|
||||
},
|
||||
style: {
|
||||
stroke: '#333',
|
||||
fill: '#95e1d3',
|
||||
offset: 25
|
||||
}
|
||||
},
|
||||
PCTreeHead: {
|
||||
type: 'two-cell-node',
|
||||
label: '[data]',
|
||||
size: [120, 34],
|
||||
style: {
|
||||
stroke: '#333',
|
||||
fill: '#95e1d3'
|
||||
}
|
||||
},
|
||||
@ -36,6 +60,10 @@ SV.registerLayout('PCTree', {
|
||||
}
|
||||
}
|
||||
},
|
||||
indexLabel: {
|
||||
indexTop: { position: 'top' },
|
||||
indexLeft: { position: 'left' }
|
||||
},
|
||||
link: {
|
||||
headNext: {
|
||||
sourceAnchor: 1,
|
||||
@ -68,8 +96,19 @@ SV.registerLayout('PCTree', {
|
||||
}
|
||||
}
|
||||
},
|
||||
marker: {
|
||||
external: {
|
||||
type: 'pointer',
|
||||
anchor: 0,
|
||||
offset: 8,
|
||||
style: {
|
||||
fill: '#f08a5d'
|
||||
}
|
||||
}
|
||||
},
|
||||
layout: {
|
||||
xInterval: 50
|
||||
xInterval: 50,
|
||||
yInterval: 86
|
||||
},
|
||||
behavior: {
|
||||
dragNode: ['PCTreeNode']
|
||||
@ -77,50 +116,80 @@ SV.registerLayout('PCTree', {
|
||||
};
|
||||
},
|
||||
|
||||
//判断node节点是否之前布局过
|
||||
isUnique(value, allNodeIdValue){
|
||||
let re = new RegExp("" + value);
|
||||
return !re.test(allNodeIdValue);
|
||||
},
|
||||
|
||||
/**
|
||||
* 对子树进行递归布局
|
||||
* @param node
|
||||
* @param parent
|
||||
*/
|
||||
layoutItem(node, prev, layoutOptions) {
|
||||
layoutItem(node, prev, layoutOptions, allNodeId) {
|
||||
if(!node) {
|
||||
return null;
|
||||
}
|
||||
|
||||
let width = node.get('size')[0];
|
||||
|
||||
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);
|
||||
let width = node.get('size')[0],
|
||||
idValue = node.id.split('(')[1].slice(0, -1);
|
||||
|
||||
//有y型链表的情况不用再布局
|
||||
if(this.isUnique(idValue, allNodeId.value)){
|
||||
if(prev) {
|
||||
node.set('y', prev.get('y'));
|
||||
node.set('x', prev.get('x') + layoutOptions.xInterval + width);
|
||||
}
|
||||
|
||||
allNodeId.value += idValue;
|
||||
|
||||
if(node.next) {
|
||||
this.layoutItem(node.next, node, layoutOptions, allNodeId);
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
layout(elements, layoutOptions) {
|
||||
let headNode = elements.filter(item => item.type === 'PCTreeHead'),
|
||||
i;
|
||||
|
||||
preHeadNode = elements.filter(item => item.type === 'PCTreePreHead'),
|
||||
roots = elements.filter(item => item.type === 'PCTreeNode' && item.root),
|
||||
height = headNode[0].get('size')[1],
|
||||
width = headNode[0].get('size')[0],
|
||||
i,
|
||||
allNodeId = { value: ''}; //引用类型用于传参
|
||||
|
||||
for(i = 0; i < headNode.length; i++) {
|
||||
let node = headNode[i],
|
||||
height = node.get('size')[1],
|
||||
width = node.get('size')[0];
|
||||
preNode = preHeadNode[i];
|
||||
|
||||
node.set({
|
||||
x: 0,
|
||||
y: i * height
|
||||
y: i * height
|
||||
});
|
||||
|
||||
preNode.set({
|
||||
x: width / 4,
|
||||
y: (i + 1) * height
|
||||
})
|
||||
|
||||
if(node.headNext) {
|
||||
let y = node.get('y') + height - node.headNext.get('size')[1],
|
||||
x = width + layoutOptions.xInterval * 3;
|
||||
x = width + layoutOptions.xInterval * 2;
|
||||
|
||||
node.headNext.set({ x, y });
|
||||
this.layoutItem(node.headNext, null, layoutOptions);
|
||||
this.layoutItem(node.headNext, null, layoutOptions, allNodeId);
|
||||
}
|
||||
}
|
||||
|
||||
for(i = 0; i < roots.length; i++) {
|
||||
let nodeWidth = roots[0].get('size')[0],
|
||||
nodeInternalSum = i * (nodeWidth + layoutOptions.xInterval);
|
||||
|
||||
roots[i].set({
|
||||
x: headNode[0].get('x') + width + layoutOptions.xInterval * 2 + nodeInternalSum,
|
||||
y: headNode[0].get('y') - layoutOptions.yInterval
|
||||
})
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
4080
package-lock.json
generated
Normal file
4080
package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
@ -124,6 +124,23 @@ export default Util.registerShape(
|
||||
});
|
||||
}
|
||||
|
||||
//pctree 数据结构中没有后续指针
|
||||
if (cfg.id.includes('PCTreeHead') && !cfg.headNext) {
|
||||
group.addShape('text', {
|
||||
attrs: {
|
||||
x: width * (5 / 4),
|
||||
y: height * (8 / 7),
|
||||
textAlign: 'center',
|
||||
textBaseline: 'middle',
|
||||
text: '^',
|
||||
fill: style.fill || '#000',
|
||||
fontSize: 20,
|
||||
cursor: cfg.style.cursor,
|
||||
},
|
||||
name: 'text',
|
||||
draggable: true,
|
||||
});
|
||||
}
|
||||
return wrapperRect;
|
||||
},
|
||||
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
|
||||
|
||||
module.exports = {
|
||||
mode: 'production',
|
||||
entry: './src/StructV.ts',
|
||||
output: {
|
||||
filename: './sv.js',
|
||||
|
||||
Loading…
Reference in New Issue
Block a user