CODEWITHSUNDEEP
javascriptbrowserslider
David
David

Reputation: 199

Manipulating the slider - the circle disappears

Manipulating the slider until the end, the circle that represents the star disappears or does a different motion. See: jsfiddle.net/NxNXJ/13 Unlike this: astro.unl.edu/naap/hr/animations/hrExplorer.html

Can you help me?? Thanks

Upvotes: 0

Views: 254

Answers (1)

Kevin
Kevin

Reputation: 76184

When you supply a big luminosity, You're rendering a circle which is millions of pixels tall. The broswer might not render it because it's so big. However, you are really only interested in a small slice of that big circle - namely, the bit that fits in your tiny window. At some point, it doesn't make sense to increase the size of the circle, since you can't observe a change in the curvature of the circle - it just looks like a straight vertical line.

This apparent verticality occurs around when x^2 + y^2 = R^2, where R is the radius of the star, Y is half the height of your window, and x is R-1. Solve for R in terms of Y, and you get

function maximumNecessaryRadius(windowHeight){
    y = windowHeight / 2;
    maxRadius = (y*y - 1)/2;
    return Math.round(maxRadius);
}

When resizing the star, check to make sure that its radius doesn't exceed the maximum necessary radius. Rendering it any larger than that is overkill.

Example Implementation

Upvotes: 1

Related Questions