2012-06-20 3 views
0

웹 응용 프로그램에서 svg-Code를 생성하려고합니다.SVG rotate elemets 삭제

<?xml version="1.0" encoding="UTF-8"?> 
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> 
<svg xmlns="http://www.w3.org/2000/svg" 
    xmlns:xlink="http://www.w3.org/1999/xlink" 
    xmlns:ev="http://www.w3.org/2001/xml-events" 
    version="1.1" baseProfile="full" 
    width="1000px" height="600px"> 
    <rect x="147.50198255352893" y="109.43695479777953" width="15.860428231562253" height="295.79698651863595" stroke="rgb(0,0,0)" fill="rgb(255,255,255)" stroke-width="3" transform="rotate(20 155.43219666931006 257.3354480570975)"/> 
    <rect x="163.36241078509119" y="405.2339413164155" width="379.85725614591587" height="-23.79064234734335" stroke="rgb(0,0,0)" fill="rgb(255,255,255)" stroke-width="3" transform="rotate(20 353.2910388580491 393.3386201427438)"/> 
    <rect x="543.219666931007" y="381.44329896907215" width="22.204599524187188" height="-353.6875495638382" stroke="rgb(0,0,0)" fill="rgb(255,255,255)" stroke-width="3" transform="rotate(20 554.3219666931006 204.59952418715304)"/> 
</svg> 

세 사각형을 회전하지만, 어떻게 든 크롬, 사파리, 그리고 잉크 스케이프 만 그들 중 하나가 표시가 있어야한다 : 다음은 예제 출력입니다. 나는 구글을했는데 무엇이 잘못되었는지 전혀 모른다. 귀하의 도움을 위해서 Thx.

답변

2

두 번째 및 세 번째 부정적인 높이로 인한 문제입니다. <rect />.

이 코드를 자동으로 생성하는 경우이 값이 양수인지 확인하십시오. 예를 들어, JavaScript를 사용하여 Math.abs(height)으로 묶습니다.

+0

정말 고마워요. 이제 아주 분명해 보입니다. 요소를 만드는 방법을 편집해야했습니다. 고마워요! – Teris