Polar Coordinates

Jackson Reeves
4 min readFeb 22, 2021

--

Math Connection!

Sometimes you need to work with a grid that wants a very specific type of coordinates when your project probably benefits from using a different type of coordinates. Especially if your project seems very dependent on angles, or if your project seems to want to shift the grid’s attention away from a predetermined starting point and toward a starting point of your choosing, around which all other points could be defined. But is there a way to handle points that doesn’t involve rectangular coordinates? Yes! Enter polar coordinates.

With rectangular coordinates, every point is defined in terms of two distance-centric variables: its horizontal distance and its vertical distance. The first one is the x-coordinate (and it’s usually the independent variable), and the second one is the y-coordinate (and it’s usually the dependent variable). When using rectangular coordinates, every point is defined relative to a predetermined origin (e.g., the center of the grid if it’s the standard Cartesian coordinate system, the upper left corner if it’s the HTML Canvas), and you need to represent every point in terms of its horizontal and vertical distances away from that point.

With polar coordinates, every point is defined in terms of two different variables: its distance away from a central point and its angle relative to that central point. The first one is the r-coordinate (for “radius”), and the second one is the theta-coordinate (because math people like using Greek letters for variables, especially for angles). When using polar coordinates, every point is defined relative to a central point of your choosing, and you need to represent every point in terms of its radial distance from that point along with its angle relative to that point. In other words, you pick the origin. Unlike with rectangular coordinates, polar coordinates tend to treat each coordinate as an independent variable. (Note: This is an over-generalization. Plus, the mere concepts of independent and dependent are arbitrary, and you can even switch them when using rectangular coordinates.)

But if you’re using an interface that’s inherently rectangular (e.g., HTML Canvas, any browser window), how can you make it work with polar coordinates? By converting them! If you have rectangular horizontal and vertical coordinates, you can flatten them into a single polar radial coordinate. You can also flatten rectangular horizontal and vertical coordinates into a single angle coordinate. Check out the formulas:

As a result, all you need to do to make your code work with polar coordinates is to define new variables and set them equal to functions similar to the ones above, in which the x- and y-values in those variable definitions are the x- and y-coordinates that your code is already used to dealing with (either because it’s working with HTML Canvas or because it’s anticipating a browser window environment). An important caveat: If you’re using HTML Canvas, you need to first convert HTML Canvas coordinates (with its upper left origin and its down-is-positive y-orientation) into Cartesian coordinates before then converting them into polar coordinates.

The major drawback to converting everything from rectangular to polar coordinates is that you now need to think of your display environment in terms of a polar grid instead of a rectangular one. And the polar grid is… different:

However, polar coordinates are in many ways more intuitive than rectangular ones. They tell you how far away something is (the radial coordinate) and in what direction you need to go in order to reach it (the angle coordinate). In other words, polar coordinates answer the questions “how far away?” and “in what direction?” In day-to-day activities, you don’t think about going to the grocery store as traveling 3 miles east then 4 miles north; you think about it as going 5 miles northeast. If you’ve ever used an app with GPS, the feedback the app gives you is basically in a polar format, with your current location as the origin (which constantly shifts as you move around). As a result, even if polar coordinates seem more difficult than rectangular ones, it’s often more useful to think in terms of them. Just because you learned about rectangular coordinates first in school doesn’t mean they’re the best approach!

--

--

Jackson Reeves

Inquisitive full-stack developer with more than a decade of experience in education and journalism.