为什么我写环图的时候动画没执行完就被会消失？

来源：

qq_小河_1

2016-06-12

var h5componentring = function(name,cfg){

if(cfg.data.length>1){

cfg.data=[cfg.data[0]];

};

cfg.type='pie';

var component=new h5componentpie(name, cfg);

component.addClass('h5_component_ring');

var mask=$('<div class="mask"></div>');

component.append(mask);

var text=component.find('.text');

text.attr('style','');//清空text原来样式

if (cfg.data[0][2]) {

text.css('color',cfg.data[0][2]);

};

mask.append(text);

return component;

};

写回答

3回答

Lyn

2016-06-13

已采纳

群：545307353 直接私聊：讲师-Lyn

qq_小河_1

非常感谢！

2016-06-13

共1条回复

Lyn

2016-06-13

因为这部分的动画是关于 mask （遮罩层）的显示，当进度为 1 的时候应该清空遮罩层。

var draw = function( per ){
    ctx.clearRect(0,0,w,h);
    ctx.beginPath();
    ctx.moveTo(r,r);
    if(per <=0){
      ctx.arc(r,r,r,0,2*Math.PI);
      component.find('.text').css('opacity',0)
    }else{
      ctx.arc(r,r,r,sAngel,sAngel+2*Math.PI*per,true);
    }
    ctx.fill();
    ctx.stroke();
    if( per >= 1){
      component.find('.text').css('opacity',1);
      ctx.clearRect(0,0,w,h);
    }
  }