First 3D Scene

Introduction #

SmartChart Pro supports embedding 3D model scenes in dashboards, loading OBJ, STL, GLTF format 3D model files, with ambient light adjustment, point light sources, rotation animation, and mouse interaction (click response, texture mapping, etc.). Suitable for factory digital twins, equipment display, and other 3D visualization scenarios.


Create Dashboard #

  • In development mode, navigate to “Dev Management” -> “Dashboards” -> “Add Dashboard”
  • Fill in the information and click “Save”
  • Click to enter dashboard development, click the right-side action menu to edit

Upload Model Files #

  • In the template development interface, click “Tools” -> “Resource Management” and upload your model files. Supports “obj, stl, gltf” formats
  • After uploading, in My Resources, click the file name to auto-copy the resource link

Scene Development #

  • Create a new drag chart, select 3D Model from basic charts

  • Click save to see the 3D scene. The model may be too large or too small, you can adjust camera depth

  • You can generate via AI or create new, configure 3D models and animation effects

Screenshot

Click Response #

//ctx contains: name (original name), alias, index, config, object, intersect, event
threeDict.actionFun = (ctx)=>{
    console.log('Clicked:', ctx.alias)
};