Problem plotting points

JavaScript
4

Right.

This is an easy fix:

  1. Do not use hardcoded values like: centerX
  • You have access to the canvas (centerX is the canvas width divided by 2)
  1. This formula is almost correct, but, from its order, it looks like you might be thinking about the execution in difficult way:
r * Math.cos(theta) + 75;
  • What you want to do is:
    • Take the center of your “circle” (based on the center of the canvas)
    • Add the radius @ some angle

If this does not make much sense…sorry, but here is the formula:

x = offset + r X cos(theta)

Now, to optomise your code (if you are interested):

  • I would not calculate the offset within the polar2Cartesian function, because, what if you want to use a different center of circle?
  • The minute you see code like below, think how to DRY (don’t repeat yourself) it out:
polarToCartesian(150, 22.5)
polarToCartesian(150, 45)
polarToCartesian(150, 67.5)
...
  • What is repeated, and how are these points calculated?

EDIT: I helped someone with something similar, and decided to take it further, if you are interested: Moving drawn ctx image - #3 by Sky020

Hope this helps

1 Like