Question

我有一些存储在数组中的十六进制值。我使用数组索引以弧度增加角度并在圆圈中显示一系列椭圆显示一系列椭圆。难以解释，但我有一个pen。问题是，当我使用for循环时，我不确定如何使用索引为椭圆着色。

const colors = ['#b1ede8','#db9a78','#eed4ad','#a989b2']

function setup(){
  createCanvas(windowWidth,windowHeight)
}

function draw(){
background(255,100,100)
 translate(width/2,height/2)
  noStroke();
  prizes(colors,200)
}

function windowResized(){
  resizeCanvas(windowWidth,windowHeight)
}

function prizes(data,radius){

for(i = 0 ; i < TWO_PI ; i+=TWO_PI/data.length)
{
  let x = radius * cos(i);
  let y = radius * sin(i);

我现在是弧度的浮动值，填充代码不起作用。

  fill(colors[i])
  ellipse(x,y,20)
  }
}

提前致谢

Answer 1

＆＃13;

const colors = ['#b1ede8','#db9a78','#eed4ad','#a989b2']

function setup(){
  createCanvas(windowWidth,windowHeight)
}

function draw(){
background(255,100,100)
 translate(width/2,height/2)
  noStroke();
  prizes(colors,200)
}

function windowResized(){
  resizeCanvas(windowWidth,windowHeight)
}

function prizes(data,radius){
 
var j = 0;
  
for(i = 0 ; i < TWO_PI ; i+=TWO_PI/data.length)
{
  let x = radius * cos(i);
  let y = radius * sin(i);
   
  fill(data[j])
  ellipse(x,y,20)
  j++;
  }
}

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.16/p5.js"></script>

＆＃13;

我想我发现了这个问题。您使用i来获取颜色值。但是你不能将i增加1.所以你将获得无效数字。我创建了一个新的变量j来索引颜色。这是你要找的结果吗？

使用弧度并迭代十六进制颜色值数组

1 个答案: