旋轉圖像我有這樣的小提琴:Kinetic.js:觸摸
圖像沒有正確地旋轉。 ,我使用的代碼是:
var stage = new Kinetic.Stage({
container: 'd',
width: 300,
height: 300
});
var layer = new Kinetic.Layer();
var isDragging = false;
var refRotation = null;
var rect = new Kinetic.Rect({
x: 150,
y: 150,
width: 100,
height: 100,
fill: 'green',
stroke: 'black',
strokeWidth: 4,
offset: [50, 50],
dragOnTop: true,
draggable: true,
dragBoundFunc: function (pos) {
var xd = 150 - pos.x ;
var yd = 150 - pos.y ;
var theta = Math.atan2(yd, xd);
var deg = theta * 180/Math.PI;
if (!isDragging) {
isDragging = true;
refRotation = deg;
} else {
var rotate = deg - refRotation;
rect.setRotationDeg(deg);
}
return {
x: this.getAbsolutePosition().x,
y: this.getAbsolutePosition().y
}
}
});
layer.add(RECT); stage.add(layer);
任何人都知道我的數學有什麼問題?
---編輯---
與我想要的新feddle: http://jsfiddle.net/zk9cn/
我不認爲你的數學沒有錯。它正確旋轉。當你說錯誤時,它會做什麼以及期望什麼。我注意到的唯一的事情就是光標離矩形越近越好。但這是因爲沒有處理。如果在紅色矩形邊框上移動時旋轉。它工作正常。 – 2013-02-19 04:25:15