WWW FAQs: What is Canvas?

2006-06-01: Canvas is a simple vector graphics interface for JavaScript. Currently supported by the Safari and Firefox web browsers, Canvas allows any web page to include attractive graphs and other interactive graphics drawn "on the fly" by JavaScript code. Because of its simplicity, Canvas is an attractive alternative to SVG for many applications. And its open nature makes it an interesting alternative to Flash. However, Microsoft's Internet Explorer does not currently support Canvas. That is likely to change as compelling Canvas-based websites appear, encouraging users to download Firefox in order to use them.

Canvas is not a file format, so there's no such thing as saving a drawing in a "Canvas file." Of course, a web designer could easily store Canvas commands in a file and load them via PHP.

Canvas is a project of the Web Hypertext Application Technology Working Group (WHATWG), a "loose unofficial collaboration of Web browser manufacturers and interested parties who wish to develop new technologies designed to allow authors to write and deploy Applications over the World Wide Web."

For more information, see the Mozilla Developer Center's excellent article Drawing Graphics with Canvas.

Legal Note: yes, you may use sample HTML, Javascript, PHP and other code presented above in your own projects. You may not reproduce large portions of the text of the article without our express permission.

Got a LiveJournal account? Keep up with the latest articles in this FAQ by adding our syndicated feed to your friends list!