From IT Skills
Jump to: navigation, search

Every page in this category supports Canvas and WebGL

Canvas vs WebGL vs Three.js[edit]


other JS frameworks[edit]

comparison of the WebGL frameworks; Category:Three.js, Play Canvas and Goo Engine: Goo Engine and PlayCanvas works only on WebGL, no Canvas

Goo Engine isn't open source (at least for free users), you can't debug engine's code

how do features on different engines[edit]

  • average (of 5 results) loading times of applications:
    Three.js - 1.48s Babylon.js - 1.63s Goo Engine - 2.28s PlayCanvas - 3.54s
  • Babylon's coordinate system, which is left-handed, meaning Z-axis initially points away from the viewer. There's something off with rotation too (possibly because of left-handed orientation). When in other engines adding positive rotation to Y-axis turned box right, in Babylon - turned left
    • несоответствие систем координат Blender и Three.js
  • Keyboard handling isn't implemented in Three and Babylon. Goo Engine wins here, because it has State Machine, which relieves you from writing additional code for listening to Keyboard events. It can be customized inside Goo Create and supports a lot of features.
  • convert 2D Mouse coordinates to 3D scene's coordinates. It isn't implemented in Three and Babylon, when PlayCanvas and Goo (camera.getWorldPosition()) have it.
  • Working with Babylon's colors I noticed that it doesn't support HEX form, and RGB values of BABYLON.Color3 are floats ranging from 0 to 1. But there still is a conversion method FromInts to which you pass RGB values in integer form ranging from 0 to 255. Although Three stores RGB values in float form internally too, it does support HEX as well as CSS-style strings (e.g. "rgb(255,0,0)")
  • There is no Color type in Goo, materialDiffuse of default entity's material is stored as an array of floats.
  • When changing clear/background color of the scene, I noticed that in Goo it is set in environment settings of the project (internally this sets clearColor of the renderer), it isn't property of the camera like in PlayCanvas. In Three you set it on renderer and in Babylon - on scene.
  • it isn't possible to create the same material as newly created entities in Create have, unless you will clone material of such entity. You can create goo.Materials using provided shaders from goo.ShaderLib and, but they are either too simple (with one color and no shadows) or too complex (only with texture maps). And provided shaders have no documentation. You can of course use your own shaders, but then you'll be responsible for all the attributes and uniforms it will support. Other 3 engines don't have such issue and provide simple materials with pc.PhongMaterial, THREE.MeshPhongMaterial and BABYLON.StandardMaterial.
  • Working with Babylon.js I couldn't figure out how to attach nodes/entities to other nodes for a while. I thought that when you add nodes to scene, their parent should be this scene, but my box didn't even have field parent just after creation. So that was a bit confusing. From the source code I learned that field parent is set during creation of the BABYLON.Mesh only if it is passed as an argument
  • trouble with Babylon's Cameras (there are 14 types of them), but when I finally chose the one I needed, I struggled for some time with its fov property, which as it turned out, was stored in radians
  • directional lights in both Three and Babylon differ from PlayCanvas'. Directional light in PlayCanvas shines in the direction of its rotation, whereas in Three it shines from passed direction and in Babylon it shines in the passed direction... Goo Create provides the same rotational parameters as PlayCanvas, but inside the engine stores only direction of the light, as Three and Babylon. But default direction in Goo Create when all rotational parameters are 0 is from front to back, when in PlayCanvas it is from top to bottom


This category has the following 2 subcategories, out of 2 total.



Pages in category "Canvas 3d animations"

The following 5 pages are in this category, out of 5 total.