Materiales | Workshop Code'n'Coffee impartido por Germán Álvarez @ Ironhack Madrid
Puedes ver el producto que desarrollamos durante el Workshop en este enlace
La grabación completa del evento se encuentra disponible en este enlace
- Librería de visualización de datos ChartJS: link
- API de montañas rusas: link
- Software de desarrollo Visual Studio Code: link
- 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
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].
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
)
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.
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!