배열의 색상을 p5.js/Javascript의 객체에 할당

Question

내 6 개의 Orb 객체 각각에 내 c [] 색상 배열의 각 색상을 지정하려고합니다. 내 루프는 모든 오브젝트에 모든 색상을 할당합니다. 어떤 도움이라도 대단히 감사합니다.

var orb = []; 
var c = ["#C460E0", 
     "#F469A9", 
     "#69F5E7", 
     "#687DF2", 
     "#69F591",    
     "#F1Ea67"]; 
var col; 
var num; 

function setup() { 
    createCanvas(600, 600); 
    for (var i = 0; i < 6; i++) 
     orb[i] = new SoftOrb(); 
} 

function draw() { 
    background(1); 
    for (var i = 0; i < orb.length; i++) { 

     orb[i].colour(); // <-----???! 
     orb[i].edges(); 
     orb[i].display(); 
     orb[i].move(); 
    } 
} 

function SoftOrb() { 
    this.loc = createVector(random(width), random(height)); 
    this.vel = createVector(0, 0); 

    this.col = col; 
    this.display = function() { 
     ellipse(this.loc.x, this.loc.y, 100, 100); 
    } 
    this.colour = function() { 
     noStroke(); 
     for (var j = 0; j < c.length; j++) { 
      var index = c.indexOf(j); 
      fill(c[j]); 
     } 

Answer 1

1 단계 : 당신의 구문을 수정합니다. 코드 끝 부분에 중괄호를 넣지 않았습니다. 바라기를 이것은 복사 - 붙여 넣기 오류 일뿐입니다. 그러나 당신이 대답하기가 더 어려워지기 때문에 조심하십시오!

2 단계 :c 배열의 색상을 SoftOrb 생성자로 전달해야합니다. 즉 다음과 같습니다

function setup() { 
    createCanvas(600, 600); 
    for (var i = 0; i < 6; i++) { 
    orb[i] = new SoftOrb(c[i]); 
    } 
} 

3 단계 : 당신은 실제로 색 인수를 허용하도록 SoftOrb 생성자를 수정해야합니다. 이미 this.col = col;의 할당을하고있는

function SoftOrb(col) { 

는 이제 col은 특정 SoftOrb에 대한 특정 색상입니다.

4 단계 : 이제 색상을 설정하려면 col을 사용해야합니다. 그냥 display() 함수로이 이동할 수 있지만, 그 무엇보다 개인적인 취향의

this.colour = function() { 
    noStroke(); 
    fill(col); 
    } 

참고.

5 단계 : 수정 한 후에는 edges() 및 move() 기능이 없기 때문에 오류가 발생합니다. 다음 작업을 코딩하려고 시도하기 전에 색상이 작동하는지 테스트 해보십시오.