Edit in JSFiddle

var $canvas = $('canvas:first');
var ctx = $canvas[0].getContext('2d');
var height = $canvas[0].height;
var width = $canvas[0].width;

// skip the built animation step for _tween.
$.fx.step._tween = $.noop;

// Draw a sine wave on a canvas
$canvas.animate({'_tween': 1}, {duration: 3000, step: function(now, fx) {
    if (fx.prop !== '_tween') {
        return false;   
    }
  
  var t = fx.pos; // current time
  var x = t * width; 
  var y = Math.sin(t*Math.PI * 2) * -(height/2) + (height/2);
  
  // start the path
  if (fx.pos === 0) {
    ctx.moveTo(x, y);
    ctx.beginPath();
  }
  
  // draw a line
  ctx.lineTo(x, y);
  ctx.stroke();
}});