Introducción
En este proyecto, aprenderás a crear un gráfico de tendencias climáticas que muestre los datos de temperatura de una ciudad durante todo el año. El gráfico permitirá a los usuarios alternar entre los datos del mes actual y los datos de los próximos 7 días, brindando una visión integral de las tendencias climáticas.
👀 Vista previa
El efecto de alternancia entre "El mes actual" y "Los próximos 7 días" se muestra en la figura siguiente:
El efecto de cambio de mes es el siguiente:
🎯 Tareas
En este proyecto, aprenderás:
- Cómo obtener datos climáticos de un archivo JSON utilizando Axios
- Cómo renderizar una lista de meses y manejar el evento de clic para cambiar los datos mostrados
- Cómo implementar pestañas para alternar entre los datos del mes actual y los datos de los próximos 7 días
- Cómo inicializar y personalizar un gráfico Echarts para mostrar los datos climáticos
🏆 Logros
Después de completar este proyecto, podrás:
- Obtener datos de un archivo JSON utilizando Axios
- Crear una interfaz de usuario reactiva e interactiva con Vue.js
- Utilizar Echarts para crear un gráfico personalizado con características avanzadas
- Manejar las interacciones del usuario y actualizar el gráfico en consecuencia
- Aplicar tus conocimientos de desarrollo front-end, visualización de datos y diseño de experiencia de usuario
