How can I use animate method ?
Nadie ha tomado este issue todavía.
Evaluación
- Dificultad
- 4/5
- Tiempo estimado
- 3-5 días
- Aptitud para principiantes
- 25/100
- Tipo de issue
- Nueva funcionalidad
- Claridad
- Necesita aclaración
- Estado de actividad
- Estancado
- Stack tecnológico
- javascript, react
- Área
- data-visualization, frontend
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.
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 });
- Lenguaje dominante
- JavaScript
- Estrellas
- 1.1k
- Forks
- 138
- Métricas de merge de PR
- Sin PR fusionados en 30 d
Preparar el entorno
Este proyecto no incluye contenedor de desarrollo, Dockerfile ni guía de contribución, así que la configuración corre por tu cuenta: empieza por su README y consulta nuestra guía para la primera contribución para los pasos generales.
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.
Más de plotly/react-plotly.js
-
P3 plotly-internal size: 1 task
Dificultad 3/5 1-2 días Aptitud para principiantes 45/100
plotly/react-plotly.js#386 ·
-
Dificultad 4/5 3-5 días Aptitud para principiantes 48/100
plotly/react-plotly.js#358 · 1 comentario ·
-
Dificultad 4/5 3-5 días Aptitud para principiantes 35/100
plotly/react-plotly.js#354 ·
-
Dificultad 3/5 1-2 días Aptitud para principiantes 30/100
plotly/react-plotly.js#353 · 1 comentario ·
-
Dificultad 4/5 3-5 días Aptitud para principiantes 35/100
plotly/react-plotly.js#352 · 1 comentario ·
Todos los issues de plotly/react-plotly.js
Issues similares
-
Dificultad 2/5 1-3 horas Aptitud para principiantes 66/100
riverqueue/river#1576 ·
Los mantenedores suelen responder en 1 día
-
documentation good first issue
Dificultad 1/5 Menos de una hora Aptitud para principiantes 72/100
Los mantenedores suelen responder en 1 día
-
good first issue help wanted
Dificultad 1/5 Menos de una hora Aptitud para principiantes 88/100
modrollstudio/Modroll-Studio-Website#80 · 1 comentario ·
Los mantenedores suelen responder en 1 día
-
Add tests for CSV email parsingAbiertogood first issue help wanted
Dificultad 2/5 1-3 horas Aptitud para principiantes 85/100
mafzalkalwardev/mailforge#21 ·
-
good first issue help wanted
Dificultad 1/5 Menos de una hora Aptitud para principiantes 82/100