I am developing a website and I'm trying to load multiple "points" within a Note that in browsers, the y-axis is flipped. As you can see, my When I load my website, several dots (like the one in the picture) are appended to the inside of the The problem is that if a dot has something near the top or bottom- for example, What I need help with is determining a way to still have a randomized x-value, but is also restricted to stay within the borders of the I'm sorry if this is too short an explanation: I currently have to leave my computer. I will try to edit in more information and reply to comments as soon as I can. Thank you!div
is just a rectangle. See the picture below, where the purple box represents the dimensions of the div
, which is exactly 150x700 pixels. div
is not actually rectangular in appearance, though it is still manipulated as though it were. It has rounded corners, each corner's border-radius
being 75px.div
. Each dot has a specific y-value, and the x value is randomized between 1 and 150.y=690
- the x value can still be randomized in a way that the dot will appear outside of the rounded corners.div
, rather than it's rectangular frame.
Position points within an oval-like area
0
$\begingroup$
. If you don't know much about web development, a
graphing-functions
random
2 Answers
1
For $1\leq y\leq 75$ take random $x$ between $[ 76-\sqrt{75^2-(y-75)^2}]$ and $[74+\sqrt{75^2-(y-75)^2}]$, where $[\cdot ]$ indicates integer part.
For $76\leq y\leq 625$ take random $x$ between $1$ and $150$.
Finally, for $626\leq y\leq 700$ take random $x$ between $[ 76-\sqrt{75^2-(y-626)^2}]$ and $[74+\sqrt{75^2-(y-626)^2}]$.
-
0You are wellcome! – 2012-06-10
0
If the top and bottom curve are circular arcs, given $y$ you can easily find the interval of $x$ values for which $(x,y)$ is inside your region. Take $x$ to be a random number in that interval.