Canvas is an element of HTML5 that allows for dynamic, scriptable rendering of 2D shapes and bitmap images that is currently supported by Mozilla Firefox, Google Chrome, Safari and Opera.

Wednesday, December 21st, 2005

CanvasGraph.js: Graphing in Javascript

Category: Canvas

Canvas Graph is a small simple javascript library that allows you to conveniently plot simple line, bar and pie charts using the new HTML Canvas Tag. The script uses the MochiKit library, and features: Plot bar charts, line graphs and pie charts Plot multiple datasets on one graph. Data input from javascript arrays, or even Read the rest…

Posted by Dion Almaer at 9:30 am
Comment here

3.8 rating from 15 votes

Thursday, December 15th, 2005

Killer effects with Canvas

Category: Canvas, UI

Romain Guy is a top guy at Sun, known for his awesome effects and look and feels in Java Swing. He had a look on the Ajax side recently though, when he took Canvas for a ride. Take that rich UI frameworks! :) Source Code function drawCD() { var g2 = document.getElementById(“cdCover”).getContext(“2d”);; g2.translate(0, cdCase.height Read the rest…

Posted by Dion Almaer at 1:28 am

3.8 rating from 8 votes

Friday, December 2nd, 2005

Taking Firefox 1.5 for a ride with SVG and Canvas

Category: Browsers, Canvas, Firefox

As soon as Firefox 1.5 comes out, people want to play with some of the shiny nobs. SVG: How Did The Moon Get Into Orbit? One of the early post-release examples of SVG support on Firefox 1.5 was this demo showing moon orbits. If you take a peak into the source you see the magic Read the rest…

Posted by Dion Almaer at 8:51 am

4.1 rating from 15 votes

Friday, September 16th, 2005

Canvas Examples for Firefox 1.5

Category: Browsers, Canvas, Firefox

With Firefox 1.5 Alpha 2, Firefox includes a new HTML element for programmable graphics. <canvas> is based on the WhatWG canvas specification, which itself is based on Apple’s <canvas> implemented in Safari. It can be used for rendering graphs, UI elements, and othercustom graphics on the client. <canvas> creates a fixed size drawing surface that Read the rest…

Posted by Dion Almaer at 7:28 am

3.9 rating from 10 votes