현재 변환이 캔버스로 적용됩니다.

Question

html5 캔버스에서 적용되는 현재 변환을 어떻게 확인할 수 있습니까?

"transform", "setTransform"변환을 처리하는 두 가지 방법 만 지원하는 것으로 보이지만 변환 적용 결과를 찾을 수없는 것 같습니다.

자신을 모두 추적하고 네이티브로 수행해야하는 행렬 수학을 복제하지 않으면 어떻게 현재 변환을 파악할 수 있습니까?

Answer 1

당신은 변화에 영향을 미치는 기능 여기를 찾아보실 수 있습니다 :

http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#transformations

을 당신이 setTransform 기능을 사용하는 경우, 현재는 행렬이 단위 행렬로 설정되어 변환 한 후이 설정 한 것을 사용합니다.

그 시점에서 현재 변환 매트릭스가 있습니다.

이제 다시 설정하고 다른 변환 방법을 호출하기 시작합니다. 무엇이 필요한지 알고 싶다면 수학을 수행하여 변환 행렬을 계산하기가 쉽습니다. , 자신의 변환 함수를 사용하여 변환을 설정하면 계산 한대로 변환 할 수 있습니다.

당신이 할 수 없다면, 현재 운이 나쁘지 만,이 게시물에도 같은 문제가 있으므로 새로운 기능을 추가하기를 청원하고 싶을 수도 있습니다. getTransform.

http://forums.whatwg.org/viewtopic.php?t=4164

Answer 2

나는 캔버스에이 방법을 추가하는 래퍼를했습니다. 현재 활용하는 방법에 대한이 아닌 솔루션 변환 있지만

http://proceduralgraphics.blogspot.com/2010/03/canvas-wrapper-with-gettransform.html

Answer 3

, 그것은 상황이 막아 를 포함하는 것이 유용한 사실이 될 수있다()과 밀어하는 데 사용할 수 있습니다() 기능을 회복 현재 컨버팅 매트릭스를 포함하는 팝업 컨텍스트 상태. (그것을 사용하여 스택을 구현하기 위해 유사하게 나에게 위해 getTransform를 찾고 있던 사람, 사람들을, 도움이 될 적어도 ...)

Answer 4

파이어 폭스의 캔버스 2D 컨텍스트가 (비표준) mozCurrentTransform 및 mozCurrentTransformInverse 속성.

WhatWG는 이제 currentTransform 및 currentTransformInverse 속성을 정의합니다 (전자는 쓰기 가능 상태 임).

http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#transformations

그러나

당신이 휴대 성을 원하는 경우로 수동 매트릭스를 추적으로 후퇴 할 것이다, 그래서이 아마 보편적으로, 아직 얼마 동안 브라우저에서 구현되지 않습니다 다음은 스펙의 관련 부분입니다 @Dave와 @James는 말한다.

모든 남자와 그의 개가이 같은 Canvas-transform-matrix-tracker를 작성한 것으로 보입니다. 방금 @Dave Lawrence의 것을 보았습니다. 나는 내 방식이 다른 방식으로 열등하다는 점을 확신하지만 몇 가지면에서 나보다 훌륭하다고 생각한다.

• 내 사용자 JS 코드에 대한 변경을 필요로하지 않습니다 - 당신은 단지 스크립트 태그를 추가하고 갈 수 있어요 그래서, 캔버스 및 상황에 프로토 타입을 수정합니다.
• currentTransform 속성의 설정을 가로 채고 있습니다.
• 자신이해야 할 일만하기 위해 노력합니다.

최신 Chrome 및 Firefox에서 작동하지만 아직 IE에서 테스트하지 않았습니다.

code, code, wonderful code 

I : 여기 http://jsfiddle.net/XmYqL/1/

이 날 (?)을 jsfiddle 링크를 할 수 있도록 유래를 달래기 위해 코드 블록 :

나는 간단한 시연과 더불어, jsfiddle에 광산을 넣어 마지막으로 GitHub의 내 polyfill을 업로드 주위에 도착 :

https://github.com/supermattydomain/canvas.currentTransform.js

을 나는 알고 완벽하지는 않지만이 문제에 대한 하나의 진정한 해결책을 구현할 때 우리 모두가 함께 일하는 것을보고 싶습니다. 나는 그것이 내 것이 든 다른 누군가의 것이 든 상관 없습니다. JavaScript/HTML5/Canvas의이 코너는 발칸 제국과 너무 흡사합니다. 바로 부분 솔루션의 바다입니다. 모두, 포크 광산, 귀하의 변경 사항을 추가하고 당겨 요청을 보내, 또는 귀하의 코드를 병합 할 수 있도록 나에게 귀하의 URL을 보내십시오, 또는 너의 것과 내 도매를 대체하거나 뭐든간에. 이것은 내가 단지 손톱에 넣고 싶은 어리석은 문제입니다. 우리가 함께하면 우리가 할 수 있습니다.