Jump to content


Photo

Angular Js Directive Canvas

angular directive canvas

  • Please log in to reply
1 reply to this topic

#1 jbwebdesign

jbwebdesign

    Advanced Member

  • Member
  • PipPipPipPip
  • 169 posts
  • LocationNew York

Posted 23 January 2015 - 10:20 AM

Hello, I am working on creating an angular js directive for using HTML5 Canvas

 

My goal is to output a canvas and use Font Awesome icons for writing inside of the canvas.

 

My code is the following, however the problem i have is that the font awesome icons don't seem to render: 
 

angular.module('myApp')
.directive('customButtonCanvas', ['$document', function($document) {
  return {
    restrict: 'A',
    scope: {
      width : '=',
      height : '=',
      options : '='
    },
    link: function(scope, element){
      console.log(scope);
      console.log(element);
      //first lets get the canvas element from our template....
      var ctx = element[0].getContext('2d');
      ctx.font = "40px FontAwesome";
      ctx.fillText("\uf000", 120, 120);
      console.log(ctx);

    }
  };

}]);

any help with this will be greatly appreciated.

 

thanks!


  • 0

#2 Stefan

Stefan

    Stefan Mischook

  • Administrators
  • 4,342 posts
  • LocationMontreal Canada

Posted 28 January 2015 - 11:30 AM

I've only played with Angular ... but do you need to link to the FontAwesome library somewhere?

 

Sorry, that's all I got for now.

Stef


  • 0
StudioWeb makes teaching web design and programming easy: StudioWeb




0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users

★★★★★ 5 Star Rated Web Developer Course - check it out now!