How to visualize 24 hours?

I’m mostly a front end dev with very limited experience in back end/using nodejs. I want to practice by building an app for time management and visualization.I would like to some how track user time based on activities that that create and put a color on to identify which activity they spend their time on. (Ex. They create a work activity that they would like to track and the choose the color red to see on the graph)I’m not sure exactly how to track time and store it into a format that can be graphed but I’m confident I can figure that out. The problem I’m having is how can I just develop one bar with 24 increments on it with each increment representing one hour? I’ve looked into d3 a little bit. Any pointers would be nice. I’d like to challenge myself but I’m in need of a little bit of guidance and creativity from someone a little more experienced in this sort of thing

Submitted December 19, 2018 at 04:42PM by MoveToPluto