TE
TechEcho
Home24h TopNewestBestAskShowJobs
GitHubTwitter
Home

TechEcho

A tech news platform built with Next.js, providing global tech news and discussions.

GitHubTwitter

Home

HomeNewestBestAskShowJobs

Resources

HackerNews APIOriginal HackerNewsNext.js

© 2025 TechEcho. All rights reserved.

Making MathBox: Presentation-Quality Math with Three.js and WebGL

132 pointsby thomasparkover 12 years ago

13 comments

mbostockover 12 years ago
Regarding the use of three dimensions for visualization, see Tamara Munzner's forthcoming book, "Visualization Design and Analysis: Abstractions, Principles, and Methods." [1] Although still in draft form, the section "No Unjustified 3D" is relevant:<p>&#62; Many people have the intuition that if two dimensions are good, three dimensions must be better – after all, we live in a three-dimensional world. However, there are many difficulties in visually encoding information with the third spatial dimension, depth, which has important differences from the two planar dimensions.<p>&#62; The cues that convey depth information to our visual system include occlusion, perspective distortion, shadows and lighting, familiar size, stereoscopic disparity, and others. This section discusses the costs of these depth cues in a visual encoding context, and also the challenges of text legibility given current display technology. It then discusses in what situations the benefits of showing depth information could outweigh these costs, and the need for justification that the situation has been correctly analyzed.<p>&#62; In brief, 3D is easy to justify when the user’s task involves shape understanding of inherently three-dimensional structures. In this case, which frequently occurs with inherently spatial data, the benefits of 3D absolutely outweigh the costs, and designers can use the many interaction techniques designed mitigate those costs.<p>&#62; In all other contexts, the use of 3D needs to be carefully justified. In most cases, rather than choosing a visual encoding using three dimensions of spatial position, a better answer is to visually encode using only two dimensions of spatial position. Often an appropriate 2D encoding follows from a different choice of data abstraction, where the original dataset is transformed by computing derived data.<p>Although I'm not sure I would recommend it, you can do 3D in D3.js by extending the DOM to represent a 3D scenegraph. For example, with X3DOM: <a href="http://bl.ocks.org/1291667" rel="nofollow">http://bl.ocks.org/1291667</a><p>[1] <a href="http://www.cs.ubc.ca/~tmm/courses/533-11/book/" rel="nofollow">http://www.cs.ubc.ca/~tmm/courses/533-11/book/</a>
评论 #4792864 未加载
co_pl_teover 12 years ago
The github link is <a href="https://github.com/unconed/MathBox.js" rel="nofollow">https://github.com/unconed/MathBox.js</a><p>As a math/visualization geek I'm smitten by this.<p>Loved this quote:<p>"I wasn't 100% sure whether other people would have the same a-ha moments that I've had, but I'm convinced more than ever that seeing math in motion is essential for honing our intuition about it. MathBox not only makes animated diagrams much easier to make and share, but it also opens the door to making them interactive in the future."<p>It's stuff like this that makes me pine for better WebGL support across the board.
Simucalover 12 years ago
While I enjoyed the article, I found its presentation to be very distracting. The rotational-scroll effect, font choice and the breaking of the back button hurts the page's usability.
评论 #4793079 未加载
tectonicover 12 years ago
An impressive amount of work went into making this page. Everyone is complaining about the JS and breaking the back button, which is a shame, because if you look past that bug you see some great visualizations and content.
unconedover 12 years ago
Oh hackernews, i knew if i came here I'd find people bitching about some inconsequential detail.
评论 #4792941 未加载
purgeover 12 years ago
I was at full frontal and this presentation was captivating. One of the best talks I have ever seen. Bravo.
trhtrshover 12 years ago
Beware, the page spams your history while you page through it.
josephagossover 12 years ago
Hey unconed, is it possible to drop mathematical functions into this? Or do you have to code them in?<p>What I mean is can this partially replace Mathematica? Can we type a mathematical formula and have the software build the animations?
评论 #4793115 未加载
adrakeover 12 years ago
A friend asked me to provide him with some screenshots since he doesn't have WebGL, and he thought others might also find it helpful:<p><a href="https://www.dropbox.com/sh/o547nsd7atgg7xa/tF2E2sYaef" rel="nofollow">https://www.dropbox.com/sh/o547nsd7atgg7xa/tF2E2sYaef</a>
arnemartover 12 years ago
Stevens talk at Full Frontal was absolutely fantastic, one of the best I have ever seen. I highly recommend watching the video once it comes out. It is very impressive to see such complex topics being presented with such ease and style.
biscarchover 12 years ago
Had to turn off JavaScript to access the page. Has anyone else had this issue?
sneakover 12 years ago
This webpage breaks inertial scrolling on my iPad.
评论 #4792722 未加载
sesquover 12 years ago
I'm sure this is a nice library, but it really needs a fallback better than "please get WebGL" for the many users who currently see only that error message.