CODEWITHSUNDEEP
javascriptmathrange
mheavers
mheavers

Reputation: 30158

How to scale a range of numbers in javascript so that integers in the middle ranges become greater and the outer limit numbers remain unchanged

I have a bunch of users taking a poll, and I want to visualize those results on screen via some circles that change size according to % of people who voted for the answer. What currently happens is that, because you won't likely have 100% of people all voting for the same answer (most answers come in,say, at the 10-40% range) - the change in size doesn't appear that great. But if I adjust the scale of the circles for this, then if respondents would actually all vote for the same answer, the circle would be way too big.

I need a way to scale these numbers, so that those middle ranges of numbers become more greatly accentuated toward their outer ranges (so, a 10% might look closer in size to a 0%, and a 40% might look closer to a 100%.

How would I do this? Anyone know the function (or even mathematical concept). My arithmetic is rusty...

Upvotes: 1

Views: 158

Answers (1)

T McKeown
T McKeown

Reputation: 12847

You should decide first what the max circle size can be. Then base the percentages off that.

For example, if the diameter of the max circle is 100 pixels, then what is 40 pct of that max?

Or to make the biggest pct occupy 100 pct of the max you could then divide the max pixels (100) by your max pct (40). So 100/40=2.5

Now you could scale all circles 2.5 times their normal size.

Upvotes: 1

Related Questions