I have a python web server (cherrypy), and I want the user to be able to compute certain surfaces of this precise type. This is what I am able to generate from user input. He gives me some parameters, I compute my things, generate it as PNG on the server (matplotlib/numpy) and send it back through a JQuery load.
Problem is, this is pretty lame, and the surfaces can have various aspects. I'd like to be able to have an actual widget or so that would enable the user to rotate his surface...
My major constraints is that it has to work on IE 7 (8 would be cool as well), and allow the input of the data I compute somehow. I've seen many things on the web that only permit to input parametric functions. What I need is to be able to push in raw data triplets.
I've been looking at several things, Javascript would be the best but I failed to see something in JQuery or equivalents. I did look quite long around WebGL and started implementing stuff...from scratch... but way too long and random behavior in IE sometimes.
Maybe I'm missing out completely on something, on some technology or format that is compatible with my python, but I've spent days before adopting the temporary solution of plotting into PNGs.
Looking forward to reading you guys, Thanks in advance ;)
Use a 3D surface plot to see how a response variable relates to two predictor variables. A 3D surface plot is a three-dimensional graph that is useful for investigating desirable response values and operating conditions.
We could plot 3D surfaces in Python too, the function to plot the 3D surfaces is plot_surface(X,Y,Z), where X and Y are the output arrays from meshgrid, and Z=f(X,Y) or Z(i,j)=f(X(i,j),Y(i,j)). The most common surface plotting functions are surf and contour. TRY IT!
To create a 3D graph from matrix or worksheet data, you select the data, and click the appropriate graph button on the 3D and Contour Graphs toolbar. Alternately, you select a graph from the Plot menu.
have the python script return the vertices/points of the 3D model in json format then use mrdoob's three.js to create a live, javascript-powered, 3D, webGL model directly in the browser.
Check out three.js here: https://github.com/mrdoob/three.js
(Look at the amazing examples there for inspiration, you can probably get a hold of mrdoob for insights also...)
EDIT: Oops, just noticed the IE7 requirement. No webGL for IE7 :(. You'll have to use Flash for 3D rendering. EIther that or have your python script create different angles of the view that can be loaded as images in the browser (for example the user clicks on the right button and the next image that loads is rotated at a certain angle to the right).
EDIT: Looks like IEWebGL will enable webGL for IE7!
EIDT: processing.js looks really nice for visualizations too!
As far as I know, if you need IE7 compatibility, most of the available libraries in JS won't work for you - they require either canvas
or SVG support. You're left with static images, Flash, or Java applets.
I would look into processing, which has good 3D support and can create Java applets for web use. See the 3D tutorials for good examples of interactive 3D surfaces.
If you wanted to get fancy, you could potentially also offer processing.js for browsers that support the canvas
element. This would avoid loading a Java applet for those browsers, making for a slightly smoother UI and removing the Java dependency. You'd need to check for browser compatibility and then load either the applet code or the processing.js code. The upside of this is that you should be able to use exactly the same processing code in both cases.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With