fix: label rotate problem

This commit is contained in:
Yanyan-Wang 2020-01-15 11:47:27 +08:00 committed by Moyee
parent 33ae59089a
commit 9f830d79b6
5 changed files with 41 additions and 3 deletions

View File

@ -84,7 +84,7 @@ fetch('https://gw.alipayobjects.com/os/basement_prod/70cde3be-22e8-4291-98f1-4d5
position: 'bottom',
offset: 5,
style: {
rotate: 90,
rotate: Math.PI / 2,
textAlign: 'start'
}
};

View File

@ -82,6 +82,7 @@ fetch('https://gw.alipayobjects.com/os/basement_prod/70cde3be-22e8-4291-98f1-4d5
position: 'center',
style: {
rotate: angle,
rotateCenter: 'lefttop',
textAlign: 'start'
}
};

View File

@ -60,7 +60,7 @@ fetch('https://gw.alipayobjects.com/os/antvdemo/assets/data/algorithm-category.j
let rotate = 0;
if (!node.children) {
position = 'bottom';
rotate = 90;
rotate = Math.PI / 2;
}
return {
label: node.id,

View File

@ -47,7 +47,7 @@ fetch('https://gw.alipayobjects.com/os/antvdemo/assets/data/algorithm-category.j
let rotate = 0;
if (!node.children) {
position = 'bottom';
rotate = 90;
rotate = Math.PI / 2;
}
return {
label: node.id,

View File

@ -58,12 +58,49 @@ export const shapeBase: ShapeOptions = {
const labelCfg = merge({}, defaultLabelCfg, cfg.labelCfg)
const labelStyle = this.getLabelStyle(cfg, labelCfg, group)
console.log(labelStyle);
const label = group.addShape('text', {
attrs: labelStyle,
capture: false,
className: 'text-shape',
name: 'text-shape',
})
if (labelStyle.rotate) {
const labelBBox = label.getBBox();
let labelMatrix = label.getMatrix();
if (labelStyle.rotateCenter) {
switch (labelStyle.rotateCenter) {
case 'center':
labelMatrix = transform(labelMatrix, [
[ 't', -labelBBox.width / 2, -labelBBox.height / 2 ],
[ 'r', labelStyle.rotate ],
[ 't', labelBBox.width / 2, labelBBox.height / 2 ]
]);
break;
case 'lefttop':
labelMatrix = transform(labelMatrix, [
[ 't', -labelStyle.x, -labelStyle.y ],
[ 'r', labelStyle.rotate ],
[ 't', labelStyle.x, labelStyle.y ]
]);
break;
case 'leftcenter':
labelMatrix = transform(labelMatrix, [
[ 't', -labelStyle.x, -labelStyle.y - labelBBox.height / 2 ],
[ 'r', labelStyle.rotate ],
[ 't', labelStyle.x, labelStyle.y + labelBBox.height / 2 ]
]);
break;
}
} else {
labelMatrix = transform(labelMatrix, [
[ 't', -labelStyle.x, -labelStyle.y - labelBBox.height / 2 ],
[ 'r', labelStyle.rotate ],
[ 't', labelStyle.x, labelStyle.y + labelBBox.height / 2 ]
]);
}
label.setMatrix(labelMatrix)
}
return label
},
getLabelStyleByPosition(cfg?: ModelConfig, labelCfg?: ILabelConfig, group?: GGroup): LabelStyle {