Created
October 4, 2015 13:55
-
-
Save miromannino/e6cb896328d1b030603b to your computer and use it in GitHub Desktop.
Use PaperJS with AngularJS (as reported in http://stackoverflow.com/a/32934066/2867909)
This file contains 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 ng-app="PaperAngularExample"> | |
| <head> | |
| <script type="text/javascript" src="bower_components/angular/angular.js"></script> | |
| <script type="text/javascript" src="bower_components/paper/dist/paper-full.js"></script> | |
| <script> | |
| var app = angular.module('PaperAngularExample', []); | |
| app.directive('draw', function() { | |
| return { | |
| restrict: 'A', | |
| link: function(scope, element, attrs) { | |
| var path; | |
| paper.setup(element[0]); | |
| var tool = new paper.Tool(); | |
| tool.onMouseDown = function(event) { | |
| path = new paper.Path(); | |
| path.strokeColor = 'black'; | |
| }; | |
| tool.onMouseDrag = function(event) { | |
| path.add(event.point); | |
| }; | |
| tool.onMouseUp = function(event) { | |
| //nothing special here | |
| }; | |
| } | |
| }; | |
| }); | |
| </script> | |
| </head> | |
| <body> | |
| <canvas draw resize></canvas> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment