So yea, my friend came and told me abt this hackathon and I started my work on it. I chose the doughnut chart because I found it fascinating that it actually had 3 dimensions: length, height and direction. This visualization employs all 3 dimensions.

What it does

It shows you your daily tasks as well as its associated priorities in a nice way, corresponding to the 12-hr clock cycle!

How I built it

I used HTML, CSS, JavaScript, Postman MockServer and a healthy dose of the d3 library. d3 was the guy that made the arcs and its handling. CSS also chimed in for some styling job. HTML was the static pillar holding the stuff together while Postman was the postman.

Challenges I ran into

Oh my, for starters I didnt know any thing abt HTML, CSS, d3, Postman, chart.js, APIs etc(lol). And then add to it my ongoing Pre-end semester and End semester exams.

Accomplishments that I'm proud of

Not proud but I'm happy I finally tackled HTML, CSS and JavaScript(it was long due). And I got to know Mr. D3, a powerful guy.

What I learned

Everything I used to build it. HTML, CSS, JavaScript, d3, Postman, chart.js, REST API, stress, time-pressure etc.

What's next for Priority Clock

I really wanted to add the ticks of a clock to the chart for better visualization but ran out of time and braincells.

+ 6 more
Share this project: