Canvas, Javascript, Properties, HTML, Table, List, Obvious Tags

Some of you _may_ find this useful...

A list of Canvas properties captured via AJAX, stored in a MySQL database via PHP which also converts this to an HTML table (with colouring)

Across the X axis is placed the browser's User Agent string.

The Y axis is the Javascript property name.

Each cell is the data returned from the Javascript Object.prototype.toString() call (there are SOOO many tricks one can perform here the possibilities are stunning. Especially once you roll in typeof and other chums... brilliant!).

Each table cell is coloured.

Grey means that this property did not exist in the given browser.

A yellow row means that this property existed on all platforms but gave different results in at least one case.

A default setup is used. That is canvasElement.getContext('2d') has been called but no other canvas functions.

Interesting Differences

Colours

Safari reports CSS style named colours. All others report 6 digit hex (what about alpha).

Properties

Safari supports a whole bunch of set$propertyName type calls. No others do.

Shadows

Safari has a clearShadow routine (sensible!)

Bitmaps

All except Safari support get and put image data functions.

Firefox/Mozilla has the handy drawWindow. Kinda useful. Renders web content into a Canvas. However, there's a ton of security restrictions. This could be a useful way of getting images from local applications into the web browser.

Transforms and Coordinates

All except Safari support the very useful "setTransform".

All except Safari support the, also the useful, "transform".

All except Safari support the slightly odd but useful "isPointInPath".

I'd like to see a transformPoint function TBH.

Text

Mozilla support text. It's quite nice in its own way BUT... don't expect miracles. The last time I tested it anti-aliasing doesn't when text is drawn along a path.

See mozText. I must check newer browsers for fillText and strokeText.

Notes

The following are untested as I did this before...

Google's "Chrome" arrived on the (so called) scene.
WebKit got embedded in Qt.
Opera 9.62 came out with it's nice new debugger.
Wii.

If hassled I might let someone have the TERRIBLE source code. This was lashed together in an evening to solve a problem. It is "engineer" code... :-D

Lastly, I think we should separate out the matrix math from Canvas and create a Matrix library for Javascript. Also useful would be a Vector library. Given Javascript's type flexibility the internal state could be packed arrays of 32 bit floats (or double if you wish) and there are excellent libraries out there to optimise the jebus out of this stuff.

L8trz,
Burnttoy.