FlyLine
FlyLine copied to clipboard
请问您这个飞线效果能不能做成带箭头的?
请问您这个飞线效果加个箭头,要怎么加呢?谢谢! function drawQ(f){ var p1,p2; if(f.t1<1){ f.t1 += f.step; f.t1 = Math.min(1,f.t1); } if(f.t1>=f.l){ f.t2 += f.step; f.t2 = Math.min(1,f.t2); } p1 = getPointQuadRaticBeizer({x:0,y:0},f.ctl,{x:f.dis,y:0},f.t1); p2 = getPointQuadRaticBeizer({x:0,y:0},f.ctl,{x:f.dis,y:0},f.t2);
context.save();
context.translate(f.s.x,f.s.y);
context.rotate(f.r);
var grd = context.createLinearGradient(p2.x, p2.y,p1.x, p1.y);
grd.addColorStop(0,"rgba(255,255,255,0)");
grd.addColorStop(1,f.c);
grd.addColorStop(1,"rgba(255,255,255,0)");
context.beginPath();
context.strokeStyle = grd;
context.lineWidth = f.size;
context.moveTo(0,0);
context.translate(f.ctl.x,f.ctl.y);
context.rotate(45*Math.PI/180);
context.quadraticCurveTo(f.ctl.x,f.ctl.y,f.dis,0);
context.stroke();
context.beginPath();
context.fillStyle = f.c;
context.arc(p1.x,p1.y,f.size/2,0,Math.PI*2);
context.fill()
context.restore();
}