eduar.londono Posted October 25, 2015 Share Posted October 25, 2015 How drag sprite around circle?Thanks! Link to comment Share on other sites More sharing options...
jmp909 Posted October 25, 2015 Share Posted October 25, 2015 I always forget my trigonometry, so I'm glad to accept this challenge... this should get you started http://phaser.io/sandbox/CpErwgAd/play drhayes, san40511 and chongdashu 3 Link to comment Share on other sites More sharing options...
jmp909 Posted October 25, 2015 Share Posted October 25, 2015 in fact, since you're request was actually to drag the sprite, I've made a version where you need to actually hold the mouse down on it to move ithttp://phaser.io/sandbox/hftdIYxX/play the only improvement I'd like to make, but am not currently sure about, is to only move the sprite when the pointer is actually over it. j lewster32, jdnichollsc and san40511 3 Link to comment Share on other sites More sharing options...
jmp909 Posted October 26, 2015 Share Posted October 26, 2015 here's another version that only drags the sprite when over it's hit area (i have given it a bigger hit area in a group)http://phaser.io/sandbox/gHNNubSp/play thanks to Skeptron for fixing my mouse issue.. seems like mouseMoveCallback is not currently documented in 2.4.4 but was in 2.3 chongdashu and drhayes 2 Link to comment Share on other sites More sharing options...
chongdashu Posted October 26, 2015 Share Posted October 26, 2015 Nice work yet again, jmp909. Perhaps another thing to add to examples! Link to comment Share on other sites More sharing options...
fedora Posted November 30, 2015 Share Posted November 30, 2015 jmp909 -- Is it possible to use your example -- but instead of mouse drag you move by using cursor keys -- I was unable to figure it out -- Any assistance would be appreciated. Link to comment Share on other sites More sharing options...
jmp909 Posted November 30, 2015 Share Posted November 30, 2015 here's one way to do it using Sin/Coshttp://phaser.io/sandbox/gXbgAMnK/play and another using phaser's point rotation function (with a distance constraint... http://phaser.io/docs/2.4.4/Phaser.Point.html#rotate)http://phaser.io/sandbox/wDpGcNHm/play I've taken 0 angle as the top of the circle, but that's not the normal way angles are measured so i've shifted the value accordingly I'll leave you a challenge... add acceleration/deceleration to the movement.... samme 1 Link to comment Share on other sites More sharing options...
fedora Posted December 1, 2015 Share Posted December 1, 2015 jmp909 Thanks. That worked perfectly. But I guess you knew it would (fyi I used your first suggestion) I know I can alter speeds of the left/right keys by adding: if(leftKey.isDown) { angle+=speed+4 moved=true }I know this is not what you asked -- so I will do some digging to see what I can come up with as aoptions. Link to comment Share on other sites More sharing options...
jdnichollsc Posted September 13, 2016 Share Posted September 13, 2016 Hi @jmp909 Can you help me? What happen with the angles using pivots? Because the Angle 0 is incorrect, check please http://codepen.io/jdnichollsc/pen/KgdRvV?editors=0010 I want to move the rotate control in top middle like Fabric.js. Thanks in advance, Nicholls Link to comment Share on other sites More sharing options...
jdnichollsc Posted September 14, 2016 Share Posted September 14, 2016 Done! Link to comment Share on other sites More sharing options...
Azumi Posted September 14, 2016 Share Posted September 14, 2016 I have battled this problem myself recently and came up with this (working!) solution: function angle(cx, cy, ex, ey) { var dy = ey - cy; var dx = ex - cx; return Math.atan2(dy, dx); } function update() { var r = 44; var bulltargetAngle = angle( circleCenter.x, circleCenter.y, this.game.input.activePointer.x, this.game.input.activePointer.y); bullet.y = player.y + Math.sin(bulltargetAngle) * r; bullet.x = player.x + Math.cos(bulltargetAngle) * r; } In the above code a sprite named "bullet" rotates around the circle pattern following mouse pointer. jdnichollsc 1 Link to comment Share on other sites More sharing options...
Recommended Posts