11–20 of 104 posts
SunCalc is a good tool for this, if you're interested: https://github.com/mourner/suncalc
(I've used it on a personal project, and the API was a little awkward but the results are good: https://daylight.website/)
It would be fun to see this with local daylight hours mapped to the squares, so I could get a feel for where my consumption is at within "daylight" vs the whole "day" SunCalc is a good tool for this, if you're interested: https://github.com/mourner/suncalc (I've used it on a personal project, and the API was a little awkward but the results are good: https://daylight.website/ )
Btw, the website you linked doesn't work for me. I get the "Uncaught (in promise) TypeError: navigator.geolocation is undefined" on Firefox 98.0.2 on macOS 12.3.1
I see that I'm not the only one inspired by this blog post [1]. I did a similar visualization with blocks to display my working hours [2]. [1] https://waitbutwhy.com/2016/10/100-blocks-day.html [2] https://github.com/am-on/work-timer
It is a good idea, but the layout hurts my eyes due to the Hermann grid illusion. https://en.wikipedia.org/wiki/Grid_illusion
It wasn't intentional! I experimented with different colors, but seems like all of them produce this illusion :/ I'll see what I can do.
It's perhaps a neat UI for a day planner. Being able to drag to select a block of squares and then attach a color/label to them would be a nice next step. Could work entirely client side.
Interesting. Thanks for the idea!
It is a good idea, but the layout hurts my eyes due to the Hermann grid illusion. https://en.wikipedia.org/wiki/Grid_illusion
It wasn't intentional! I experimented with different colors, but seems like all of them produce this illusion :/ I'll see what I can do.
"Average psilocybin mushroom trip" nice
I am grossly offended by this .grid-item { ... height: 4.5rem; width: 4.5rem; } That's a square. Fine, a square is a rectangle. But that's a square. There's no media queries to eliminate the square. There's no JS that affects the square-ness. It's all squares. 144 squares.