Hardcore mathematic and 3d shapes using canvas and javascript

Question

I have an old friend who is a mathematician. He has his own math to compress his formulas, which are incredibly beautiful.

He works in a program called Mathematica, which transforms the formulas for 3D-shapes.

I wonder if it is possible to obtain these figures using Canvas and JavaScript? See attached formula and figure.

I know little of this myself. But I would be delighted if some one could show me an example.

Answer 1

Since you mention Mathematica I'll use it to provide a few more examples for various values of t. I can't help you with canvas though.

This is the Mathematica code:

With[{a = 3, t = 0.7}, 
 RegionPlot3D[
  10^-(t x + y)^10 + 10^-(-t x + y)^10 + 10^-(t y + z)^10 + 
    10^-(-t y + z)^10 + 10^-(t z + x)^10 + 10^-(-t z + x)^10 > 
   5/2, {x, -a, a}, {y, -a, a}, {z, -a, a}, PlotPoints -> 50, 
   Boxed -> False, Axes -> None
 ]]

t=0.2

t=0.4

t=0.7

t=1

Answer 2

It's definitely possible. You can take a look at the javascript-surface-plot library and the working example at http://www.grvisualisation.50webs.com/javascript_surface_plot.html. It produces a 3D model from a mathematical formula that can be panned and rotated as desired.

If you look at the code for the example, there is a setup function that you would need to update to whatever formula you wanted. Just need to convert your math formula into javascript.

I'm not sure what you want to do with these models once you have one, but this library seems to fit your requirements. Doing a search for html canvas 3d plot brought up additional libraries as well.