我在下面粘贴的代码可以正常工作,并定义了定时间隔。 (它使用了一些此处未显示的变量)。我遇到的问题是,如果我用raphael中的remove()函数删除路径对象myPath1或2,它不想绘制下一个或重绘自身。这似乎有点打破了路径方法。
我该怎么做?我希望能够重绘/恢复路径,但这需要它从零点开始,所以我想我也可以删除它。
var strokes1 = [ { stroke: "M "+second_start_circle+" 20", time: 0},
{ stroke: "l-70 70", time: 200},
{ stroke: "l800 0", time: 400}];
var drawnPath1 = strokes1[0].stroke;
var myPath1 = paper.path(drawnPath1);
myPath1.toBack();
var section1 = 1;
myPath1.attr({
"stroke-width": 8,
"stroke": color_services,
"stroke-opacity": 1
});
function animatePath1() {
if (section1 < strokes1.length) {
drawnPath1 += strokes1[section1].stroke;
myPath1.animate({
path: drawnPath1
}, strokes1[section1].time, animatePath1);
section1++;
}
}
var strokes2 = [ { stroke: "M "+third_start_circle+" 20", time: 0},
{ stroke: "l-70 70", time: 200},
{ stroke: "l500 0", time: 400}];
var drawnPath2 = strokes2[0].stroke;
var myPath2 = paper.path(drawnPath2);
myPath2.toBack();
var section2 = 1;
myPath2.attr({
"stroke-width": 8,
"stroke": color_about,
"stroke-opacity": 1
});
function animatePath2() {
if (section2 < strokes2.length) {
drawnPath2 += strokes2[section2].stroke;
myPath2.animate({
path: drawnPath2
}, strokes2[section2].time, animatePath2);
section2++;
}
}
答案 0 :(得分:3)
我将其更改为具有删除功能。将不得不优化这个代码(我自己学习的编码器,因为我相信你可以看到)。但现在它的工作方式与预期一致。
var strokes1 = [ { stroke: "M "+second_start_circle+" 20", time: 0},
{ stroke: "l-70 70", time: 200},
{ stroke: "l800 0", time: 400}];
var drawnPath1 = strokes1[0].stroke;
var myPath1 = paper.path(drawnPath1);
myPath1.toBack();
var section1 = 1;
function animatePath1() {
if (section1 < strokes1.length) {
drawnPath1 += strokes1[section1].stroke;
myPath1.attr({
"stroke-width": 8,
"stroke": color_services,
"stroke-opacity": 1
});
myPath1.animate({
path: drawnPath1
}, strokes1[section1].time, animatePath1);
section1++;
}
}
function removePath1(){
if (section1 == strokes1.length) {
myPath1.remove();
}
section1 = 1;
drawnPath1 = strokes1[0].stroke;
myPath1 = paper.path(drawnPath1);
myPath1.toBack();
}