Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
longnt80

Detect chosen item in fortune wheel

Recommended Posts

I want to make a fortune wheeler game where user can click the button to spin the wheel then when it stops, it will show what user get.

 

I create the function to spin the wheel but not I'm sure which approach to detect which item is chosen. Can someone give me an idea how to approach this?

 

Thanks a bunch!

See the Pen rGRRMb by longnt80 (@longnt80) on CodePen

Link to comment
Share on other sites

You can use modulus on current rotation by 360 and get absolute value. Based on that you can determine where arrow is pointing. You can play with snap a bit so arrow won't stay on edge.

  • Like 5
Link to comment
Share on other sites

@Sahil @OSUblake 

In the example above, why the _gsTransform.rotation value has a different value than the random rotation value that I gave the wheel?

 

Because I saw in this demo from Greensock, the values passed in and the _gsTransform's values are the same: 

See the Pen ihsjA?editors=0011 by GreenSock (@GreenSock) on CodePen

.

Link to comment
Share on other sites

Hi @longnt80

 

It's because you're using a relative value.

tl.to(wheel, 7, { rotation: "+=" + random })

 

Which is the same as doing this.

tl.to(wheel, 7, { rotation: wheel[0]._gsTransform.rotation + random })

 

  • Like 3
Link to comment
Share on other sites

Thank you @OSUblake

 

There is still a different between those values. But I just figured out that it was because of the timeScale tween I applied on the timeline. This is interesting.

  • Like 1
Link to comment
Share on other sites

1 minute ago, longnt80 said:

There is still a different between those values. But I just figured out that it was because of the timeScale tween I applied on the timeline. This is interesting.

 

Ah, yes. You're tweening the timeScale to 0, so the timeline animation will actually never reach the value you set because it's effectively paused when the timeScale is at 0.

  • Like 2
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×