ggwzrd / threejs-galaxy

Three.js Galaxy generator

threejs-galaxy

This project is heavily inspired by Yuri Artiukh's video [aka @akella] in which he explained the math and architecture behing the website viverse.com [outdated].

I decided to make a module out of this since everyone should be able to generate their own galaxies and the creative possibilities are infinite. 👨‍🚀

Check a few example that I have created on wzrd.mk/galaxy

I do not provide the textures of the particles and stars to ensure that all galaxies are unique. You can find a basic example in /assets

• threejs-galaxy
  • Install
    • npm
    • yarn
  • Getting started
  • Contributing
  • Credits
  • License

Install

npm

  npm install threejs-galaxy

yarn

  yarn add threejs-galaxy

Getting started

All you need to generate a galaxy is the snippet below.

import Galaxy from 'threejs-galaxy'

import particleTexture from './assets/particle-example.png'

const galaxy = new Galaxy({
  canvas: document.querySelector('#c'),
  window: window,
  layers: [
    {
      color: '#FFFFFF',
      texture: particleTexture,
      count: 10000,
    },
  ]
})

galaxy.render()

In order to start the animation you will need to add the following code.

galaxy.play()

Full example can be found in examples/basic.ts

Contributing

Consult CONTRIBUTING.md to start contributing to threejs-galaxy.

Credits

Yuri Artiukh [aka @akella]

License

The MIT License (MIT)