web 动画

 drawBackground:function(){

     var w=this.cBox.w,h=this.cBox.h,x=this.cBox.x,y=this.cBox.y;

     xgd=(this.xColumns)? w/(this.xColumns-1):0;

     ygd=(this.yRows)?h/(this.yRows-1):0;

     this.ctx.fillStyle='silver';

     for(i=xgd;i<=w;i+=xgd)

                this.ctx.fillRect(x+i,y,l,h-1);

     for(i=h-ygd;i>=0;i-=ygd)

              this.ctx.fillRect(x+1,y+i,w,l);}

 

drawLine:function(index){

           var line=this.series[index],

                 len=line.values.length;

          var rate=this.cBox.h/this.yRange,

                  yoffset=this.yMin*rate;

           if(!len) return;

        var ylen=line.values[0]*rate,

                 bBase=this.cBox.b+yOffset;

           var x=this.cBox.x,y=bBase-yLen;

          this.ctx.strokeStyle=line.color;

          this.ctx.lineWidth=line.width;

          this.ctx.beginPath();

       var  tx=x,ty=y;

         this.ctx.moveTo(tx,ty);

          for(var i=l;i<len;i++){

              yLen=line.values[i]*rate;

                tx+=this.xStep,ty=bBase-yLen;

                         this.ctx.lineTo(tx,ty);}

               this.ctx.stroke();

               tx=x,ty=y;

         for(var i=1;i<len;i++){

                    yLen=line.values[i]*rate;

                     tx+=this.xStep,ty=bBase-yLen;

                       this.drawDot(tx,ty,3,line);}}