function initCircleLoop() {

  circleLayer = new Array();

  if(n4) { 
    circleLayer[0] = 1 //각 레이어들의 이동 간격시간
    circleLayer[1] = new circleLoopSet(document.D1, 5, 200, 50, 200, 100, 2, 1)
    circleLayer[2] = new circleLoopSet(document.D2, 5, 200, 50, 200, 100, 2, 2)
    circleLayer[3] = new circleLoopSet(document.D3, 5, 200, 50, 200, 300, 2, 1)
    circleLayer[4] = new circleLoopSet(document.D4, 5, 200, 50, 200, 300, 2, 2)
  }
  else if(e4) {
    circleLayer[0] = 1 //각 레이어들의 이동 간격시간
    circleLayer[1] = new circleLoopSet(document.all.D1.style, 5, 200, 50, 200, 100, 2, 1)
    circleLayer[2] = new circleLoopSet(document.all.D2.style, 5, 200, 50, 200, 100, 2, 2)
    circleLayer[3] = new circleLoopSet(document.all.D3.style, 5, 200, 50, 200, 300, 2, 1)
    circleLayer[4] = new circleLoopSet(document.all.D4.style, 5, 200, 50, 200, 300, 2, 2)
  }
}
시작

굵은 글자들이 바꾸어준 내용입니다. 중심점을 두개의 레이어 D3, D4 에게 D1, D2보다 200px 아래에 위치하게 300을 지정하고 두개의 원형으로 보이게 totalLayer에게 2를 지정했습니다. 여러 레이어 중에서 중심점을 다르게 지정하고 다른 중심점을 사용하는 레이어들을 갯수에 맞게 위의 식으로 바꾸어 줍니다. 

  circleLayer = new Array();
  circleLayer[1] = new Array();
  circleLayer[2] = new Array();

  circleLayer[1][1] = new circleLoopSet(...)
  circleLayer[1][2] = new circleLoopSet(...)

  circleLayer[2][1] = new circleLoopSet(...)
  circleLayer[2][2] = new circleLoopSet(...)
위의 식으로 2차 배열로 만들어도 됩니다. 그러면 각 일차배열에 따라 각기 레이어를 지정할 수 있습니다. 처음에 중심점을 다르게 배치하는 이 페이지의 예제를 만들면서 위의 이차 배열을 사용했습니다. 약간의 장점이 있지만, 맨 위의 일차배열로 갯수에 따른 숫자를 지정해 주면 중심점을 다르게 두며 일정한 간격의 회전을 할 수 있습니다.

4,1은 원에서 90도의 각도로 레이어를 배치하는 것이고 2,1은 180도의 각도로 배치하는 것입니다. 즉, 원형으로 이동시킬때 가장 보기 좋게 배치를 하는것입니다. 특별히 각도를 조정할 필요가 있다면 이 두개의 인자를 맞게 지정해 주면 됩니다.

BACK