Code'n'Coffee 2022

Materiales | Workshop Code'n'Coffee impartido por Germán Álvarez @ Ironhack Madrid

Demo del producto

Puedes ver el producto que desarrollamos durante el Workshop en este enlace

Grabación

La grabación completa del evento se encuentra disponible en este enlace

Recursos utilizados

• Librería de visualización de datos ChartJS: link
• API de montañas rusas: link
• Software de desarrollo Visual Studio Code: link

---

Cómo descargar los archivos y ejecutar la aplicación

• Haz click sobre el botón verde en la esquina superior derecha Code
• Selecciona Download ZIP
• Descarga y descomprime los archivos
• Abre el archivo index.html con el navegador Chrome o similar

---

Challenges

Una vez hayas visualizado de nuevo la grabación del Webinar y hayas asentado los conocimientos a través de aplicar variaciones sobre nuestros charts o creando los tuyos propios, es el momento de poner tus habilidades a prueba. Si necesitas ayuda, te invito a contactarme a través de Linkedin o en el email [email protected].

Challenge 1: gráfico de línea

Realiza un nuevo gráfico de línea, creando para ello una nueva sección e incluyendo dentro una nueva etiqueta con el id chart7, tal que así: <canvas id="chart7"></canvas>.

Muestra en este gráfico de línea la comparativa entre la velocidad de las diferentes montañas rusas (un solo dataset)

Challenge 2: extiende el gráfico mixto

Un gráfico mixto es aquel que dispone de varios juegos de datos o datasets con diferentes tipos de gráficos asociados. Estos se funden en un solo chart combinado. De hecho, el último de nuestros gráficos es combinado ya que dispone de dos datasets con un tipo específico asociado.

Añade a este gráfico un tercer dataset que muestre a través de una línea la comparativa de longitud. De esta forma tendremos en un solo gráfico las tres propiedades principales de cada montaña rusa comparadas: velocidad, altura, y ahora... ¡longitud!

Por supuesto, asocia un color diferente para esta línea.

Challenge 3: crea tu gráfico mixto

Realiza tu propio gráfico combinado de tipo radar, formado por tres juegos de datos o datasets:

• Longitud de cada una de las montañas rusas.
• Velocidad de cada una de las montañas rusas.
• Altura de cada una de las montañas rusas.

Recuerda trabajar de forma ordenada, haciendo tantas comprobaciones mediante console.log() como necesites.

¡Ánimo!