plotly / plotly/react-plotly.js
How can I use animate method ?
Nadie ha tomado este issue todavía.
- Lenguaje dominante
- JavaScript
- Estrellas
- 1.1k
- Forks
- 138
- Merge medio
- 3 d 2 h
- PR fusionados (30 d)
- 4
Descripción
Plotly.animate("myDiv", { data: finalData }, { ...animationConfig });
Plotly.animate can be used with some css transtion effects, but there is no such method in react-plotly.js, how can I use this method ?thank you!
Here is a demo use animate
const animationConfig = {
transition: {
duration: 1000,
easing: "cubic-in-out"
},
frame: {
duration: 1000
}
};
// Initial Plot for Animation
const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9];
const initialData = [
{
x: numbers,
y: [0, 0, 0, 0, 0, 0, 0, 0, 0],
name: "square",
type: "bar"
},
{
x: numbers,
y: [0, 0, 0, 0, 0, 0, 0, 0, 0],
name: "cube",
type: "bar"
}
];
Plotly.newPlot("myDiv", initialData);
// Final Plot with Animation
const squares = numbers.map((x) => x * x);
const cubes = numbers.map((x) => x * x * x);
const trace1 = {
x: numbers,
y: squares,
name: "square",
type: "bar"
};
const trace2 = { x: numbers, y: cubes, name: "cube", type: "bar" };
const finalData = [trace1, trace2];
Plotly.animate("myDiv", { data: finalData }, { ...animationConfig });
Guía de contribución
No hay ninguna guía de contribución indexada para este repositorio
Primeros pasos
- Lee el issue completo y luego la guía de contribución del proyecto.
- Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
- Haz un fork del repositorio y trabaja en una rama.
- Abre un pull request que haga referencia al número del issue.
Línea de trabajo
No se mencionan archivos ni pruebas del repositorio. Comienza comparando el ejemplo proporcionado de Plotly.animate con la API de react-plotly.js y determina el comportamiento esperado del wrapper; done debería ser una forma decidida y reproducible de usar animaciones mediante esta biblioteca, o una explicación documentada de sus limitaciones.
Escrito por el modelo de indexación a partir del texto del issue.
Evaluación
- Stack tecnológico
- javascript, react
- Área
- data-visualization, frontend
- Tipo de issue
- Nueva funcionalidad
- Dificultad
- 4/5
- Tiempo estimado
- 3-5 días
- Estado de actividad
- Estancado
- Claridad
- Necesita aclaración
- Aptitud para principiantes
- 25/100