从已知的边界框坐标计算旋转的矩形大小 [英] Calculate rotated rectangle size from known bounding box coordinates

问题描述

我阅读了 http://goo.gl/HKMtO 了解如何计算边界框坐标不过在特殊情况下，如下图所示：

http://i.stack.imgur.com/3UNfD.png>

如何获得旋转的矩形大小，如果已经获得边界框大小，我尝试在javascript中编写代码

  //假设w = 123，h = 98，deg = 35并且得到计算框大小
 var deg = 35; 
 var bw = 156.9661922099485; 
 var bh = 150.82680201149986; 
 
 //计算w和h 
 var xMax = bw / 2; 
 var yMax = bh / 2; 
 var radian =（deg / 180）* Math.PI; 
 var cosine = Math.cos（弧度）; 
 var sine = Math.sin（弧度）; 
 var cx =（xMax * cosine）+（yMax * sine）/（余弦*余弦+正弦*正弦）; 
 var cy =  - （ - （xMax * sine） - （yMax * cosine）/（cosine * cosine + sine * sine））; 
 var w =（cx * 2  -  bw）* 2; 
 var h =（cy * 2  -  bh）* 2; 
  

但是...答案与w和h不匹配
< DIV类= h2_lin>解决方案

解决方案

通过<$ c $给定包围盒尺寸 bx c> by 和 t 是矩形的逆时针旋转，大小 x 由 $ / code>：



  x =（1 /（cos（t）^ 2-sin （t）^ 2））*（bx * cos（t）-by * sin（t））
y =（1 /（cos（t）^ 2 -sin（t）^ 2））* bx * sin（t）+ by * cos（t））
  





派生

这是为什么？

首先，考虑长度 bx 分成两部分，在矩形的拐角处放置 a 和 b 。使用三角函数以 x ， y 来表示 bx ， theta ：

  bx = b + a 
 bx = x * cos（t）+ y * sin（t）[1] 
  

by ：

  by = c + d 
 by = x * sin（t）+ y * cos（t）[2] 
  

1 和 2 可以矩阵形式表示为：

  [bx] = [cos（t ）sin（t）] * [x] [3] 
 [by] [sin（t）cos（t）] [y] 
  

请注意，矩阵几乎是一个旋转矩阵（但不完全是 - 它的减号是负号）。

将矩阵的左右分开，给出：

$ $ $ $ $ $ $ $ $ $ t）sin（t）] * [bx] [4]
[y] [sin（t）cos（t）]）[by]


在矩阵逆是容易评估为一个2×2矩阵和扩展为：

  [x] =（1 /（cos（t）^ 2 -sin（t）^ 2））* [cos t）-sin（t）] * [bx] [5] 
 [y] [-sin（t）cos（t）] [by] 
  

$ b $ [5]给出了两个公式：

$ p $ x =（ 1 /（cos（t）^ 2 -sin（t）^ 2））*（bx * cos（t） - by * sin（t））[6] ^ 2 -sin（t）^ 2））*（ - bx * sin（t）+ by * cos（t））


易如反掌！

I read the http://goo.gl/HKMtO to know how to calculate bounding box coordinates from a rotated rectangle.But in a special case as follow image:

How to get the rotated rectangle size if had get the bounding box size, corrdinates and rotate degree?

I try write code in javascript

//assume w=123,h=98,deg=35 and get calculate box size
var deg = 35;
var bw = 156.9661922099485;
var bh = 150.82680201149986;

//calculate w and h
var xMax = bw / 2;
var yMax = bh / 2;
var radian = (deg / 180) * Math.PI;
var cosine = Math.cos(radian);
var sine = Math.sin(radian);
var cx = (xMax * cosine) + (yMax * sine)   / (cosine * cosine + sine * sine);
var cy =  -(-(xMax * sine)  - (yMax * cosine) / (cosine * cosine + sine * sine));
var w = (cx * 2 - bw)*2;
var h = (cy * 2 - bh)*2;

But...the answer is not match w and h

解决方案

Solution

Given bounding box dimensions bx by by and t being the anticlockwise rotation of rectangle sized x by y:

x = (1/(cos(t)^2-sin(t)^2)) * (  bx * cos(t) - by * sin(t))
y = (1/(cos(t)^2-sin(t)^2)) * (- bx * sin(t) + by * cos(t))

Derivation

Why is this?

First, consider that the length bx is cut in two pieces, a and b, by the corner of the rectangle. Use trigonometry to express bx in terms of x, y, and theta:

bx = b          + a
bx = x * cos(t) + y * sin(t)            [1]

and similarly for by:

by = c          + d
by = x * sin(t) + y * cos(t)            [2]

1 and 2 can be expressed in matrix form as:

[ bx ] = [ cos(t)  sin(t) ] * [ x ]     [3]
[ by ]   [ sin(t)  cos(t) ]   [ y ]

Note that the matrix is nearly a rotation matrix (but not quite - it's off by a minus sign.)

Left-divide the matrix on both sides, giving:

[ x ] = inverse ( [ cos(t)  sin(t) ]    * [ bx ]                        [4]
[ y ]             [ sin(t)  cos(t) ] )    [ by ]

The matrix inverse is easy to evaluate for a 2x2 matrix and expands to:

[ x ] = (1/(cos(t)^2-sin(t)^2)) * [ cos(t) -sin(t) ] * [ bx ]           [5]
[ y ]                             [-sin(t)  cos(t) ]   [ by ]

[5] gives the two formulas:

x = (1/(cos(t)^2-sin(t)^2)) * (  bx * cos(t) - by * sin(t))             [6]
y = (1/(cos(t)^2-sin(t)^2)) * (- bx * sin(t) + by * cos(t))

Easy as pie!

这篇关于从已知的边界框坐标计算旋转的矩形大小的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！