My Cunstom Jquery Plugings

my_jquery_plugings.md

Custom Jquery Plugin

---

Rotate Canvas Image from the center registration poing using degree

      /**
      *  Rotate Image in Canvas
      *  @params degree : degree to rotate
      */
      $.fn.rotateCanvasImageFromCenter = function(degree){
        this.each(function(){
          // canvas
          var canvas = this;
          // canvas context
          var context = canvas.getContext('2d');
          // Move registration point to the center of the canvas
          context.translate(440/2, 310/2);
          // Rotate 1 degree
          context.rotate(degree*Math.PI/180);
          // Move registration point back to the top left corner of canvas
          context.translate(-440/2, -310/2);
        });
      }
      
      // Using the plugin
      $('#canvas1').rotateCanvasImageFromCenter(90);
      $('.canvas2').rotateCanvasImageFromCenter(40);