Mandelbrot集旋转

Question

有一个简单的JS代码，可以呈现非常基本的Mandelbrot分形。

let canvas = document.getElementsByTagName("canvas")[0],
  canvasWidth = canvas.width,
  canvasHeight = canvas.height,
  ctx = canvas.getContext("2d");

const maxIterations = 100,
  magnificationFactor = 200,
  panX = 2,
  panY = 1.25;

let drawPoint = (x, y, color) => {
  var pointSize = 1;
  ctx.fillStyle = color;
  ctx.beginPath();
  ctx.arc(x, y, pointSize, 0, Math.PI * 2, true);
  ctx.fill();
}

let mandelbrot = (c, z = 0) => z ^ 2 + c;

let BelongsToMandelbrotSet = (x, y) => {
  let realComponentOfResult = x,
    imaginaryComponentOfResult = y;

  for (let i = 0; i < maxIterations; i++) {

    let tempRealComponent = realComponentOfResult * realComponentOfResult - imaginaryComponentOfResult * imaginaryComponentOfResult + x,
      tempImaginaryComponent = 2 * realComponentOfResult * imaginaryComponentOfResult + y;

    realComponentOfResult = tempRealComponent;
    imaginaryComponentOfResult = tempImaginaryComponent;
  }

  if (realComponentOfResult * imaginaryComponentOfResult < 5)
    return true;

  return false;
}

for (let x = 0; x < canvasWidth; x++) {
  for (let y = 0; y < canvasHeight; y++) {

    let belongsToSet =
      BelongsToMandelbrotSet(x / magnificationFactor - panX,
        y / magnificationFactor - panY);
    if (belongsToSet)
      drawPoint(x, y, '#000')

  }
}

body {
  margin: 0;
}

<canvas width="800" height="800"></canvas>

任务是沿其轴以随机角度旋转此分形。它不应该是画布旋转或它的图像数据，但我必须调整初始的分形公式来做到这一点。

例如，如果角度为45度或以弧度为单位的PI/4，则输出应如下所示

我试过玩x=center。x 500*数学。cos（θ），y=中心。y 500*数学。sin（θ）没有任何成功。

Answer 1

您可以尝试在主循环中变换坐标，在主循环中进行缩放和平移：

 let x1 = x * Math.cos(theta) - y * Math.sin(theta)
 let y1 = x * Math.sin(theta) + y * Math.cos(theta)

 let belongsToSet = BelongsToMandelbrotSet(x1/magnificationFactor - panX, ...
 ...drawPoint(x, y, '#000')

要进一步简化此过程，请为所有类型的变换创建仿射变换矩阵并应用一次。