Skip to content
Related Articles

Related Articles

p5.js | model() Function

View Discussion
Improve Article
Save Article
Like Article
  • Last Updated : 25 May, 2020

The model() function is used to render a 3D model to the screen. The model to be rendered has to be loaded first using the loadModel() function.


model( model )

Parameters: This function accepts one parameter as mentioned above and described below.

  • model: It is the p5.Geometry object that specifies the model that has to be rendered to the screen.

The program below illustrate the model() function in p5.js:


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);
// Function to change the model depending
// on the selected dropdown 
function modelChanged() {
  let selected = modelSelector.value();
  switch (selected) {
    case "ball":
      currentObj = ballObj;
    case "cube":
      currentObj = cubeObj;
    case "cone":
      currentObj = coneObj;
function draw() {
  text("Use the dropdown to select the model to display", -185, -125);
  rotateX(frameCount * 0.05);
  rotateY(frameCount * 0.05);
  // Load the given model




My Personal Notes arrow_drop_up
Recommended Articles
Page :

Start Your Coding Journey Now!