Skip to content
Newer
Older
100644 81 lines (55 sloc) 2.33 KB
8553bb0 @corbanbrook project staging.
corbanbrook authored Mar 2, 2011
1 WebGL-2D
2 ========
3
c13c569 @corbanbrook started webgl-2d.js and added basic example.
corbanbrook authored Mar 2, 2011
4 #### HTML5 Canvas2D API in WebGL. ####
5
a04076c @corbanbrook Updating README.
corbanbrook authored Mar 3, 2011
6 **Authors:**
7
8 * Corban Brook [@corban](http://twitter.com/corban)
9 * Bobby Richter [@secretrobotron](http://twitter.com/secretrobotron)
10 * Charles J. Cliffe [@ccliffe](http://twitter.com/ccliffe)
8553bb0 @corbanbrook project staging.
corbanbrook authored Mar 2, 2011
11
12 This project aims to be a complete port of the Canvas2D API implemented in a WebGL context.
a04076c @corbanbrook Updating README.
corbanbrook authored Mar 3, 2011
13 WebGL-2D is a proof of concept and attempts to ascertain performance improvements over Canvas2D.
14
15 It should allow _most_ Canvas2D applications to be switched to a WebGL context.
8553bb0 @corbanbrook project staging.
corbanbrook authored Mar 2, 2011
16
41c39be @corbanbrook Added live demo link to README
corbanbrook authored Mar 5, 2011
17 Check out a [LIVE DEMO!](http://weare.buildingsky.net/webgl-2d/example.html)
18
a1328f1 @corbanbrook Added screenshot to README
corbanbrook authored Mar 4, 2011
19 ![20110304-qfkhgf9hjin5uk3we9rmgpwtf8.jpg](https://img.skitch.com/20110304-qfkhgf9hjin5uk3we9rmgpwtf8.jpg)
20
21
22 ### Usage ###
23
a04076c @corbanbrook Updating README.
corbanbrook authored Mar 3, 2011
24 Switching your Canvas2D sketch to a WebGL2D is very simple and only requires one additional line of code:
c13c569 @corbanbrook started webgl-2d.js and added basic example.
corbanbrook authored Mar 2, 2011
25
dfcb655 @corbanbrook Fixing lib to allow for multiple webgl-2d contexts at once
corbanbrook authored Mar 2, 2011
26 var cvs = document.getElementById("myCanvas");
27
28 WebGL2D.enable(cvs); // adds "webgl-2d" context to cvs
29
a04076c @corbanbrook Updating README.
corbanbrook authored Mar 3, 2011
30 var ctx = cvs.getContext("webgl-2d"); // easily switch between "webgl-2d" and "2d" contexts
8553bb0 @corbanbrook project staging.
corbanbrook authored Mar 2, 2011
31
71922c8 @corbanbrook Updating README to show status of supported Canvas2D API.
corbanbrook authored Mar 4, 2011
32 ### Supported Canvas2D Features ###
33
34 WebGL-2D is a work in progress and currently supports a very small subset of the Canvas2D API.
35
36 * strokeStyle
37 * fillStyle
cd8ad7d @corbanbrook Added strokeRect()
corbanbrook authored Mar 4, 2011
38 * strokeRect
71922c8 @corbanbrook Updating README to show status of supported Canvas2D API.
corbanbrook authored Mar 4, 2011
39 * fillRect
40 * translate
41 * rotate
42 * scale
f5bd869 @corbanbrook Adding save and restore to README
corbanbrook authored Mar 4, 2011
43 * save
44 * restore
10fcd47 @corbanbrook 1. Updated getters and setters for fillStyle and strokeStyle
corbanbrook authored Mar 5, 2011
45 * lineWidth
e0ef190 @corbanbrook Updating README to reflect function support.
corbanbrook authored Mar 10, 2011
46 * drawImage
4bd668b @corbanbrook Adding new supported functions to README.
corbanbrook authored Mar 16, 2011
47 * createImageData
48 * getImageData
49 * putImageData
981b39c @corbanbrook Updating supported function list.
corbanbrook authored Mar 6, 2011
50 * beginPath
51 * closePath
52 * moveTo
53 * lineTo
54 * rect
4bd668b @corbanbrook Adding new supported functions to README.
corbanbrook authored Mar 16, 2011
55 * fill*
56 * stroke*
57
58 *fill and stroke only work on straight line paths supported above, arc, and curves are not yet supported.
10fcd47 @corbanbrook 1. Updated getters and setters for fillStyle and strokeStyle
corbanbrook authored Mar 5, 2011
59
e0ef190 @corbanbrook Updating README to reflect function support.
corbanbrook authored Mar 10, 2011
60 All other properties or functions are currently stubbed. Properties are set to their defaults and functions are empty.
124a945 @corbanbrook Adding benchmarks blurb to README.
corbanbrook authored Mar 10, 2011
61
62 ### Benchmarks ###
63
64 WebGL-2D should be faster than Canvas2D at certain things and slower at others.
65 It is important that you know what to expect when using WebGL-2D with your
66 project.
67
68 The benchmarks directory contains benchmarks for testing performance
69
70 **asteroidsbench/**
71
72 [Kevin Roast](http://twitter.com/kevinroast) has graciously given permission to include this benchmark in the
73 WebGL-2D project.
74
75 This benchmark is perfect for testing real world canvas usage in game engine.
76 It relies heavily on 9 arg drawImage cropping to implement scrolling
77 backgrounds and stripstrip animations.
78
79 Visit his [website](http://www.kevs3d.co.uk/) for other HTML5 canvas demos as
80 well as the [asteroids game](http://www.kevs3d.co.uk/dev/asteroids/)
Something went wrong with that request. Please try again.