ANTON072
2/3/2015 - 3:28 PM

らせん http://bl.ocks.org/ANTON072/raw/cd79dc33fff6bd0a2070/

<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <style>
    * {
      margin: 0;
      padding: 0;
    }1
  </style>
  <script src="https://code.createjs.com/createjs-2014.12.12.min.js"></script>
</head>
<body>

<canvas id="canvas"></canvas>

<script>

  var canvas = document.getElementById('canvas');
  canvas.width = window.innerWidth;
  canvas.height = window.innerHeight;

  var stage = new createjs.Stage(canvas);
  var myShape = new createjs.Shape();

  stage.addChild(myShape);

  var a = 1.14; // 係数
  var N = 100; // 周回数
  var Loop = N * 100; // 繰り返しの回数
  var T = ( 2 * Math.PI ) / 120; // 1ステップの偏角
  var LR = true;

  function draw(tx, ty) {
    var gr = myShape.graphics;

    gr.beginStroke(0x00FF99);

    R = Math.pow(a, T);
    X1 = R * Math.cos(T);
    if (LR) {
      Math.abs(X1)
    }
    else {
      X1 = X1 * -1
    }
    Y1 = (R * Math.sin(T)) * -1;

    for (i = 2; i < Loop + 1; i++) {
      R = Math.pow(a, (T * i));
      X1 = R * Math.cos(T * i) + tx;
      if (LR) {
        Math.abs(X1)
      }
      else {
        X1 = X1 * -1
      }
      Y1 = (R * Math.sin(T * i)) * -1 + ty;
      gr.lineTo(X1, Y1);
    }
  }

  draw(canvas.width / 2 - 100, canvas.height / 2);
  draw(canvas.width / 2 + 100, canvas.height / 2 - 100);
  draw(canvas.width / 2 + 300, canvas.height / 2);


  createjs.Ticker.setFPS(60);
  createjs.Ticker.addEventListener('tick', function() {
    stage.update();
  });


</script>

</body>
</html>