Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/galacean/engine
A typescript interactive engine, support 2D, 3D, animation, physics, built on WebGL and glTF.
https://github.com/galacean/engine
2d 3d animation graphics html5 input javascript physics typescript web3d webgl webgl2
Last synced: about 5 hours ago
JSON representation
A typescript interactive engine, support 2D, 3D, animation, physics, built on WebGL and glTF.
- Host: GitHub
- URL: https://github.com/galacean/engine
- Owner: galacean
- License: mit
- Created: 2020-12-08T08:07:37.000Z (about 4 years ago)
- Default Branch: main
- Last Pushed: 2024-10-25T08:01:29.000Z (4 months ago)
- Last Synced: 2024-10-29T11:13:10.229Z (4 months ago)
- Topics: 2d, 3d, animation, graphics, html5, input, javascript, physics, typescript, web3d, webgl, webgl2
- Language: TypeScript
- Homepage: https://galacean.antgroup.com/engine
- Size: 22.7 MB
- Stars: 4,259
- Watchers: 68
- Forks: 303
- Open Issues: 320
-
Metadata Files:
- Readme: README.md
- Funding: .github/FUNDING.yml
- License: LICENSE
- Code of conduct: .github/CODE_OF_CONDUCTOR.md
Awesome Lists containing this project
- awesome-frontend - Oasis Engine - Oasis Engine is a web-first and mobile-first high-performance real-time development platform.  (Repository / WebGL)
- awesome-game-engine-dev - Galacean - Web/Mobile-first engine built on WebGL and glTF. (Libraries / JavaScript)
- awesome-github-star - engine
- awesome - galacean/engine - A typescript interactive engine, support 2D, 3D, animation, physics, built on WebGL and glTF. (TypeScript)
- awesome - galacean/engine - A typescript interactive engine, support 2D, 3D, animation, physics, built on WebGL and glTF. (TypeScript)
README
# Galacean Engine
[](https://codecov.io/gh/galacean/engine)
[Galacean Engine](https://www.galacean.com/engine) is a high-performance, real-time interactive engine designed primarily for web and mobile platforms. It employs a component system architecture and emphasizes ease of use and lightweight design. Developers can create projects using either editor or pure code.
## Features
- 🖥 **Platform** - Support HTML5 and wechat minigame
- 🔮 **Graphics** - Advanced 2D + 3D graphics engine
- 🏃 **Animation** - Powerful animation system
- 🧱 **Physics** - Powerful and easy-to-use physical features
- 🎨 **GUI** - Flexible UI system with drag-and-drop and dynamic interactions
- 👆 **Input** - Easy-to-use interactive capabilities
- 📑 **Scripts** - Use TypeScript to write logic efficiently
## Usage
### Using Editor
We recommend using [**Editor**](https://galacean.antgroup.com/editor) for a streamlined workflow that enables seamless integration between artists and developers. Its intuitive visual tools allow artists to quickly create scenes and enable developers to write custom logic, with convenient platform export. You can even create projects based on pre-built case templates.
### Using Pure Code
If you want to build your project using pure code via runtime, install the engine from npm:
```sh
npm install @galacean/engine
```
Create a simple scene:
```typescript
import { BlinnPhongMaterial, Camera, DirectLight, MeshRenderer, WebGLEngine, PrimitiveMesh } from "@galacean/engine";
// Create engine by passing in the HTMLCanvasElement id and adjust canvas size
const engine = await WebGLEngine.create({ canvas: "canvas-id" });
engine.canvas.resizeByClientSize();
// Get scene and create root entity
const scene = engine.sceneManager.activeScene;
const rootEntity = scene.createRootEntity("Root");
// Create light
const lightEntity = rootEntity.createChild("Light");
const directLight = lightEntity.addComponent(DirectLight);
lightEntity.transform.setRotation(-45, -45, 0);
directLight.intensity = 0.4;
// Create camera
const cameraEntity = rootEntity.createChild("Camera");
cameraEntity.addComponent(Camera);
cameraEntity.transform.setPosition(0, 0, 12);
// Create sphere
const meshEntity = rootEntity.createChild("Sphere");
const meshRenderer = meshEntity.addComponent(MeshRenderer);
const material = new BlinnPhongMaterial(engine);
meshRenderer.setMaterial(material);
meshRenderer.mesh = PrimitiveMesh.createSphere(engine, 1);
// Run engine
engine.run();
```
## Contributing
This repository contains the runtime's source code and documentation. Everyone is welcome to contribute—whether you find a bug, have a feature request, or want to tackle a task from our roadmap, please get in touch.
Make sure to read the [Contributing Guide](.github/HOW_TO_CONTRIBUTE.md) / [贡献指南](https://github.com/galacean/engine/wiki/%E5%A6%82%E4%BD%95%E4%B8%8E%E6%88%91%E4%BB%AC%E5%85%B1%E5%BB%BA-Oasis-%E5%BC%80%E6%BA%90%E4%BA%92%E5%8A%A8%E5%BC%95%E6%93%8E) before submitting changes.
## Clone
Prerequisites:
- [git-lfs](https://git-lfs.com/) (Install by official website)
Clone this repository:
```sh
git clone [email protected]:galacean/engine.git
```
## Build
Prerequisites:
- [Node.js v15.0.0+](https://nodejs.org/en/) and NPM (Install by official website)
- [PNPM](https://pnpm.io/) (Install globally by `npm install -g pnpm`)
In the folder where you have cloned the repository, install the build dependencies using pnpm:
```sh
pnpm install
```
Then, to build the source, using npm:
```sh
npm run b:all
```
## Links
- [Official Site](https://galacean.antgroup.com/engine)
- [Editor](https://galacean.antgroup.com/editor)
- [Documentation](https://galacean.antgroup.com/engine/docs)
## License
The engine is released under the [MIT](https://opensource.org/licenses/MIT) license. See LICENSE file.