Raphaël (JavaScript library)

Cross-browser vector graphics JavaScript library


title: "Raphaël (JavaScript library)" type: doc version: 1 created: 2026-02-28 author: "Wikipedia contributors" status: active scope: public tags: ["javascript-visualization-toolkits", "javascript-libraries", "free-software-programmed-in-javascript", "software-using-the-mit-license", "2008-software"] description: "Cross-browser vector graphics JavaScript library" topic_path: "technology/web" source: "https://en.wikipedia.org/wiki/Raphaël_(JavaScript_library)" license: "CC BY-SA 4.0" wikipedia_page_id: 0 wikipedia_revision_id: 0

::summary Cross-browser vector graphics JavaScript library ::

::data[format=table title="Infobox software"]

FieldValue
nameRaphaël
logoRaphaël logo.svg
logo size64px
developerDmitry Baranovskiy
released
latest release version2.3.0
latest release date
programming languageJavaScript
licenseMIT License
website
::

| name = Raphaël | logo = Raphaël logo.svg | logo size = 64px | developer = Dmitry Baranovskiy | released = | latest release version = 2.3.0 | latest release date = | programming language = JavaScript | genre = | license = MIT License | website = Raphaël, named for Italian painter Raffaello Sanzio da Urbino, is a cross-browser JavaScript library that draws Vector graphics for web sites. It will use SVG for most browsers, but will use VML for older versions of Internet Explorer. Raphaël currently supports Chrome 5.0+ Firefox 3.0+, Safari 3.0+, Opera 9.5+ and Internet Explorer 6.0+.

Use

Raphaël is used by first creating an instance of the Raphaël object, which manages the creation of the canvas. The following examples create a canvas that is 320 pixels wide and 200 pixels high:

::code[lang=javascript] // top left of canvas at the viewport's 10,50 coordinate var r = Raphael(10, 50, 320, 200);

// top left of canvas at the top left corner of the #example element (in elements where dir="ltr") var r = Raphael(document.getElementById("example"), 320, 200);

// same as above var r = Raphael("example", 320, 200); ::

Once the Raphaël object has been instantiated, its various drawing, resizing and animation methods may be called to build up a vector graphic. This library includes support of Cùfon fonts, a format that turns a given font into a set of vector paths. It is extensible through plugins.

Usage

The widget is used on the Washington Post and the Times Online websites.

Raphaël is also used by iCloud.com, and by Mass Relevance in the White House.

References

References

  1. "Raphaël—JavaScript library".
  2. "Releases · DmitryBaranovskiy/raphael".
  3. "An Intro to Raphaël".
  4. [https://twitter.com/RaphaelJS/status/88762625986531329 Raphaël in White House: “we (@massrelevance) used @raphaeljs 2.0 for the map viz used during the #AskObama event today http://t.co/EcqROIi”]

::callout[type=info title="Wikipedia Source"] This article was imported from Wikipedia and is available under the Creative Commons Attribution-ShareAlike 4.0 License. Content has been adapted to SurfDoc format. Original contributors can be found on the article history page. ::

javascript-visualization-toolkitsjavascript-librariesfree-software-programmed-in-javascriptsoftware-using-the-mit-license2008-software