p5.Camera setPosition() 方法


p5.Camera setPosition() 方法

p5.js 中 p5.Camera 的setPosition() 方法用于将相机的位置设置到世界空间中的给定点。它在更改位置时保持当前相机方向。

句法:

setPosition( x, y, z )

参数:此方法接受三个参数,如上所述,如下所述:

  • x:它是一个数字,表示该点在世界空间中的 x 位置。
  • y:它是一个数字,表示该点在世界空间中的 y 位置。
  • z:它是一个数字,表示该点在世界空间中的 z 位置。

下面的示例说明了 p5.js 中的setPosition() 方法

例子:

Javascript
let currCamera;
  
function setup() {
  createCanvas(500, 500, WEBGL);
  helpText = createP(
    "Move the sliders to change the " +
    "position of the camera"
  );
  helpText.position(20, 0);
  
  // Create the camera
  currCamera = createCamera();
  
  // Create three sliders for changing the
  // position of the camera
  xPosSlider = createSlider(-360, 360, 0);
  xPosSlider.position(20, 40);
  
  yPosSlider = createSlider(-360, 360, 0);
  yPosSlider.position(20, 70);
  
  zPosSlider = createSlider(0, 800, 600);
  zPosSlider.position(20, 100);
}
  
function draw() {
  clear();
  lights();
  normalMaterial();
  debugMode();
  
  // Get the x, y, z values from the
  // sliders
  let currX = xPosSlider.value();
  let currY = yPosSlider.value();
  let currZ = zPosSlider.value();
  
  // Set the position of the camera
  // to these points in the world space
  currCamera.setPosition(currX, currY, currZ);
  
  cylinder(90);
}


输出:

在线编辑器: https://editor.p5js.org/

环境设置: https://www.geeksforgeeks.org/p5-js-soundfile-object-installation-and-methods/

参考: https://p5js.org/reference/#/p5.Camera/setPosition


Made with ❤️ in Chengdu. Copyright reserved 2019-2023.

蜀ICP备20006366号-1