5 ms·

Some commenters on HN and Twitter were curious how I made the spinning diagrams in a previous thing I wrote, so 8 months later I finally wrote down an explanati

Some commenters on HN and Twitter were curious how I made the spinning diagrams in a previous thing I wrote, so 8 months later I finally wrote down an explanation. (Previous HN thread here - https://news.ycombinator.com/item?id=32528769 https://news.ycombinator.com/item?id=32528769 )

cloudking 3y ago
Awesome work, we really don't need Flash anymore :)
ad404b8a372f2b9 3y ago
This is fantastic, do you have any other interesting techniques for displaying math? I never thought to augment plain old equations like that, it's making my mind bubble.
netsharc 3y ago
Really neat. Would it be possible to make the letters go gray when they go "behind the cube" from POV of the camera?
- kilovoltaire 3y ago
  Oh yeah that would look cool… Possibly transparent faces of the cube with a particular `mix-blend-mode` that leaves the background color alone but dims letters that get behind it? (That's just a wild guess, I don't know if it's actually possible.)
  - fwlr 3y ago
    Faces of the cube with the same color as the background and opacity 0.2 would almost certainly work. My next thought is duplicate the original cube, remove the characters from the duplicate cube and set the color on the duplicate only, then move the duplicate cube back one pixel in the z direction.
    - kilovoltaire 3y ago
      Ah yeah faces with same color as background and low opacity sounds like a good approach. Here's an editable copy of the code if anyone sees this and wants to try adding the faces - https://jsfiddle.net/t0crk5do/ https://jsfiddle.net/t0crk5do/
pjot 3y ago
The spinning dimension adds such an information dense layer to the sum of cubes examples - a fantastic display of what is good data visualization. Also, I’m quite jealous of your one letter domain.
- kilovoltaire 3y ago
  Thanks!
TimedToasts 3y ago
I enjoyed the part referencing selected/highlighted areas rotating 'correctly'. I had to try it and it was just as pleasing as you said it would be. Kudos for the write-up and kudos to the anonymous devs out there who wrote that portion of browser code.

cloudking 3y ago

Awesome work, we really don't need Flash anymore :)

ad404b8a372f2b9 3y ago

This is fantastic, do you have any other interesting techniques for displaying math? I never thought to augment plain old equations like that, it's making my mind bubble.

netsharc 3y ago

Really neat. Would it be possible to make the letters go gray when they go "behind the cube" from POV of the camera?

kilovoltaire 3y ago
Oh yeah that would look cool… Possibly transparent faces of the cube with a particular `mix-blend-mode` that leaves the background color alone but dims letters that get behind it? (That's just a wild guess, I don't know if it's actually possible.)
- fwlr 3y ago
  Faces of the cube with the same color as the background and opacity 0.2 would almost certainly work. My next thought is duplicate the original cube, remove the characters from the duplicate cube and set the color on the duplicate only, then move the duplicate cube back one pixel in the z direction.
  - kilovoltaire 3y ago
    Ah yeah faces with same color as background and low opacity sounds like a good approach. Here's an editable copy of the code if anyone sees this and wants to try adding the faces - https://jsfiddle.net/t0crk5do/ https://jsfiddle.net/t0crk5do/

pjot 3y ago

The spinning dimension adds such an information dense layer to the sum of cubes examples - a fantastic display of what is good data visualization. Also, I’m quite jealous of your one letter domain.

kilovoltaire 3y ago
Thanks!

TimedToasts 3y ago

I enjoyed the part referencing selected/highlighted areas rotating 'correctly'. I had to try it and it was just as pleasing as you said it would be. Kudos for the write-up and kudos to the anonymous devs out there who wrote that portion of browser code.