Rendering
You can modify and transform 2D and 3D content (such as models, images, and interface elements) using the JavaScript API or
custom shaders. To manipulate this content, use the
tml3dRenderer object. For example, if your model includes multiple parts, each part is represented as a
Model Item that you can access and modify individually.
To set the position of a model item, use the following JavaScript:
tml3dRenderer.setTranslation('areaPreview',$scope.app.params.target.pos.x, $scope.app.params.target.pos.y,$scope.app.params.target.pos.z);
Other useful API includes:
• setTranslation()—Sets the position (x, y, z) of models, model items, 3D images, and tracker nodes. Tracker nodes are the root of a trackable coordinate system, with targets and content as children.
• setRotation()—Sets the rotation (x, y, z) for models, model items, 3D images, and tracker nodes.
• setScale()—Sets the scale of models, model items, 3D images, and tracker nodes.
• setProperties()—Sets rendering properties for a 3D element.
• add3DObject()— Adds a 3D object using data from an external source. Use this to load additional 3D content at runtime.
• setTexture()—Applies a texture to an element. The source can be a URL or a base64-encoded string.
• setColor()—Sets the color of a model item by its ID.
For more information about related JavaScript functions, see
Low-level 3D Rendering Functions.