Phaser 2 Tilesprite not stopping on exact position?

Phaser 2 / CE
1

I’m working on a slot machine written with Phaser and having some issues with the tile sprite reels. Strangely enough, they don’t seem to be stopping on the exact position, and this is getting frustrating. When the reel is spun, and stops, it outputs the results… and the reel stops two-three images away, rarely on the actual.

I’m not sure if it has to do with the image loading (which is dynamic), or how the reels stop. The reel size is 128 x number of images, and the whole tile sprite is drawn from a bitmap. Below I’m posting the reel generator code and method that stops it… hoping that someone can spot something I’ve overlooked here.

// Handle Image Loading //
loadCheck()
{
	let bmpPic = null;
	let heightAdjustment = 0;
	bmpPic = game.add.bitmapData(this.reelSize, this.reelSize * this.gameData.length);  
	bmpPic.draw('Reel', 0, 0);  
	let imageSize = 0.65;
	setTimeout(() => {

	  let curSlot = 0;
	  
	  for(let i = 0; i < this.gameData.length; i++)
	  {
		
		curSlot = ((i * this.reelSize));
		this.spritePositions.push(curSlot);
		let currentImage;
		if (i == 0)
		{
		  currentImage = game.add.sprite(150, 0, 'image_' + i);
		} else {
		  currentImage = game.add.sprite(600, 600, 'image_' + i);
		}

		// Draw image centered correctly in slot //
		if (currentImage.height == 69)
		{
		  heightAdjustment = 50;
		  currentImage.scale.setTo(imageSize, imageSize);
		  bmpPic.draw(currentImage, 5, curSlot + heightAdjustment);
		} else {
		  heightAdjustment = 6;
		  currentImage.scale.setTo(imageSize, imageSize);
		  bmpPic.draw(currentImage, 7, curSlot + heightAdjustment);
		} 
		
		currentImage.destroy();
	  }

	  let tsPrototype = game.add.sprite(0, 600, bmpPic);
	  this.reels.push(game.add.tileSprite(170, 0, tsPrototype.width, tsPrototype.height, tsPrototype.key));

	  this.reelGroup.add(this.reels[0]);
	  this.StartTimers();
	}, 600);
}

// Stop a moving reel (This code isn’t formatting?) //
StopTimers()
{
this.reelScroll[0] = false;
this.reelTimers[0].stop();
this.reels[0].tilePosition.y = this.spritePositions[Math.ceil(Math.random() * this.spritePositions.length)] + this.reelSize;
console.log(this.reels[0].tilePosition.y);
this.canSpin = false;
}

2

Well. I’m baffled. I set the random target to a negative position. Now it suddenly loads exact.