📜  p5.js |模型()函数

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

p5.js |模型()函数

model()函数用于将 3D 模型渲染到屏幕上。必须首先使用loadModel()函数加载要渲染的模型。

句法:

model( model )

参数:该函数接受一个如上所述和如下所述的参数。

  • model:它是 p5.Geometry 对象,它指定必须渲染到屏幕上的模型。

下面的程序说明了 p5.js 中的model()函数:

例子:

let ballObj, cubeObj, coneObj;
let currentObj;
let newFont;
  
// Load all the models in preload()
function preload() {
  newFont = loadFont("fonts/Montserrat.otf");
  ballObj = loadModel("models/ball.obj", true);
  cubeObj = loadModel("models/cube.obj", true);
  coneObj = loadModel("models/cone.obj", true);
  currentObj = ballObj;
}
  
function setup() {
  createCanvas(400, 300, WEBGL);
  
  textFont(newFont, 14);
  
  modelSelector = createSelect();
  modelSelector.position(30, 40);
  modelSelector.option("ball");
  modelSelector.option("cube");
  modelSelector.option("cone");
  modelSelector.changed(modelChanged);
}
  
// Function to change the model depending
// on the selected dropdown 
function modelChanged() {
  let selected = modelSelector.value();
  console.log(selected);
  switch (selected) {
    case "ball":
      currentObj = ballObj;
      break;
    case "cube":
      currentObj = cubeObj;
      break;
    case "cone":
      currentObj = coneObj;
      break;
    default:
      break;
  }
}
  
function draw() {
  background("green");
  text("Use the dropdown to select the model to display", -185, -125);
  scale(0.75);
  lights();
  rotateX(frameCount * 0.05);
  rotateY(frameCount * 0.05);
  noStroke();
  
  // Load the given model
  model(currentObj);
}

输出:

模型选择器

参考: https://p5js.org/reference/#/p5/model