매트릭스 회전 후 정확한 x, y 위치를 얻는 방법은 무엇입니까?

Question

포럼에서 물론 많이 찾았지만 확실한 해결책을 찾지 못했습니다. similar issues을 찾았지만 작동하지 않습니다.

직사각형을 그릴 때 Inkscape는 정확한 x 및 y 위치를 제공합니다. 그러나 회전 할 때 x 및 y 위치가 이해할 수없는 값으로 변경됩니다. 예를 들어 회전 할 때, 좀 봐

<rect 
    id="rect2985" 
    width="100" 
    height="100" 
    x="100" 
    y="100" /> 

괜찮아,하지만 속성과 X에서을 "변환", Y :

<rect 
    id="rect2985" 
    width="100" 
    height="100" 
    x="4.9038105" 
    y="154.90381" 
    transform="matrix(0.8660254,-0.5,0.5,0.8660254,0,0)" /> 

어떻게 X = 100, Y = 100을 얻을 계산할 수 있습니다 x = 4.9 ... 및 y = 154.9 ... 또는 행렬 값?

Answer 1

x=100 y=100 값을 유지하려면 다른 변환 행렬을 계산해야합니다. 난 당신이에 관심이 있다면 확실하지 않다

transform = "translate(150, 150) rotate(45) translate(-150, -150)" 

: 뭔가처럼 될 것이다 속성을 변환 귀하의 경우에는

translate(-(x + centerX), -(y + centerY)) 
rotate(angle) 
translate(x + centerX, y + centerY) 

: 광장의 중심 위에 회전 3 개 변환에 해당합니다 수학 또는 단순히 변환 행렬을 원한다. 단지 최종 매트릭스 값을 원한다면,이 바이올린을 볼 수 있습니다 : http://jsfiddle.net/mihaifm/PQvBj/

매트릭스 값을 얻기 위해 getCTM을 사용했습니다.

최종 결과 (45도 회전을 가정)

<rect 
    id="rect4" 
    width="100" 
    height="100" 
    x="100" 
    y="100" 
    transform="matrix(0.7071067811865476, 0.7071067811865475, -0.7071067811865475, 0.7071067811865476, 150, -62.132034355964265)" />