<< Click to Display Table of Contents >> Navigation: Components > 3D viewer |
3D viewer can display 3D models using three.js library. Model can be defined from JS code or in Delphi code using JSON.
Component has two scripts - client (JS) script and server (Pascal) script. Client script can call server script methods to obtain model data.
JSON format is the following:
{
"objects": [
{"type:: "box", "x": 0, y: "0", "z":0, "dx":1, "dy":1, dz: 1, "material": "base"}
]
}
Component designer has the following pages:
Options - component name, CSS class, background color, camera position
Lights - scene lights
Materials - geometries materials
Client - client script
Server - server script
Animation - animation script
•box: dx, dy, dz
•capsule: radius, length
•circle: o.radius
•cone: radius, height
•cylinder:radiustop, radiusbottom, height
•sphere:o.radius
Common parameters are:
x, y, z - position
destx, desty, destz - destination position (object will be animated).
material - surface material defined in Materials tab.
Define scene light sources, its type, color, intensity and position.
Define geometries materials. Materials can have texture loaded from file.
Materials are stored in scene.materials objects by its name, f.e. scene.materials.wood
In a client script you can access
scene: 3d scene
THREE - three.js namespace
Server - server object for calling server script methods
AsyncServer - server object for asynchronous calling server script methods. Last method parameter should be callback function.
To import scene objects from JSON call scene.importJSON(json_string);
Client script example:
scene.importJSON(Server.sceneObjects());