Search the Community

Showing results for tags 'motion path'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • HTML5 Game Coding
    • News
    • Game Showcase
    • Coding and Game Design
  • Frameworks
    • Phaser
    • Pixi.js
    • Babylon.js
    • Panda.js
    • melonJS
    • Haxe JS
    • Kiwi.js
  • General
    • General Talk
  • Business
    • Collaborations (un-paid)
    • Jobs (Hiring and Freelance)
    • Services Offered

Found 1 result

  1. Hi all, first post, happy to be here. I'm pretty new to Phaser (love it) but not to JavaScript or web development. For my first game, I'm making a Raiden-style top-down shooter. My problem is in using motion paths. I can get them working for one enemy ship, but I'd like to apply them to all the ships in a group. The ships from the group enter the world at an interval, so they'd be on different parts of the path at any given time. Here's my group. What I was trying to do is to use that pathPosition property to store the correct index value of the path for each individual ship. enemies = game.add.group(); enemies.enableBody = true; enemies.physicsBodyType = Phaser.Physics.ARCADE; enemies.createMultiple(10, 'enemy'); enemies.setAll('anchor.x', 0.5); enemies.setAll('anchor.y', 0.5); enemies.setAll('scale.x', 2.0); enemies.setAll('scale.y', 2.0); enemies.setAll('angle', 180); enemies.setAll('pathPosition', 1); // this is a custom value for motion path Here's my spawning function: function spawnEnemy(numOfEnemies) { if (numOfEnemies > 0) { var randTime = getRandom(1000, 1500); // var x = game.rnd.integerInRange(50, game.width - 50); // var y = -100; var x = path[0].x; var y = path[0].y; // a promise that handles enemy spawning var sendEnemies = new Promise(function (resolve) { var enemy = enemies.getFirstExists(false); if (enemy) { enemy.reset(x, y); enemy.checkWorldBounds = true; // without this can't check if sprite is in bounds enemy.events.onOutOfBounds.add(hasLeftBottom, this); // this adds a custom callback //enemy.body.velocity.y = enemySpeed; } resolve(1); }); // calls the promise and sets a success result. sendEnemies.then(function (result) { setTimeout(function () { spawnEnemy(numOfEnemies - 1); }, randTime); }); } } Here's my plot function: function plot() { var x = increment / game.width; for (var i = 0; i <= 1; i += x) { var px = game.math.catmullRomInterpolation(points.x, i); var py = game.math.catmullRomInterpolation(points.y, i); path.push({ x: px, y: py }); } } Here's what I'm trying to do in my update function: enemies.forEach(function (enemy) { if(path[enemy.pathPosition]){ enemy.x = path[enemy.pathPosition].x; enemy.y = path[enemy.pathPosition].y; enemy.pathPosition ++; } else{ enemy.body.velocity.y = 300; } }); What I get is a jumbled mess of flashing enemy ship sprites crawling through their points. There must be a better way. Help?