Reactive Programming with RxJS/

...

/

Creating the Starfield of the Spaceship Game Using Range Operator

Creating the Starfield of the Spaceship Game Using Range Operator

Learn to set up a stage for the spaceship video game.

We'll cover the following...

The first things we need to create for a game set in space are stars. We’ll create a starfield that scrolls down to give the player a feeling of traveling through space. For this, we’ll first generate the stars using the range operator:

Press + to interact
var SPEED = 40;
var STAR_NUMBER = 250;
var StarStream = Rx.Observable.range(1, STAR_NUMBER)
.map(function() 
{ 
  return {
      x: parseInt(Math.random() * canvas.width),
      y: parseInt(Math.random() * canvas.height),
      size: Math.random() * 3 + 1
}; })

Each star will be represented by an object that contains random coordinates and sizes between 1 and 4. This ...