Hi all,
If i use the following code, in the last frame the line should become a single dot, but in the animation the line from previous frame remains. Can someone help me with it? Thanks a lot!
Plotly.plot(‘graph’, {
data: [{
x: [0,1,2],
y: [0, 1, 2],
line: {
color: ‘red’,
simplify: false,
}
}],
layout: {
sliders: [{
pad: {t: 30},
x: 0.05,
len: 0.95,
currentvalue: {
xanchor: ‘right’,
prefix: 'color: ',
font: {
color: ‘#888’,
size: 20
}
},
transition: {duration: 500},
// By default, animate commands are bound to the most recently animated frame:
steps: [{
label: ‘red’,
method: ‘animate’,
args: [[‘red’], {
mode: ‘immediate’,
frame: {redraw: false, duration: 500},
transition: {duration: 500}
}]
}, {
label: ‘green’,
method: ‘animate’,
args: [[‘green’], {
mode: ‘immediate’,
frame: {redraw: false, duration: 500},
transition: {duration: 500}
}]
}, {
label: ‘blue’,
method: ‘animate’,
args: [[‘blue’], {
mode: ‘immediate’,
frame: {redraw: false, duration: 500},
transition: {duration: 500}
}]
}]
}],
updatemenus: [{
type: ‘buttons’,
showactive: false,
x: 0.05,
y: 0,
xanchor: ‘right’,
yanchor: ‘top’,
pad: {t: 60, r: 20},
buttons: [{
label: ‘Play’,
method: ‘animate’,
args: [null, {
fromcurrent: true,
frame: {redraw: false, duration: 1000},
transition: {duration: 500}
}]
}]
}]
},
// The slider itself does not contain any notion of timing, so animating a slider
// must be accomplished through a sequence of frames. Here we’ll change the color
// and the data of a single trace:
frames: [{
name: ‘red’,
data: [{
x : [0,0.5,1],
y: [0, 0.5, 1],
‘line.color’: ‘red’
}]
}, {
name: ‘green’,
data: [{
x:[0,0.25,0.5],
y: [0, 0.25, 0.5],
‘line.color’: ‘green’}]
}, {
name: ‘blue’,
data: [{
x : [0,0,0],
y: [0, 0,0],
‘line.color’: ‘blue’}]
}]
});