localtoast_zader

Much appreciated! I'll look to mess around with setOrigin - still very new to phaser so discovering alot as I go.

I think I see the issue. Counter-intuitively, putting the `script` tag inside your `canvas` tag doesn't attach your Phaser game to the canvas, this is just a html5 thing. You can have your `script` tag that references your game anywhere (probably best to keep it in your `head` tag with the other scripts. Inside the config object for your game though you have to link to the html canvas element like so: var game = new Phaser.Game({ type: Phaser.AUTO, width: 1000, height: 1000, physics: { default: 'arcade', arcade: {gravity: {y: 500}} }, scene: [ scene ], canvas: document.querySelector('canvas'); // <-- here! }); The `document.querySelector()` method grabs the first html element that matches the css argument passed in, so here it grabs the first `canvas` tag. Probably best practices would be to add an id to your canvas tag and use `document.querySelector('#yourCanvasIdHere')`. Let me know if this works - otherwise send your js and I can help you work through it!

I was able to mostly solve my issue by using the `Phaser.Geom.Line` as opposed to the `Phaser.GameObjects.Line`: // creating my line const line = new Phaser.Geom.Line( sprite1.x, sprite1.y, sprite2.x, sprite2.y ); // in Scene.update() this.graphics.strokeLineShape(line) I'd still like to be able to do some "GameObject-y" things with these lines though, so if someone can help with the original question that'd be much appreciated!!

I'm primarily an Angular developer, started messing around with phaser just recently and have been really enjoying the way the frameworks complement each other. 1. When extending a Phaser object to create your own object, you can add an Angular EventEmitter (or emitters) as a way to communicate between the frameworks. Phaser objects in turn can be passed in as inputs to an Angular component - or you can create an Angular Service for your Phaser.Game object and inject that service into components that need it. I'm not quite sure of the best method yet, but the patterns I've been experimenting with have been very encouraging so far. 2. Obviously I think that frameworks are a great way to go. Angular conferences often talk about integrating with JS game engines; this one calls out Phaser specifically:

Assuming 2 sprites in a scene, how does one draw a line from one to the other? Here's my attempt, starting from one of the examples in the sandbox: function create (data) { const sprite1 = this.add.sprite(100, 100, 'mech'); const sprite2 = this.add.sprite(400, 400, 'mech'); sprite1.setInteractive(); sprite1.on( 'pointerdown', () => this.add.line( 0, 0, sprite1.x, sprite1.y, sprite2.x, sprite2.y, 0xff0000 ) ); } result after clicking: Slope and magnitude looks right, but the starting and ending points appear wrong. Can anyone see what I'm doing wrong? src_scenes_boot data.js