Skip to content

Orillusion is a pure Web3D rendering engine which is fully developed based on the WebGPU standard.

License

Notifications You must be signed in to change notification settings

badcoderguy/orillusion

This branch is 112 commits behind Orillusion/orillusion:main.

Folders and files

NameName
Last commit message
Last commit date

Latest commit

f4402e3 · Nov 20, 2023
Aug 27, 2023
Nov 15, 2023
Nov 14, 2023
Nov 17, 2023
Apr 20, 2023
Nov 14, 2023
Oct 31, 2023
Jun 12, 2023
Jul 29, 2023
May 4, 2023
Aug 27, 2023
Nov 14, 2023
Mar 14, 2023
May 23, 2023
Nov 1, 2023
Oct 31, 2023
Nov 14, 2023
Aug 15, 2023
May 2, 2023
May 5, 2023
Nov 18, 2023

Repository files navigation

Cover Art

Orillusion

Test npm

Orillusion is a pure Web3D rendering engine which is fully developed based on the WebGPU standard. It aims to achieve desktop-level rendering effects and supports 3D rendering of complex scenes in the browser.

Need to know

Beta version, NOT recommended for any commercial application.

Install

NPM

We recommend using front-end build tools for developing Web3D applications, such Vite or Webpack.

  • Install dependencies:
npm install @orillusion/core --save
  • Import on-demand:
import { Engine3D, Camera3D } from '@orillusion/core'
  • Import globally:
import * as Orillusion from '@orillusion/core'

CDN

In order to use the engine more conveniently, we support to use native <script> tag to import Orillusion. Three different ways to import using the official CDN link:

  • Global Build: You can use Orillusion directly from a CDN via a script tag:
<script src="https://unpkg.com/@orillusion/core/dist/orillusion.umd.js"></script>
<script>  
    const { Engine3D, Camera3D } = Orillusion  
</script>

The above link loads the global build of Orillusion, where all top-level APIs are exposed as properties on the global Orillusion object.

  • ESModule Build: We recommend using the ESModule way for development. As most browsers have supported ES module, we just need to import the ES build version of orillusion.es.js
<script type="module">  
    import { Engine3D, Camera3D } from "https://unpkg.com/@orillusion/core/dist/orillusion.es.js" 
</script>
  • Import Maps: In order to manage the name of dependencies, we recommend using Import Maps
<!-- Define the name or address of ES Module -->  
<script  type="importmap">  
{  
    "imports": { "@orillusion/core": "https://unpkg.com/@orillusion/core/dist/orillusion.es.js" }  
}  
</script>  
<!-- Customerized names could be imported -->  
<script  type="module">  
    import { Engine3D, Camera3D } from "@orillusion/core"
</script>

Usage

Create Engine3D instance

At the beginning, we need to use Engine3D.init() and then the instance Engine3D will be created for further use

import { Engine3D } from '@orillusion/core' 
Engine3D.init().then(()=>{  
    // Next
})

As Engine3D.init() is asynchronous, we recommend using async/await in the code

import { Engine3D } from '@orillusion/core'  
async function demo(){  
    await Engine3D.init();  
    // Next 
}  
demo()

Create canvas

In default, Engine3D.init()will create a canvas the same size with the window. Also, we could create a canvas manually using tag <canvas> with a id

<canvas id="canvas" width="800" height="500" />

Next, we need to get the <canvas> via id and then init engine by passing the <canvas> to canvasConfig

import { Engine3D } from '@orillusion/core';  
let canvas = document.getElementById('canvas')  

await Engine3D.init({  
    canvasConfig: { canvas }  
})

Please read the Docs to Learn More.

Platform

Windows/Mac/Linux:

  • Chrome 113+
  • Edge: 113+

Android (Behind the enable-unsafe-webgpu flag):

  • Chrome Canary 113+
  • Edge Canary 113+

Useful links

Dev and Contribution

Please make sure to read the Contributing Guide before developing or making a pull request.

License

Orillusion engine is released under the MIT license.

About

Orillusion is a pure Web3D rendering engine which is fully developed based on the WebGPU standard.

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • TypeScript 99.5%
  • Other 0.5%