SVG Animate

티스토리 뷰

프로그래밍/SVG

쇠주는참이슬 2012. 3. 21. 13:02

막대바의 width 값이 0 에서 100까지 1초동안 애니메이트 된다.
정말 간단한 예제임.

이걸 응용한다면 차트까지도 만들 수 있겠지

bar

<html>

<body>

<p><b>Note:</b> This example only works in Firefox and Google Chrome.</p>

<animate attributeTransform="transform" attributeName="width" from="1" to="100" dur="1s" />

</rect>

</svg>

</body>

</html>

repeatCount="indefinite" 속성을 animate에 넣어주면 계속 반복된다.
column 컬럼은 나중에 다시...

SVG로 만든 기본 bar chart (2) - d3.js 이용 (0)	2012.03.21
SVG로 만든 기본 bar chart (1) - d3.js 이용 (0)	2012.03.21

공지사항

최근에 올라온 글

최근에 달린 댓글

링크

글 보관함