📜  p5.js | setCamera()函数

📅  最后修改于: 2022-05-13 01:56:33.018000             🧑  作者: Mango

p5.js | setCamera()函数

p5.js 中的setCamera()函数用于将渲染器的当前相机设置为给定的 p5.Camera 对象。这可用于切换到多个摄像机。

句法:

setCamera( cam )

参数:此函数接受如上所述和如下所述的单个参数:

  • cam:它是一个 p5.Camera 对象,该函数会将相机更改为。

下面的示例说明了 p5.js 中的setCamera()函数
例子:

javascript
let cameras = [];
let currCameraIndex = 0;
  
function setup() {
  createCanvas(600, 400, WEBGL);
  helpText = createP(
    "Click on the buttons to switch to the"+
    " next camera of the sketch"
  );
  helpText.position(20, 0);
  
  // Button to switch to the next camera
  // in the scene
  newCameraBtn = createButton("Switch to Next Camera");
  newCameraBtn.position(20, 40);
  newCameraBtn.mouseClicked(switchActiveCamera);
  
  // Create 5 cameras and store into array
  for (let i = 0; i < 5; i++) {
    cameras[i] = createCamera();
  
    // Randomly set the position the camera
    // is looking at using setPosition()
    randomX = floor(random(-100, 100));
    randomY = floor(random(-100, 100));
  
    cameras[i].setPosition(randomX, randomY, 350);
  }
}
  
function switchActiveCamera() {
  // Increment the camera index
  if (currCameraIndex < 4) currCameraIndex += 1;
  else currCameraIndex = 0;
  
  // Set the camera from the camera array
  // to that index
  setCamera(cameras[currCameraIndex]);
}
  
function draw() {
  clear();
  orbitControl();
  normalMaterial();
  
  // Create three boxes at three positions
  translate(-150, 0);
  box(65);
  translate(150, 0);
  box(65);
  translate(150, 0);
  box(65);
}


输出:

设置相机开关

在线编辑器: https://editor.p5js.org/
环境设置: https://www.geeksforgeeks.org/p5-js-soundfile-object-installation-and-methods/
参考: https://p5js.org/reference/#/p5/setCamera