mirror of
https://github.com/konvajs/konva.git
synced 2025-06-28 04:42:02 +08:00
fix label position on attributes changes
This commit is contained in:
parent
44ed45e1fd
commit
e06d3b85b9
@ -23,6 +23,9 @@ var ATTR_CHANGE_LIST = [
|
|||||||
'text',
|
'text',
|
||||||
'width',
|
'width',
|
||||||
'height',
|
'height',
|
||||||
|
'pointerDirection',
|
||||||
|
'pointerWidth',
|
||||||
|
'pointerHeight',
|
||||||
],
|
],
|
||||||
CHANGE_KONVA = 'Change.konva',
|
CHANGE_KONVA = 'Change.konva',
|
||||||
NONE = 'none',
|
NONE = 'none',
|
||||||
@ -209,11 +212,11 @@ export class Tag extends Shape<TagConfig> {
|
|||||||
let bottomRight = 0;
|
let bottomRight = 0;
|
||||||
|
|
||||||
if (typeof cornerRadius === 'number') {
|
if (typeof cornerRadius === 'number') {
|
||||||
topLeft = topRight = bottomLeft = bottomRight = Math.min(
|
topLeft =
|
||||||
cornerRadius,
|
topRight =
|
||||||
width / 2,
|
bottomLeft =
|
||||||
height / 2
|
bottomRight =
|
||||||
);
|
Math.min(cornerRadius, width / 2, height / 2);
|
||||||
} else {
|
} else {
|
||||||
topLeft = Math.min(cornerRadius[0] || 0, width / 2, height / 2);
|
topLeft = Math.min(cornerRadius[0] || 0, width / 2, height / 2);
|
||||||
topRight = Math.min(cornerRadius[1] || 0, width / 2, height / 2);
|
topRight = Math.min(cornerRadius[1] || 0, width / 2, height / 2);
|
||||||
|
@ -320,4 +320,57 @@ describe('Label', function () {
|
|||||||
'clearRect(0,0,578,200);save();transform(1,0,0,1,50,50);beginPath();moveTo(0,0);lineTo(90,0);arc(90,10,10,4.712,0,false);lineTo(100,80);arc(80,80,20,0,1.571,false);lineTo(30,100);arc(30,70,30,1.571,3.142,false);lineTo(0,0);arc(0,0,0,3.142,4.712,false);closePath();fillStyle=black;fill();restore();clearRect(0,0,578,200);save();transform(1,0,0,1,50,50);beginPath();moveTo(0,0);lineTo(90,0);arc(90,10,10,4.712,0,false);lineTo(100,80);arc(80,80,20,0,1.571,false);lineTo(30,100);arc(30,70,30,1.571,3.142,false);lineTo(0,0);arc(0,0,0,3.142,4.712,false);closePath();fillStyle=black;fill();restore();'
|
'clearRect(0,0,578,200);save();transform(1,0,0,1,50,50);beginPath();moveTo(0,0);lineTo(90,0);arc(90,10,10,4.712,0,false);lineTo(100,80);arc(80,80,20,0,1.571,false);lineTo(30,100);arc(30,70,30,1.571,3.142,false);lineTo(0,0);arc(0,0,0,3.142,4.712,false);closePath();fillStyle=black;fill();restore();clearRect(0,0,578,200);save();transform(1,0,0,1,50,50);beginPath();moveTo(0,0);lineTo(90,0);arc(90,10,10,4.712,0,false);lineTo(100,80);arc(80,80,20,0,1.571,false);lineTo(30,100);arc(30,70,30,1.571,3.142,false);lineTo(0,0);arc(0,0,0,3.142,4.712,false);closePath();fillStyle=black;fill();restore();'
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
it.only('react to pointer properties', function () {
|
||||||
|
var stage = addStage();
|
||||||
|
var layer = new Konva.Layer();
|
||||||
|
stage.add(layer);
|
||||||
|
|
||||||
|
var label = new Konva.Label({
|
||||||
|
x: 100,
|
||||||
|
y: 100,
|
||||||
|
draggable: true,
|
||||||
|
});
|
||||||
|
|
||||||
|
var counter = 0;
|
||||||
|
var oldSync = label._sync;
|
||||||
|
label._sync = () => {
|
||||||
|
oldSync.call(label);
|
||||||
|
counter += 1;
|
||||||
|
};
|
||||||
|
|
||||||
|
const tag = new Konva.Tag({
|
||||||
|
fill: '#bbb',
|
||||||
|
shadowColor: 'black',
|
||||||
|
shadowBlur: 10,
|
||||||
|
shadowOffset: { x: 10, y: 10 },
|
||||||
|
shadowOpacity: 0.2,
|
||||||
|
lineJoin: 'round',
|
||||||
|
pointerDirection: 'up',
|
||||||
|
pointerWidth: 20,
|
||||||
|
pointerHeight: 20,
|
||||||
|
cornerRadius: 5,
|
||||||
|
});
|
||||||
|
// add a tag to the label
|
||||||
|
label.add(tag);
|
||||||
|
|
||||||
|
// add text to the label
|
||||||
|
label.add(
|
||||||
|
new Konva.Text({
|
||||||
|
text: 'hello',
|
||||||
|
fontSize: 50,
|
||||||
|
lineHeight: 1.2,
|
||||||
|
fill: 'green',
|
||||||
|
})
|
||||||
|
);
|
||||||
|
layer.add(label);
|
||||||
|
|
||||||
|
assert.equal(counter, 4);
|
||||||
|
tag.pointerDirection('bottom');
|
||||||
|
assert.equal(counter, 5);
|
||||||
|
tag.pointerWidth(30);
|
||||||
|
assert.equal(counter, 6);
|
||||||
|
tag.pointerHeight(40);
|
||||||
|
assert.equal(counter, 7);
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
Loading…
Reference in New Issue
Block a user