Spinning wheel

1

i need help desperately…

i need to create a similar project in school like this
http://www.quickcompliance.net/qcsamples/Privacy101Audio/course.html

the spinning wheel is found when you click on item 9

i intend to create a spinning wheel with just 6 slices.

can anyone give me tip on how to make this?

i need to be able to display the value on the right side of the screen.

thanks a million for giving me a hand in this situation

2

Here’s a few ideas to get you started.

If you draw the wheel in Flash, and center it around the cross-hairs in the editor, then in actionscript you can rotate it. Let’s say your wheel movie is called wheel_mc.


wheel_mc._rotation = wheel_mc._rotation + spinSpeed;

This spins the wheel, but what should you set spinSpeed to?
We’d like to to start fast, then slow down over time.
One half of a cosine wave might fit the bill for controlling this kind
of deceleration. Let’s say “spinDuration” is set to the amount of time
you want the spinning to last (10 seconds or so) and “startOfSpin” is set to
the value of “getTimer().001” (or the current time in seconds) at the time the
wheel starts spinning…



wheel_mc.onEnterFrame = function() 
{
  // get the elapsed time since the start of the spin
  elapsedTime = getTimer()*.001 - startOfSpin;

  // convert it to a number from 0-1
  elapsedTime /= spinDuration;

  if (elapsedTime > 1) {
     // we're done spinning - see below for an example of what to do here...
     spinSpeed = 0;
     this.onEnterFrame = 0;
  }
  else {
      // Math.cos over the range from 0 thru PI will produce a sine-wave
      // curve starting at 1 and going down to -1.    This may be a good
      // approximation of the wheel deceleration.
      spinSpeed = 15 + Math.cos(Math.PI * elapsedTime)*15;
  }

   this._rotation = this._rotation + spinSpeed;
}

Over the course of “spinDuration” (whatever you set that to), the spinSpeed will slow down from 30 to 0. Note: If you find your wheel is going backwards, invert the cosine wave by using -Math.cos().

When elapsedTime reaches spinDuration, then you can stop spinning the wheel and figure out what number you’re at, by looking at the current value of wheel_mc._rotation.


curPos = wheel_mc._rotation/360;
curPos -= Math.floor(curPos);           // this gets it to 0-1

// let's say all your numbers are stored in an array from 0 - n-1
curChoice = myArray[Math.floor(curPos*n)];

// now you know your current choice... what are you going to do with it?

As you can see, converting numbers to a 0-1 range is very useful for converting from one kind of data to another. Numbers in this form are called “normalized”, and they are a very powerful tool for programmers.

In this example, I used normalization to convert from the spin-time to the position on the cos wave that I wanted to exploit, and also to convert from wheel position (0-360) to an array lookup for your wheel wedge scores.

  • Jim
3

thanks for this code. i’m trying this one
but…if it won’t be much of a bother…
can you also send the code on how to display the values in the array?
i have to admit i really dont know how and wanna learn so much!
there are 6 slices/values (the values are “<2”, “2-4”, “4-6”, “6-8”, “8-10”, “>10”)

also, what script goes to the “click to spin” button so i can initiate spin

THANKS AGAIN for immediate reply

4

You can draw the values directly on the wheel. Let’s say when the wheel is in it’s normal position it has a “10” at the top, and the following numbers going around the wheel (which has 7 wedges).

10,70,40,30,90,50,60

Then you would store those numbers in an array.

myArray = [10,70,40,30,90,50,60];

And use the code I provided above to convert the wheel’s final rotation to a value from that array. Here’s a better version which doesn’t require the variable “n”.


curPos = wheel_mc._rotation/360;
curPos -= Math.floor(curPos);           // this gets it to 0-1
curChoice = myArray[Math.floor(curPos*myArray.length)];