All Projects → jagenjo → Litescene.js

jagenjo / Litescene.js

Licence: mit
A WebGL 3D Engine library with component-based node hierarchy. Used by WebGLStudio

Programming Languages

javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to Litescene.js

Layaair
LayaAir is an open-source 2D/3D engine. LayaAir Engine is designed for high performance games.LayaAir support TypeScript and JavaScript、ActionScript 3.0 programming language.Can develop once, publish for multi platform.
Stars: ✭ 791 (+195.15%)
Mutual labels:  webgl, 3d-engine
Glas
WebGL in WebAssembly with AssemblyScript
Stars: ✭ 278 (+3.73%)
Mutual labels:  webgl, 3d-engine
Lume
Create CSS3D/WebGL applications declaratively with HTML. Give regular DOM elements shadow and lighting.
Stars: ✭ 445 (+66.04%)
Mutual labels:  webgl, 3d-engine
Rendeer.js
Light-weight 3D Scene graph library with renderer in WebGL
Stars: ✭ 63 (-76.49%)
Mutual labels:  webgl, 3d-engine
Helixjs
A Javascript 3D game engine.
Stars: ✭ 84 (-68.66%)
Mutual labels:  webgl, 3d-engine
Vts Browser Js
JavaScript WebGL 3D map rendering engine
Stars: ✭ 148 (-44.78%)
Mutual labels:  webgl, 3d-engine
Engine
Oasis Engine is a web-first and mobile-first high-performance real-time development platform.
Stars: ✭ 2,202 (+721.64%)
Mutual labels:  webgl, 3d-engine
Layaair discard
This is old LayaAir veriosn writetten by ActionScript 3.0 ,now LayaAir is using TypeScript as the Engine Script,Please use https://github.com/layabox/LayaAir instead.
Stars: ✭ 1,858 (+593.28%)
Mutual labels:  webgl, 3d-engine
3D-Engine-OpenGL-4
3D Graphics Engine For Games | C++ OpenGL 4.1
Stars: ✭ 19 (-92.91%)
Mutual labels:  3d-engine
Imodeljs
Monorepo for iModel.js Library
Stars: ✭ 256 (-4.48%)
Mutual labels:  webgl
hypVR-Ray
Hyperbolic VR using Raymarching
Stars: ✭ 81 (-69.78%)
Mutual labels:  webgl
angular-mapboxgl-directive
AngularJS directive for Mapbox GL
Stars: ✭ 43 (-83.96%)
Mutual labels:  webgl
Blotter
A JavaScript API for drawing unconventional text effects on the web.
Stars: ✭ 2,833 (+957.09%)
Mutual labels:  webgl
headless-gl
🎃 Windowless WebGL for node.js
Stars: ✭ 1,383 (+416.04%)
Mutual labels:  webgl
Dino3d
🦖 Google Chrome T-Rex Run! in 3D (WebGL experiment)
Stars: ✭ 263 (-1.87%)
Mutual labels:  webgl
icn3d
web-based protein structure viewer and analysis tool interactively or in batch mode
Stars: ✭ 95 (-64.55%)
Mutual labels:  webgl
webrays
WebRays - Ray Tracing on the Web
Stars: ✭ 38 (-85.82%)
Mutual labels:  webgl
Leaflet.pixioverlay
Bring Pixi.js power to Leaflet maps
Stars: ✭ 264 (-1.49%)
Mutual labels:  webgl
React Three Editable
👀 ✏️ Edit your react-three-fiber scene with a visual editor without giving up control over your code.
Stars: ✭ 261 (-2.61%)
Mutual labels:  webgl
Qfusion
Source code for cross-platform OpenGL gaming engine
Stars: ✭ 255 (-4.85%)
Mutual labels:  3d-engine

litescene.js

Litescene is a scene graph library for WebGL with a component based hierarchical node system. It comes with a realistic rendering pipeline and some interesting components to make it easier to build and share scenes.

  • Component based node system
  • Realistic rendering pipeline, it supports shadows, reflections, textures for all properties, etc
  • Material system that automatically computes the best shader, making it easy to control properties
  • Resources Manager to load and store any kind of resource ( textures, meshes, etc)
  • Serializing methods to convert any Scene to JSON
  • Parser for most common file formats
  • Easy to embed

It uses its own low-level library called litegl.js

litescene-screenshot.png

WebGLStudio

Litescene has been created to work together with WebGLStudio, an open source online 3D editor. From WebGLStudio you can export the JSON file containing all the info and use it in your LiteScene.

Usage

Include the library and dependencies

<script src="external/gl-matrix-min.js"></script>
<script src="external/litegl.min.js"></script>
<script src="js/litescene.js"></script>

Create the context

var player = new LS.Player({
	width:800, height:600,
	resources: "resources/",
	shaders: "data/shaders.xml"
});

Attach to Canvas to the DOM:

document.getElementById("mycontainer").appendChild( player.canvas )

or you can pass the canvas in the player settings as { canvas: my_canvas_element }

Load the scene and play it:

player.loadScene("scene.json");

Documentation

Check the guides folder for a better explanation of how does it works. The doc folder contains the documentation. For info about litegl.js check the documentation in its repository. For info about glMatrix check the documentation in its website.

Utils

It includes several commands in the utils folder to generate doc, check errors and build minifyed version.

Feedback

You can write any feedback to [email protected]

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].