2010-06-01 5 views
0

vml/canvas/svg를 사용하여 3D로 텍스트를 표시하고 Photoshop에서 Ctrl + T의 효과와 같은 텍스트 모양으로 변형하거나 텍스트 줄을 커브에 정렬해야합니다. 예를 들어, 일반 텍스트를 회전, 사다리꼴/사각형 모양으로 변환합니다.VML/canvas/SVG에서 텍스트를 모양으로 변환 할 수 있습니까?

그래서 먼저 텍스트를 모양으로 변환하는 방법이 있습니까?

이상한 것은 아니지만 괜찮은 파이어 폭스는 가까운 getImageData()입니다. 더 좋은 방법? 브라우저 별 해킹이나 부두를 사용

은 OK입니다,하지만 플래시

+1

여기서 정확히 무엇을 요구하고 있는지 명확하지 않습니다. SVG에서 최소한 텍스트를 변형하기 위해 모양으로 변환 할 필요는 없습니다. 'textPath' 엘레멘트는 경로 상에 텍스트를 놓는다. 한 글자의 일부로해야 할 특정한 변형이 있습니까? – Ken

+0

@Ken 귀하의 팁은 매우 유용합니다. 나는 그것을 조사하고 있습니다. 특정 변형에 대해서는 텍스트를 회전 된 사다리꼴 형식으로 변환합니다. 그것은 실현 가능합니까? – est

+1

아쉽게도 SVG 1.1은 아핀 변환만을 지원하지만 원근 투영은 지원하지 않는 것처럼 보입니다. 오늘은 도움이되지 않지만 SVG 2.0의 위시리스트에있는 것으로 보입니다 : http://www.w3.org/TR/SVG2Reqs/#req-graphics http://www.svgopen.org/2008/ papers/86-Achieving_3D_Effects_with_SVG/# section_4_4_creating_perspective_effects_using_future_features – Ken

답변

0

많은 stackoverflow 게시물 이후에, 최선의 해결책은 inkscape를 사용하는 것입니다.

그래서 Javascript 나 HTML5 또는 캔버스 또는 SVG에서는이를 수행 할 수 없습니다.

1

당신은 isometric projections 간단한을 할 SVG에 스큐 변환을 사용할 수 있습니다 :)주세요. HTML5 캔버스도 마찬가지입니다. 다른 유형의 원근 투영을 원한다면 클리핑과 결합 된 여러 변형 또는 SVG 필터 (예 : Hans Schmucker here의 일부 예제 참조)를 수행하는 방법도 있습니다.

관련 문제