[0115资资]扩展p5.js中的arc接口

1 加载弧

1.1效果展示

1.2 调用方法

1.2.1 函数参数介绍

/********************************
加载Arc
1. (x,y)是加载圆弧的中心位置
2. total_arcs是加载圆弧的条数
*********************************/

function loading_arc(x,y,total_arcs)

1.2.2 函数案例（demo）

let t = 0;
function setup() 
{
  createCanvas(400, 400);
  hw = width / 2;
  hh = height / 2;
  stroke(255);
  strokeWeight(8);
  noFill();
}

function draw() 
{
    loading_arc(width / 2,height / 2,1);
}

1.3 作图

let t = 0;

function setup() {
  createCanvas(400, 400);
  hw = width / 2;
  hh = height / 2;
  stroke(255);
  strokeWeight(8);
  noFill();
}

function draw() 
{
    loading_arc(width / 2,height / 2,4);
}

2 旋转的弧线

2.1效果展示

2.1.1 单色的旋转弧线

• Nums = 50,中心位置在(200,200)
  

• Nums = 20,中心位置在(width/2,height/2)
  

2.1.2 颜色改变的旋转弧线

2.2 调用方法

2.2.1 函数参数介绍

• 单色圆案例

/************************************
运动的弧线(单色)
1.（x,y）代表弧线中心的位置
2. Nums是圆圈的数目
*************************************/

function RotateArc(x,y,Nums)

• 调用noise函数的颜色渐变圆

/************************************
运动的弧线(颜色改变)
1.（x,y）代表弧线中心的位置
2. Nums是圆圈的数目
*************************************/

function RotateArcChangeColor(x,y,Nums)

2.2.2 函数案例（demo）

• 单色圆案例

function setup() 
{
	createCanvas(windowWidth, windowHeight);
	frameRate(22);
	a = new RotateArc(width/2,height/2,20);
	a.GenerateNums();
}

function draw() 
{
	background(33);
	a.draw();
	noFill();
}

• 调用noise函数的颜色渐变圆

function setup() 
{
	createCanvas(windowWidth, windowHeight);
	frameRate(22);
	a = new RotateArcChangeColor(width/2,height/2,20);
	a.GenerateNums();
}

function draw() 
{
	background(255);
	a.draw();

}