1,234
edits
Changes
no edit summary
{{Admon/obsolete}}
== Introduction ==
The Canvas 3D JS Libary (C3DL) is a javascript Javascript library that will make it easier to write 3D applications using canvas 3dWebGL. It will provide provides a set of math, scene, and 3d object classes to make the canvas more accessible for developers that want to develop 3D content in browser.
== People Working On This Project Contributors==
* Catherine Leung
* [[User:asalga | Andor Salga]]* Peter Callaghan* [[User:Pplam3 | Patrick Lam]] (Picking)* [[User:Jamesboston | James Boston]] (Garbage collection)* Mark Paruzel (CodeBot)
* Andrew Smith
* Chris Bishop (Javascript)* Jeremy Giberson* Joe Drew* Matthew Postill
== Downloads ==
For the library, samples, and tutorials, go to [http://cs.senecacwww.onc3dl.caorg/~leung/canvas3d/canvas3d-0c3DL.2.0.xpi Andrew's patchorg] - this change to the canvas 3D extension allows the "simple" examples from Vlad's page to work with ati cards. This is intended for Windows only. Model viewer examples do not work yet.
== Examples Links ==* INCOMPLETE[http://www.c3dl.org c3DL.org]* [http://github.com/cathyatseneca/c3dl GitHub Repo]* [svn://cdot.senecac.on.ca/canvas3d Old SVN Repo]* [http://en.wikipedia.org/wiki/C3DL Wikipedia page]
=== Scene Class =Related Resources ==* IN PROGRESS[http://www.khronos.org/webgl/ Khronos WebGL]
== Math Operations Documentation ==
* 3D Asteroids - Good use of Collision detection, animation, particles, camera work, both mouse and keyboard controls.
* Getters** getMatrix() - '''Returns an array Simulation of 16 numbers. Each value represents a location of the matrix starting at the top left corner (Row-Major)'''3D path finding
* Setters3D graphs:*Display social networks and their relationships<br />:* setMatrix(newMatArray) Get earthquake Richter- '''Takes an Array of 16 numbers that represent the matrix in Row-Major format'''scale values from a service and show graphs on a map<br />:* Display 3D graphs beside one another, gas prices along stock market values<br />:* 3D flowcharts<br />
* Calculations** identity() 3D Traceroute - '''Sets the matrix up to be an identity matrix'''** transpose() - ''' Transposes the matrix to be in Column-Major format, and vice versa'''** inverse() - '''Calculates the Inverse graphical view of the matrix. Returns NULL if it fails, else it returns an inverse matrixIP'''** determinant() - '''Returns a number that is the Matrices determinant'''** adjoint() - '''Returns s path across the Hermitian transpose (Adjoint) of this matrix'''** multiplyByScalar(scalar) - '''Multiplies the values of the matrix by a number'''** divideByScalar(scalar) - '''Divides the values of the matrix by a number'''** multiplyByMatrix(mat) - '''Multiplies two matrices togetherinternet. It returns a new matrix'''** multiplyByVector(vec) - '''Mutiplies the orientation of the matrix by the vector. This function returns the newly oriented Vector'''** addMatrix(mat) - '''Adds the values of two matrices together. It returns a new matrix'''** subtractMatrix(mat) - '''Subtracts the values of the two matrices. It return a new matrix''' === Quaternion Class ===A Quaternion is a 4-Dimensional representation of an orientation. It consists of a unit-length axis and an angle around that axisMore details [http://www. It can function much like an orientation matrix but without the disadvantage of Gimble Lockc3dl. The Quaternion is stored as an array of 4 numbers, represented in the order of (w, x, y, z). The Quaternion Class has the following members: * Getters** getW() - '''Returns the numerical W component of the Quaternion'''** getX() - '''Returns the numerical X component of the Quaternion'''** getY() - '''Returns the numerical Y component of the Quaternion'''** getZ() - '''Returns the numerical Z component of the Quaternion'''** getMatrix() - '''Returns a Matrix object that reflects the orientation of the quaternion'''** getAxisAngle(axis, angle) - '''Takes in two values, a Vector object and a Numberorg/index. Converts the orientation of the quaternion into an axis Vector and an angle around it''' * Setters** setFromQuat(quat) php/uncategorized/canvas3d- '''Sets this Quaternion with the same value as the one being passed in'''** setFromMatrix(mat) traceroute- '''Creates a Quaternion orientation from the orientation of the Matrix object that is passed idea/ in''' * Calculations** length() - '''Returns the length of the Quaternion'''** lengthSq() - '''Returns a number that represents the square of this Quaternion's length'''** addQuat(quat) - '''Takes a Quaternion object that will be added to this Quaternion's internal (w, x, y, z) values'''** subtractQuat(quat) - '''Takes a Quaternion object where its values will be subtracted from this Quaternion's (w, x, y, z) values'''** multiplQuat(scalar) - '''Takes a number and multiplies its values by the Quaternion's (w, x, y, z) values'''** conjugate() - '''Returns a Quaternion that is this Quaternion's conjugate'''** dot(quat) - '''Takes a Quaternion and returns the Dot Product of the two'''** normalize() - '''Normalizes the quaternion'''** inverse() - '''Returns the inverse of this Quaternion''' == Camera == === Pan Camera Class ===* INCOMPLETE === Fixed Camera Class ===* INCOMPLETE === Chase Camera Class ===* INCOMPLETEblog post]
* Getters** getPosition() Molecule Viewer - '''Returns a Vector Object that represents the position of the Camera'''** getUp() - '''Returns a Vector Object that represents the orientation of Up'''** getDir() - '''Returns a Vector Object that is the direction the camera is facing'''** getLeft() - '''Returns a Vector Object that represents the orientation of Left'''** getLinearVel() - '''Returns a Vector that is the velocity that the camera is traveling at'''** getAngularVel() - '''Returns a Vector that contains the rotation velocity around the local (x, y, z) axis of the camera'''Rotate 3D molecules. Similar to [http://www.worldofmolecules.com/3D/bcarotene_3d.htm this]
* Setters** setPosition(vec) - '''Takes a Vector that sets the camera's position'''** setLookAtPoint(vec) - '''Takes a Vector that represents the point the camera will look at'''** setUpVector(vec) - '''Takes a vector that orients the camera Up'''** setLinearVel(vec) - ''' Takes a vector that is the camera's linear velocity'''** setAngularVec(vec) - '''Takes a vector that represents the camera's rotational velocity around local (x, y, z) axis'''3D Sudoku
* Other Functions** rotateOnAxis(axis, angle) - '''Takes a vector and a number that represents a relative rotation to the camera3D Rubik's orientation'''** yaw(angle) - '''Takes a number that the camera will rotate around its Up vector'''** roll(angle) - '''Takes a number that the camera will rotate around its direction vector'''** pitch(angle) - '''Takes a number that the camera will rotate around its Left vector'''** update(timeElapsed) - '''Takes a number that represents the amount of milliseconds that passed since the last call to update. This function updates the position and rotation based on the set velocities'''Cube
* Really fancy animation of a bar graph, with columns growing and arrow moving. Will be an instant hit with business people. Usable as easy as [http://code.google.com/apis/chart/ google's toy]
[[Image:higherhigher.jpg]]
* 3D Asteroids multi- Good use player network air hockey. Supports up to 8 players. Create an arena based on number of Collision detection, animation, particles, camera workplayers . Each wall has a hole and a paddle that players can move left and right. A ball is randomly sent flying and each time it goes through a hole, both mouse the player loses a point. Lose 10 points and keyboard controlsthat player is eliminated. Last person alive wins.
* Solar System Explorer - Pull 2 Player Online Chess:* Orbit camera can be used to orbit around the positions of our planets from some sort of webservice and display them, allowing users to see their relative alignmentboard.<br /> :* Simulation of 3D path finding * 3D graphs - Display social networks Effects can be used to change what material the pieces and their relationshipsboard use such as metal, wood, etc.<br /> - Get earthquake Richter-scale values from :* Picking can be used to allow a simple interface to move the pieces. Either clicking on two tiles can move a piece or clicking on a service piece and show graphs on then a maptile can move the piece.<br /> :* Further research is needed to determine the best server- Display 3D graphs beside one another, gas prices along stock market valuesside language to use to share board state between players.<br /> :* 3D Traceroute - graphical view Animation can be achieved simply by setting velocities of an IP's path across the internetpieces. More details [http:<br //www.c3dl.org/index.php/uncategorized/canvas3d-traceroute-idea/ in this blog post]>