Open main menu

CDOT Wiki β

Changes

Canvas3D JS Library

2,293 bytes removed, 20:42, 26 January 2014
no edit summary
== Introduciton =={{Admon/obsolete}}
Under Construction== Introduction ==
The Canvas 3D JS Libary (C3DL) is a Javascript library that will make it easier to write 3D applications using WebGL. It 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
* Jeremy Giberson
* Joe Drew
* Matthew Postill
 
== Downloads ==
NOTE: these downloads are mostly meant for in-house testing and not really polished. It may also only work on a specific platform only. please read the note regarding the download.
<BR>
For the library, samples, and tutorials, go to [http://cswww.senecacc3dl.onorg/ c3DL.ca/~leung/canvas3d/canvas3d-0org]. As of c3dl 2.0, our library uses WebGL.xpi Andrew's patch] - this change Any WebGL enabled browser will be able to view our content. To get a WebGL enabled browser see Tutorial 1 from our website and you do not need any addons. For all older versions of c3dl, you will need the canvas 3D addon available here:You can get the extension allows the "simple" examples from Vlad's page to work with ati cardshttps://addons.mozilla.org/en-US/firefox/addon/7171 (use suckmenot@mailinator. This is intended com/bugmenot for Windows onlyauthentication). Model viewer examples  NOTE: It is HIGHLY recommended that you do not work yetuse the older version of our library but to use version 2.0 or higher.
== Links ==
* [http://littlesvrwww.cac3dl.org c3DL.org]* [http://canvas3dgithub.com/blogcathyatseneca/ Our blogc3dl GitHub Repo]* [svn://cdot.senecac.on.ca/canvas3d Old SVN Repo]== Prototype ==* [http://img126en.imageshackwikipedia.usorg/img126wiki/3032/layoutqe4.jpg Canvas 3D API - Class DesignC3DL Wikipedia page]
== Math Operations ==
=== Vector Class =Related Resources ==A Vector basically describes a direction in the form of X, Y, and Z coordinates of a 3D world* [http://www. Basic 3D math cannot exist without the utilization of spatial coordinates which the Vector Class encapsulateskhronos. The Vector Class will have the following members within it:org/webgl/ Khronos WebGL]
* Getters
** getX() - '''Retrieves the X value'''
** getY() - '''Retrieves the Y value'''
** getZ() - '''Retrieves the Z value'''
* Setters** set(newX, newY, newZ) - '''This sets new (x, y, z) values to the Vector'''** setX(newX) - '''Takes a number value as the new value for X'''** setY(newY) - '''Takes a number value as the new value for Y'''** setZ(newZ) - '''Takes a number value as the new value for Z'''** setFromVector(vec) - '''Takes a Vector object as the new value for this Vector'''== Documentation ==
* Calculations** normalize() - '''Unit Normalization'''** dot() - '''Calculates the Dot ProductDocumentation can be found on our website: [http://www. Returns a number'''** length() - '''Returns the Length of Vector from (0, 0, 0)'''** lengthSq() - '''Returns the Squared value of Length'''** cross(vec) - '''Takes a Vector object and computes the Cross Product between the two valuesc3dl. Returns a Vector object that is the cross of the two'''** add(vec) - '''Takes a Vector object and adds its values to its own'''** subtract(vec) - '''Takes a Vector object and subtracts its values from its own'''** multiply(scalar) - '''Takes a number value and multiplies (x, y, z) by it'''** divide(scalar) - '''Takes a number value and divides (x, y, z) by it'''** isEqual(vec) - '''Takes a Vector object and compares it to its (x, y, z) valuesorg/index. Returns true if they match'''** multiplyByQuat(quat) - '''Takes a Quaternion and multiplies its orientation by (x, y, z)php/documentation/ c3DL.org]. It returns a new Vector orientation'''
==Ideas List = Matrix Class ===A Matrix Class is necessary to provide Matrix operations such as rotation, translation, and scaling to any point in the 3D world. It is composed of a 4x4 matrix of floating point values that can be applied to any Matrix operation. This matrix is stored in '''Row-Major''' format, meaning its first 4 values are in the first row. The Matrix Class has the following members:
* Getters** getMatrix() - '''Returns an array Here are the wishlist of 16 numbersthings we want to be able to do with the library.... Each value represents a location of If you want something add it to the matrix starting at the top left corner (Row-Major)'''list.
* Setters** setMatrix(newMatArray) 3D Asteroids - '''Takes an Array Good use of 16 numbers that represent the matrix in Row-Major format'''Collision detection, animation, particles, camera work, both mouse and keyboard controls.
* Calculations** identity() Solar System Explorer - '''Sets Pull the matrix up to be an identity matrix'''** transpose() - ''' Transposes the matrix to be in Column-Major format, positions of our planets from some sort of webservice and vice versa'''** inverse() - '''Calculates the Inverse of the matrix. Returns NULL if it failsdisplay them, else it returns an inverse matrix'''** determinant() - '''Returns a number that is the Matrices determinant'''** adjoint() - '''Returns 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 together. 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 matricesallowing users to see their relative alignment. It return a new matrix'''
* Simulation of 3D path finding
=== Quaternion Class ===* 3D graphsA Quaternion is a 4:* Display social networks and their relationships<br />:* Get earthquake Richter-Dimensional representation of an orientation. It consists of scale values from a unit-length axis service and an angle around that axis. It can function much like an orientation matrix but without the disadvantage of Gimble Lock. The Quaternion is stored as an array of 4 numbersshow graphs on a map<br />:* Display 3D graphs beside one another, represented in the order of (w, x, y, z). The Quaternion Class has the following membersgas prices along stock market values<br />:* 3D flowcharts<br />
* Getters** getW() 3D Traceroute - '''Returns the numerical W component graphical view of the Quaternion'''** getX() - ''an IP'Returns s path across the numerical X component of the Quaternion'''** getY() - '''Returns the numerical Y component of the Quaternion'''** getZ() internet. More details [http://www.c3dl.org/index.php/uncategorized/canvas3d- '''Returns the numerical Z component of the Quaternion'''** getMatrix() traceroute- '''Returns a Matrix object that reflects the orientation of the quaternion'''** getAxisAngle(axis, angle) - '''Takes idea/ in two values, a Vector object and a Number. Converts the orientation of the quaternion into an axis Vector and an angle around it'''this blog post]
* Setters** setFromQuat(quat) 3D Canvas Racing Demo - like [http://www.tapper- '''Sets ware.net/canvas3d/ this Quaternion with the same value as the one being passed in] but better, to show that it'''** setFromMatrixs both easier to use, more functionality is available, and runs much faster (mathopefully) - '''Creates a Quaternion orientation from the orientation of the Matrix object that is passed in'''
* Calculations** length() Molecule Viewer - '''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 Rotate 3D molecules. Similar to [http://www.worldofmolecules.com/3D/bcarotene_3d.htm 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 ==* 3D Sudoku
=== Pan Camera Class ===* INCOMPLETE3D Rubik's Cube
=== Fixed Camera Class ===* INCOMPLETEHouse Explorer/Designer - Load a mesh of a room or a house and allow users to navigate through the environment or design a room in a house.
=== Chase Camera Class ===* INCOMPLETE3D Photo Album - Download images and create a 3D photo album similar to [http://www.mypictures3d.com/images/screenshots/art_gallery/art4.jpg this].
=== Free Camera Class ===The Free Camera Class is a camera that can be translated and oriented. It cannot be attached to an item* Matrix - Query search engines for sites, chat logs, ratherblogs, it can be moved separately by the useretc. The camera also supports velocities (without friction) that are applied to and display all the object based on timetext in a matrix-like fashion. The Free Camera Class has the following Members:
* GettersReally 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]** getPosition() - ** getUp() - ** getDir() - ** getLeft() - ** getLinearVel() - ** getAngularVel() - [[Image:higherhigher.jpg]]
* Setters** setPosition(vec) - ** setLookAtPoint(vec) - ** setUpVector(vec) - ** setLinearVel(vec) - ** setAngularVec(vec) - Generic model viewer application, with back/forward/index + zoom/rotate buttons that would download and display models from the web. Would have to be able to convert 3dsmax models in JS. So a museum or such could just slap the app on the page and give it an array of URLs for the stuff to show.
* Pong. Should be fairly easy, we just need to code the collision detection.
* Other Functions** yaw(angle) - ** roll(angle) - ** pitch(angle) - ** update(timeElapsed) multi-player network air hockey. Supports up to 8 players. Create an arena based on number of players . 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, the player loses a point. Lose 10 points and that player is eliminated. Last person alive wins.
== World Objects ==* 2 Player Online Chess:* Orbit camera can be used to orbit around the board.<br />:* Effects can be used to change what material the pieces and board use such as metal, wood, etc.<br />:* 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 piece and then a tile can move the piece.<br />:* Further research is needed to determine the best server-side language to use to share board state between players.<br />:* Animation can be achieved simply by setting velocities of pieces.<br />
=== Shape Class ====== Primitive Class ====== Model Class ===[[Category:Open Source Communities]]
Retrieved from "https://wiki.cdot.senecapolytechnic.ca/wiki/Special:MobileDiff/14646...104091"