Created
October 11, 2016 22:11
-
-
Save jcward/eae4d07a60c286d2bedefcd226419f7c to your computer and use it in GitHub Desktop.
Quick test of EaselJS's Graphics.js (standalone, without the whole lib)
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <body> | |
| <canvas></canvas> | |
| </body> | |
| <script> | |
| var createjs = { | |
| createCanvas:function() { | |
| // Point to the canvas on the DOM | |
| return document.body.getElementsByTagName('canvas')[0]; | |
| } | |
| }; | |
| </script> | |
| <!-- CreateJS EaselJS, Mar 7, 2016, 631cdff --> | |
| <script src="https://rawgit.com/CreateJS/EaselJS/631cdffb85eff9413dab43b4676f059b4232d291/src/easeljs/display/Graphics.js"></script> | |
| <script> | |
| var g = new createjs.Graphics(); // sets canvas to 1x1, stores Graphics._ctx | |
| g.beginFill("#ff0000"); | |
| g.drawRect(10,10,50,50); | |
| g.endFill(); | |
| g.setStrokeStyle(10, "round"); | |
| g.beginStroke("#105"); | |
| g.moveTo(15,15); | |
| g.curveTo(80,60, 70, 15); | |
| // Resize canvas myself? | |
| // Note that calculating graphiics bounds is not currently supported: | |
| // - http://blog.createjs.com/width-height-in-easeljs/ | |
| var canvas = createjs.createCanvas(); | |
| canvas.width = 100; | |
| canvas.height = 100; | |
| // Draw onto our canvas context | |
| g.draw(createjs.Graphics._ctx); | |
| </script> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment