Skip to content

jmclozano/mychartFINALproject

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

45 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

mychartFINALproject 📊

JMCLOZANO - Final project 5003 [charts] https://jmclozano.github.io/mychartFINALproject/

CLASS PROJECT - FINAL

Visualize - data from the school’s use of technology tools in a district.

note this was version 2 of final project. I was working on resume and changed direction with the guidance of our Professor to find "what I like" and I like data =) https://jmclozano.github.io/mychartFINALproject/img/resume%20v100.png

Summary:

Scenario: Director of Technology released a new product to the school district. The Director needs to validate the new technology is beneficial to the district and present it to the administration. Data visualization will be updated to the school’s website for the administration meeting.

Inspiration:

Goal: Data visualization - summarize the district’s activity on the release and usability of the tool in each school.

Inspiration: Dashboards

Image of Chart

Image of Chart

Design and Technical reference:

Charts - (interactive) Bar Chart (#) #of teachers that have implemented the technology/schools in the district

Image of Chart

Sample Chart.js ::

https://www.chartjs.org/samples/latest/charts/area/line-boundaries.html https://www.chartjs.org/samples/latest/charts/bar/vertical.html interactive charts

Image of Chart

Process: 🌎

For this new project I will sample data to reflect the school’s implementation of the technology. (data)

Update HTML for meeting - drop-down menu By school (view Teachers and Grades by School using the technology Total district

*possible button with drop-down to see different delivery options

Review youtube videos on chart.js

Image of Chart

review sample code-

Research and design plan

  • Outline html design (sample design)
  • Title
  • Headline of report
  • Description
  • buttons
  • 3 graphs

Version 1 📈

Image of Chart

Version 2 :bar_chart:

Image of Chart

Version FINAL ✅

Image of Chart

Reflection: ✏️

This project was a trial and error exploration in learning html, css, bootstrap, java script, chart.js, ATOM :atom: and Github. I enjoyed each layer of unraveling the code to create this project. WHile designing this project it helped to start with my outline of what I wanted to design as a final project. The initial layout design was simple. As I learned more about each piece of the project I began to visualize other elements I wanted to include in the design. This process of learning while creating assisted in establishing a comfort level in using the code and tools for the design.

This design focus was to provide a simple UI for sharing data via a html platform. The code learned in this design was researched using online tools like you-tube videos and other tutorials. I would advise others to continue searching for solutions if they are not sure of the final product design. My process was layout structure, research code and samples available online and then use the tutorials to guide me during the coding. The more I researched and reviewed sample coding the design unfolded.

Read/Watch, Learn, Practice and Code!

💬 mastering the GitHub README.md page resource: https://guides.github.com/features/mastering-markdown was very helpful in creating this document.

Thank you! Jennifer jc5221

About

JMCLOZANO - Final project 5003 [charts]

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published