Document 3D, Model 3D and Model Data 3D.
Document 3D
A Document 3D extend Cx.Document with 3D helpers. Given an id in the server of a Document 3D the load function is the same as with normal documents:
Cx.Document.load$(id) .then(function(doc){ // doc is of type Cx3D.Document
Properties | Type | Def | Definition |
---|---|---|---|
model3D |
String | null | Server Id of associated Model 3D |
modelData3D |
String | null | Server Id of associated Model Data 3D |
The 3D document overwrites the document add function. It can trigger an active layer change so islands don’t get mixed with the design.
doc.add(figures);
Helper methods to work with islands and design layers
doc.islandsLayer(); // return active page islands layerdoc.designLayers(); // return active page design layers
doc.islandsLayer(page); // return page islands layerdoc.designLayers(page); // return page design layers
doc.isTextureIsland(figure);
Texture islands with the same name across all pages should share the same brush to keep the system consistent. Use the following function when changing the brush of a texture island:
doc.textureIslandBrush(figure,brush);
One possible flow for a multi size 3D application is to ask the user to design one size to create a template that will be copied over all other sizes. The following function implements a scaled or non scaled copy, it is expected that the arrangements in both documents are similar.
doc.copyDesignTo$(doc,{scaled:false}) .then( ...
Model 3D
Given a Document 3D, the associated model can be accesed with:
doc.loadModel3D$() .then(function(model) { ...
In case of having the server id of the Model, or the Xml representation:
Cx3D.Model.load$(id) .then(function(model){ ...
var model = Cx3D.Model.fromXml(xml);
var model = Cx3D.Model.fromXmlString(s);
Properties | Type | Def | Definition |
---|---|---|---|
modelData3D |
String | null | Server Id of associated Model Data 3D |
An empty working space document associated with this model can be created with:
model.createDocument3D$() .then(function(doc3D){ ...
A new arrangement containing all islands in their original position can be create with:
var page = model.createCustomPage(name);
Model Data 3D
Given a Model 3D, the associated model data can be loaded with:
model.loadModelData3D$() .then(function(modelData){ ...
Or using its server id:
Cx3D.ModelData.load$(id) .then(function(modelData){ ...
Properties | Type | Def | Definition |
---|---|---|---|
data |
json | null |
3D polygonal data |
id |
String | null |
Server Id |
Production Texture
var texture = Cx3D.ProductionTexture({ renderTo: domId });
Properties | Type | Def | Definition |
---|---|---|---|
document |
Document 3D | null |
Working space document |
model |
Model 3D | null |
Model 3D |
dpi |
Number | 2 * 25.4 |
Resolution |
showSelectedFigures |
Boolean | true |
Show selection in 3D |
texture.watch(canvas);
texture.dispose();texture.updateSize();
Model View
var mv = Cx3D.ModelView({ renderTo: domId });
Properties | Type | Def | Definition |
---|---|---|---|
backgroundColor |
Color | Gray | Background color, null for transparency |
autoRotate |
Boolean | false |
Auto rotate model |
loadingAnimationMessage |
String | 'Loading 3D Model' |
Message |
mv.modelData(modelData);
mv.watch(texture);
mv.dispose();mv.image();mv.updateSize();
mv.zoomToFront();mv.zoomToBack();mv.zoomToRight();mv.zoomToLeft();
mv.zoomIn(scale);mv.zoomOut(scale);
mv.rotateCameraRight(angle);mv.rotateCameraLeft(angle);mv.rotateCameraDown(angle);mv.rotateCameraUp(angle);
mv.rotateModelRight(angle);mv.rotateModelLeft(angle);mv.rotateModelDown(angle);mv.rotateModelUp(angle);
Thumbail image
Cx3D.thumbnailImage$(config);
3D Preview
var preview = Cx3D.createPreview(domId,docId);