2016-04-29 3 views
0

У меня есть мозговой завиток, пытаясь вычислить исходные координаты верхнего, левого угла прямоугольника перед его вращением.Определить исходные координаты угла перед вращением

Учитывая, что я знаю, что прямоугольник был повернут п градусов/радиан, и я знаю, что новые х и Y координаты, как бы я вычислить х и у ( и ?) Координаты использования тригонометрия в JavaScript? Я также знаю ширина и высота из прямоугольника. Ось вращения является центральной для прямоугольника.

example problem

Повернутый прямоугольник синего цвета, оригинал в зеленый цвет.

ответ

0

оригинальный X точно так же далеко от оси, как транспонированная («повернутых») Y является, и наоборот, оригинальный Y как далеко, как транспонированной X является от оси.

Итак:

origX = axisX - (axisY - transY)
origY = axisY - (axisX - TransX)

+0

Извиняюсь, это немного рано утром для меня. Могу ли я получить формулу транспозиции? Как я могу получить 'transX' и' transY' из информации, которую у меня есть? – shennan

+0

@shennan * transX, Y * = "* newX, Y *" – Amit

+0

Похоже, что 'origY' не правильно вычисляется с этим. Для прямоугольника с 'var width = 200, height = 100, axisX = 275, axisY = 200, transX = 325, transY = 47.7;' result' origY' - '250', где должно быть' 150'? 'OrigX' кажется правильным на' 122.69'. Что я делаю не так? – shennan

0

Вы должны противостоять вращению вокруг стержня. (Центр прямоугольника)

//utils 
function nr(v){ return +v || 0 } 

class Point{ 
    constructor(x,y){ 
     this.x = nr(x); 
     this.y = nr(y); 
    } 

    add(pt){ 
     var a = this, b = Point.from(pt); 
     return new Point(a.x + b.x, a.y + b.y); 
    } 

    subtract(pt){ 
     var a = this, b = Point.from(pt); 
     return new Point(a.x - b.x, a.y - b.y); 
    } 

    rotate(radians, pivot){ 
     if(pivot){ 
      return this.subtract(pivot).rotate(radians).add(pivot);    
     } 

     var r = nr(radians), c = Math.cos(r), s = Math.sin(r); 
     return new Point(
      this.x * c - this.y * s, 
      this.x * s + this.x * c 
     ); 
     //return delta.matrixTransform(c, s, -s, c); 
    } 

    matrixTransform(a, b, c, d, tx, ty){ 
     return new Point(
      this.x * nr(a) + this.y * nr(c) + nr(tx), 
      this.x * nr(b) + this.y * nr(d) + nr(ty) 
     ) 
    } 

    static from(pt){ 
     if(pt instanceof Point) return pt; 
     return new Point(pt && pt.x, pt && pt.y); 
    } 
} 

и вычисление:

var RAD = Math.PI/180, DEG = 180/Math.PI; 

var knownPoint = new Point(100, 100); 
var angle = 30*RAD; 

var unrotatedRect = { width: 150, height: 100 }; 
//the pivot to (counter-)rotate your known point 
//if you know this point, you don't have to compute it 
var pivot = new Point(unrotatedRect.width/2, unrotatedRect.height/2) 
    .rotate(angle) 
    .add(knownPoint); 

console.log(knownPoint.rotate(-angle, pivot)); 
Смежные вопросы