3D Model

With this element, you’are able to include 3D Models to your website with ease.

3D Model

Settings

You can configure the following settings for this element:

3D Model

  • 3D Model - The 3D Model file(s). Must be in .gltf format. You can upload the .gltf file itself or a .zip file containing the .gltf file and its dependencies (.bin, .png, etc.). If you upload a .zip file, make sure that the .gltf file is in the root of the .zip file.
  • Scale X - The scale of the model on the X axis.
  • Scale Y - The scale of the model on the Y axis.
  • Scale Z - The scale of the model on the Z axis.
  • Position X - The position of the model on the X axis.
  • Position Y - The position of the model on the Y axis.
  • Position Z - The position of the model on the Z axis.
  • Rotation X - The rotation of the model on the X axis.
  • Rotation Y - The rotation of the model on the Y axis.
  • Rotation Z - The rotation of the model on the Z axis.
  • Allow Animation - Whether or not to allow animation of the model.

Canvas

  • Canvas Width - The width of the canvas.
  • Canvas Height - The height of the canvas.

Camera

  • Vertical Field of View - The vertical field of view of the camera. This is the angle between the top and bottom planes of the camera’s view frustum.
  • Near Clipping Plane - The distance to the near clipping plane of the camera’s view frustum. Objects closer than this will not be rendered.
  • Far Clipping Plane - The distance to the far clipping plane of the camera’s view frustum. Objects further than this will not be rendered.
  • Position X - The position of the camera on the X axis.
  • Position Y - The position of the camera on the Y axis.
  • Position Z - The position of the camera on the Z axis.

Light

You can add up lights to the scene. The following lights are available:

  • Ambient - A light that affects all objects in the scene equally. This light cannot be repositioned.
  • Directional - A light that is infinitely far away and has a direction but no position. This light cannot be repositioned.
  • Hemisphere - A light that is positioned infinitely far away and has a direction but no position. This light cannot be repositioned.
  • Point - A light that illuminates from a specific point in all directions. This light can be repositioned.
  • RectArea - A light that illuminates from a specific rectangle in all directions. This light can be repositioned.
  • Spot - A light that illuminates from a specific point in one direction. This light can be repositioned.

Each light has the following settings:

  • Type - The type of the light.
  • Color - The color of the light.
  • Intensity - The intensity of the light.
  • Cast Shadow - Whether or not the light casts shadows.
  • Position X - The position of the light on the X axis.
  • Position Y - The position of the light on the Y axis.
  • Position Z - The position of the light on the Z axis.
  • Ground Color - The color of the ground. This is only used by the Hemisphere light.
  • Width - The width of the light. This is only used by the RectArea light.
  • Height - The height of the light. This is only used by the RectArea light.
  • Angle - The angle of the light. This is only used by the Spot light.
  • Penumbra - The penumbra of the light. This is only used by the Spot light.

Interaction

  • Enable Interaction - Whether or not to enable interaction with the model.
  • Enable Zoom - Whether or not to enable zooming.
  • Enable Pan - Whether or not to enable panning.
  • Enable Rotate - Whether or not to enable rotating.
  • Min Distance - The minimum distance to the model when zooming.
  • Max Distance - The maximum distance to the model when zooming.
  • Prevent Bottom View - Whether or not to prevent the user from viewing the model from the bottom.
  • Prevent Top View - Whether or not to prevent the user from viewing the model from the top.
  • Rotate Speed - The speed of rotating.
  • Zoom Speed - The speed of zooming.
  • Pan Speed - The speed of panning.

Animation

  • Enable Animation - Whether or not to enable animation of the model.
  • Animation Type - The type of animation. This can be either Rotate Left, Rotate Right, Rotate Up, Rotate Down.
  • Animation Speed - The speed of the animation.

Renderer

  • Anti Aliasing - If you enable this, the edges of the model will be smoother. This will however decrease the performance.

FAQ

Which formats are supported?

Currently, only the .gltf format is supported. This format is supported by most 3D modeling software and is the recommended format for 3D models which are used on the web. You can upload the .gltf file itself or a .zip file containing the .gltf file and its dependencies (.bin, .png, etc.). If you upload a .zip file, make sure that the .gltf file is in the root of the .zip file.

From where can I get 3D models?

There are many websites where you can download 3D models. Some of them are:

Can we animate the model with the Bricksforge Panel?

Not yet. But we’re working on it.