Web gl & three.js.key
Upcoming SlideShare
Loading in...5
×

Like this? Share it with your network

Share
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
    Be the first to like this
No Downloads

Views

Total Views
985
On Slideshare
947
From Embeds
38
Number of Embeds
2

Actions

Shares
Downloads
9
Comments
0
Likes
0

Embeds 38

http://cdn.knightlab.com 37
http://www.linkedin.com 1

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. WebGL & Three.js2012/11/30 Yi-Fan
  • 2. WebGLKhronos Group, not W3CA royalty-free, cross-platform APIBased on OpenGL ES 2.0Combines with other web contentHow much time to WebGL became a W3Cstandard?
  • 3. Browser Support
  • 4. WebGL on Webpage
  • 5. 3D Coordinate Systems
  • 6. Cameras, Perspective,Viewports, and Projections
  • 7. Meshes, Polygons, andVertices
  • 8. Materials, Textures &Lights
  • 9. Transforms and Matrices
  • 10. ShadersExample: WebGL - Three.js + impactJS
  • 11. Higher Level Libraries forWebGLThree.jsGLGESceneJSCubicVRand more ...
  • 12. Three.js DosHides 3D renderingdetailsObject orientedFastSupports interactionMathBuilt-in file formatExtensibleWorks with 2Dcanvas
  • 13. Three.js DosFeature rich: prebuilt objects like lights,geometries, particles, lines, animations, ...etc.Examples
  • 14. Three.js Don’tsNot a game engine
  • 15. Three.js AnimationsArticulated Animation
  • 16. Three.js AnimationsSkinned/Skeletal Animation
  • 17. Three.js AnimationsMorphs
  • 18. Animations usingjavascriptsetTimeoutsetIntervalrequestAnimationFrame
  • 19. ReferenceCan I use...Microsoft: no way to support WebGL and meet our security needsWebGL: Up and RunningShaderthree.jsBetter JavaScript animations with requestAnimationFrame