2

次の形式のマトリックスを持つ SVG ファイルから四角形の位置と回転を読み取っています。

<rect transform="matrix(1.02414 -0.133308 0.122628 0.942091 190.767 780.999)" width="122" height="20"/>

今、私はこれらの値を Lua に解析して、このようなコロナと物理学で描画しようとしていますが、それらは部分的に誤りになり、現在の半分推測のアプローチでもしばしば NAN になります。上記の行列を適切な Lua 回転 (度単位) に変換するにはどうすればよいですか?

私がこれまでに持っているものは以下のとおりです (values 配列は、SVG の順序でのマトリックス値です)。ありがとう！

local x = values[5]; local y = values[6]
local rotation = math.acos(values[1])
if values[2] < 0 then rotation = -rotation end
rotation = math.floor( math.deg(rotation) )
rotation = rotation % 360

app.spritesHandler:createBar( math.floor(x), math.floor(y), rotation )

ここに画像の説明を入力

4

2 に答える 2

5

まず、1から6ではなく、0から5までのインデックスを作成する必要があると思います。

仕様によると、回転行列は次のとおりです。

a  c  e
b  d  f
0  0  1

ここで、afはマトリックスリストの6つの数値です。

また、rotate(angle,cx,cy)アラウンドcx,cyは同等であることがわかります

  1. Translate（cx、cy）
  2. 回転（角度）
  3. Translate（-cx、-cy）

これは次のようになります。

|1 0 cx|  |cos(t) -sin(t) 0|  |1 0 -cx|
|0 1 cy|  |sin(t)  cos(t) 0|  |0 1 -cy|
|0 0 1 |  |  0       0    1|  |0 0  1 |

  |cos(t)   -sin(t)  cx|  |1 0 -cx|
= |sin(t)    cos(t)  cy|  |0 1 -cy|
  |   0        0      1|  |0 0  1 |

  |cos(t)   -sin(t)  (-cx cos(t) + cy sin(t) + cx) |
= |sin(t)    cos(t)  (-cx sin(t) - cy cos(t) + cy) |
  |  0         0              1                    |

したがって、これは、角度情報が係数a、b、c、およびdで完全に独立して利用できることを示しています。適用されるのがこの行列だけである場合、aとdは一致する必要があり、bとcはちょうど反対の符号である必要があります。

ただし、数値のリストを見ると、そうではないので、他の変換も適用されているのではないでしょうか。コメント提供者が指摘しているように、数値は1を超えているため、ある角度での単純な三角関数の結果ではありません。

1つの可能性は、スケーリングも行われていることです。そのマトリックスは次のとおりです。

| sx 0  0|
|  0 sy 0| 
|  0  0 1|

したがって、それを最初に適用し、次に回転を適用すると、次のようになります。

| sx 0  0| |cos(t)   -sin(t)  (-cx cos(t) + cy sin(t) + cx) |
|  0 sy 0| |sin(t)    cos(t)  (-cx sin(t) - cy cos(t) + cy) |
|  0  0 1| |  0         0              1                    |

  |sx cos(t)   -sx sin(t)   sx (-cx cos(t) + cy sin(t) + cx) |
= |sy sin(t)    sy cos(t)   sy (-cx sin(t) - cy cos(t) + cy) |
  |  0               0                  1                    |

そのマトリックスから：

a/c = sx cos(t) / (-sx sin(t))
    = - cos(t) / sin(t)
    = 1/tan(t)
tan(t) = c/a

tan(t) = 0.122628/1.02414
       = 0.119738
    t  = 6.82794 degrees.

画像からすると、それはほぼ正しいと思います。

知っているのでt、sxとsyを計算できます。

a = sx cos(t) 
sx = a/cos(t) = 1.0315

そしてsy：

d = sy cos(t)
sy = d/cos(t) = 0.94882

回転の中心を取得cxしcyて見つけることは、すでに取得した値を使用して、上記のeとfの方程式にさらに代入することです。

于 2013-03-21T12:01:38.373 に答える
1

のように、回転と合わせて伸ばしているようv[4]/v[1] == -v[3]/v[2]です。
したがって、回転は次のように計算できます。 

local str = '<rect transform="matrix(1.02414 -0.133308 0.122628 0.942091 190.767 780.999)" width="122" height="20"/>'
local v = {}
str:match'matrix(%b())':gsub('[%d.-]+', function(d) v[#v+1] = tonumber(d) end)
local x, y = unpack(v, 5)
local rotation = math.floor(math.deg(math.atan2(v[3], v[4]))) % 360
于 2013-03-21T12:33:29.867 に答える