Wednesday, May 4, 2011

Animation

<script type="text/javascript+protovis"
    var graphangle = 0;
    var vis = new pv.Panel()
    .width(360
    .height(150)
    .fillStyle("rgba(255,0,0,0.2)");     
     
    vis.add(pv.Line) 
        .data(pv.range(1,360,50))
        .top(function(d) Math.sin((graphangle + d) % 360 *Math.PI/180)*-50 + 75
        .left(function(d) d)
        .size(0.05)
        .strokeStyle("blue"); 
         
        setInterval(function() {graphangle = (graphangle + 1) % 360; vis.render();}, 1);
</script>

Animation using pv.Line and Math.sin() Function

No comments:

Post a Comment