Schroedingers-Hat / jsphys

Libraries for physics simulation on javascript canvas
GNU Affero General Public License v3.0
11 stars 1 forks source link

Extended objects and 3d discussion #32

Closed Schroedingers-Hat closed 13 years ago

Schroedingers-Hat commented 13 years ago

Put this here for future reference 15:18 < Schroedingers_hat:#sfn> in the mean while. If you can turn a set of points into a mesh and apply a deformed texture to it, it'll look mostly right 15:19 < Schroedingers_hat:#sfn> ie. as right as a mesh which approximates a curved object 15:20 < Schroedingers_hat:#sfn> if you can interpolate colours between the points doppler will look right too 15:20 <@Capn_Refsmmat:#sfn> hm 15:20 <@Capn_Refsmmat:#sfn> sounds complex 15:21 < Schroedingers_hat:#sfn> well there's probably lots of code out there that will render a 3D object given a set of vertices 15:21 <@Capn_Refsmmat:#sfn> surely 15:21 < Schroedingers_hat:#sfn> see if you can find a renderConvex method, and i'll switch everything to 3D 15:23 < Schroedingers_hat:#sfn> the code that generates the triangles (if you don't find something pre-existing) could interpolate the colours of the 3 vertices, that'll make doppler work too 15:23 < Schroedingers_hat:#sfn> if you the saturation and lum values of a picture on the triangle, and use our hue you can have textures 15:31 < Schroedingers_hat:#sfn> we won't be able to push many triangles, of course but something like this might be possible 15:31 < Schroedingers_hat:#sfn> http://www.muranon.com/w3d/character/tutorial_1/images/stage_set.gif 15:32 < Schroedingers_hat:#sfn> inertial at least 15:33 < Schroedingers_hat:#sfn> if you can build the triangles from the point positions, and map a texture to them in 1 frame, I can keep the point positions up to date 15:34 < Schroedingers_hat:#sfn> if you wanna be able to push it around, we may have to go for simple rockets or a tetrahedron 15:34 < Schroedingers_hat:#sfn> I have some vague ideas for lighting 15:34 < Schroedingers_hat:#sfn> but I have no idea how much cpu time it'd take 15:34 < Schroedingers_hat:#sfn> probably too much

Schroedingers-Hat commented 13 years ago

More of same: 15:36 <@Capn_Refsmmat:#sfn> lighting of objects? 15:38 < Schroedingers_hat:#sfn> yeah 15:38 < Schroedingers_hat:#sfn> if we're rendering stars as they'd be seen, we can use them to light things up 15:41 < Schroedingers_hat:#sfn> basically use the general purpose, many to one interaction code I'll be building for things like magnets, but the rule you apply will be: get doppler shifted spectrum, scale by 1/r^2, multiply by albedo, add to working vector. Do this for each light, and the resulting spectrum is the correctly lit point 15:41 <@Capn_Refsmmat:#sfn> assuming the object's albedo is uniform over all wavelengths 15:42 <@Capn_Refsmmat:#sfn> just pushed a ui change -> http://schroedingers-hat.github.com/jsphys/jsphys.html 15:42 < Schroedingers_hat:#sfn> albedo will be the same type of vector as emission spectrum 15:42 <@Capn_Refsmmat:#sfn> ah 15:42 < Schroedingers_hat:#sfn> element by element multiplication 15:42 < Schroedingers_hat:#sfn> if we want to be general 15:42 < Schroedingers_hat:#sfn> or things can just be uniform grey over all wavelengths 15:43 < Schroedingers_hat:#sfn> anywho, if you want to do shading, rather than uniform lighting you store a vector instead of adding as you go 15:44 < Schroedingers_hat:#sfn> then as you build your 3d model you find the plane of the triangle and add cos(theta)*albedo vector element 15:44 < Schroedingers_hat:#sfn> as I said, it's not something that's going to happen easily

capnrefsmmat commented 13 years ago

WebGL and shaders can be used to achieve 3D lighting:

https://developer.mozilla.org/en/WebGL/Lighting_in_WebGL

We can use shaders to color the different sides of the object differently depending on Doppler shift and so on:

https://developer.mozilla.org/en/WebGL/Using_shaders_to_apply_color_in_WebGL

Schroedingers-Hat commented 13 years ago

Cool. For non-webGL, do you reckon making a mesh each frame is possible or shall we make it points only?

capnrefsmmat commented 13 years ago

If we're going to support arbitrary shapes, we might as well do it in WebGL in 3D. Arbitrary 2D shapes won't teach the user much more than 2D points, and the basic demos we want will work fine with 2D points. The complex demos can be done in 3D.

Schroedingers-Hat commented 13 years ago

Arbitrary 2d shapes implemented. Aberration included. Haven't incorporated it into the demo system yet. Not sure how we should approach doppler using the vector drawing, doesn't seem like it will work very well with fill(). Perhaps stroke a path and gradient from one color to the next? Would limit us to drawing outlines, but I don't see that as being a problem.

Schroedingers-Hat commented 13 years ago

Looks like I'll be able to use this pretty much as is for accelerating objects, just replace the inertialObject w/ an arbitraryPath Only problem is there's no concession for rapid acceleration in here. I have a couple of ideas, but it looks like it may take some work. @capnrefsmmat Should we perhaps put that in known limitations?

capnrefsmmat commented 13 years ago

Yes, I think so.

Canvas supports drawing linear gradients; perhaps that would be helpful:

https://developer.mozilla.org/en/Canvas_tutorial/Applying_styles_and_colors#Gradients

Schroedingers-Hat commented 13 years ago

Changed extendedObject to use stroke, can put different colors for the points any time. Seems a bit silly to have all objects either glow red hot or not at all, so perhaps we should implement other colored objects. Then do the doppler.

Schroedingers-Hat commented 13 years ago

@capnrefsmmat Also, now that it's complete enough that you can see roughly how it works, could you show me how you want to use it? Maybe just pretend all the features you want work how you like and write an entry in demos.js, then I'll match it to that.

Some thoughts for features that aren't much extra work for me: One thing that may allow for prettier looking things is to specify separate lists of vertices and connections along the lines of vertices = [[0,1,0,0],....] connections = [[1,2],[5,1],[3,4]] which would draw a line from pt 1 to pt 2, then from 5 to 1, then 3 to 4. This will make things that aren't just one connected path. You could also make an object w/ different colors/materials by supplying a list the same length as connections. Edit: Change that slightly. Materials are best mapped to vertices, this will make doppler work right.