Кардиоиды: часть 1

Что такое кардиоида?
Кардиоида – это фигура, созданная с помощью одной точки на окружности и прокатки ее по другой окружности с таким же радиусом. Это то, что я имею в виду:

Но кардиоида на самом деле соответствует уравнению:
r = x + x(sin(theta));

Где «тета» — это угол, под которым катящийся круг (черный, на картинке выше) находится по отношению к неподвижному конгруэнтному кругу (синий, на картинке выше), а «r» — это радиус. Чем выше переменная «х», тем больше кардиоида.

Когда x = 100, вот как выглядит кардиоида, основываясь на коде, который я написал ниже:

(Ссылка на код ближе к концу.)

Такова основная структура кардиоиды.

Так как же мы сделали эту кардиоидную с помощью обработки?

Во-первых, мы объявили наши переменные, r и theta.

// declares the universal variables: r (radius) and theta (the angle)
float r; 
float theta;

Затем настраиваем программу.

//sets up the program.
void setup(){
  size(600, 600);
  r = height * .25;// radius is 1/4 of the height. (this doesn't matter later)
  theta = 0;
  background(0);
  frameRate(1000);
}

После этого все это вычерчиваем.

void draw() {
  stroke(random(255), random(255), 255);// makes a random color (always has blue in it).
  strokeWeight(random(5));// makes a random stroke thickness.
  translate(width/2, height/2);// moves the top left of the grid to the center of the canvas.

Теперь, когда у нас есть правильное позиционирование, мы составим уравнение для перевода декартовых координат в полярные координаты.

  // this translates cartesian coordinates into polar coordinates.
  float x = r*sin(theta) ;
  float y = r*cos(theta) ;

Теперь, когда это сделано, мы расставили точки, чтобы сделать кардиоидную:

  point(x, y);// makes a point at the specified x and y.
  theta+=1; // increases theta by 1.

Затем составим основное уравнение для кардиоиды:

  // this is the equation for a cardioid: r = x + x(sin(theta)).
  // we use 'xc' because we've
  // already used the 'x' variable for the x coordinate
  // play around with xc!
  float xc = 100;
  r = xc + xc* sin(theta);

Наконец, если вы хотите сбросить холст, добавьте следующие строки кода:

// clears the canvas and starts over the process.
  if (theta == 360){
    background(0);
    theta = 0;
  }
}

Поэкспериментируйте с различными переменными, чтобы получить разные кардиоиды. Что дает вам больше лепестков (лепесток — это основная кардиоида, которую я вам показал)? Что делает его более гладким? Можете ли вы сделать кардиоидную больше, если хотите? Как вы можете сделать кардиоидную с линиями? Можете ли вы сделать круги видимыми, как на первой гифке?
Столько вопросов! Я отвечу на них во второй части.
А пока дайте мне знать, если вы разберетесь с ними, и покажите мне, что вы сделали!

Полный код на GitHub здесь.

Выход до следующего раза,

Ави