Wednesday, August 26, 2009

벡터 그래픽 생성 자바스크립트 라이브러리 - Raphaël

라파엘(Raphaël)은 웹상에서 벡터(vector) 그래픽을 생성할 수 있도록하는 작은자바스크립트 라이브러리입니다. 차트를 생성하거나 이미지 크롭 및 회전 등을 쉽고 간단하게 만들어낼 수 있습니다. 라파엘은 CANVAS요소를 사용하지 않고 W3C에서 정의한 SVG와 VML요소를 기반으로 그래픽을 생성합니다. 이것은 DOM요소와 결합하여 생성할 수 있음을 의미하며, 쉽사리 크로스-브라우저를 지원하는 것은 물론 자바스크립트 이벤트 핸들러와 결합하여 변화를 주는 것도 가능합니다.

// Creates canvas 320 × 200 at 10, 50 var paper = Raphael(10, 50, 320, 200); // Creates circle at x = 50, y = 40, with radius 10 var circle = paper.circle(50, 40, 10); // Sets the fill attribute of the circle to red (#f00) circle.attr("fill", "#f00"); // Sets the stroke attribute of the circle to white (#fff) circle.attr("stroke", "#fff");

No comments: