Type alias Icon3DStyle

An Icon3DStyle describes how a 3D icon is painted in a 2D and a 3D view.

The key parts of an Icon3DStyle are:

• A 3D mesh, such as a plane, a building, and so on
• A set of transformation parameters to align the 3D mesh in its own local origin: scale, rotation, and translation
• Transformation parameters to align the 3D mesh in the world: orientation

You can define a mesh with a mesh JavaScript object, or with a URL to a file that contains mesh data, such as a GLTF file. By default, the following assumptions are made about the 3D mesh in LuciadRIA:

• The Y-axis points forward: the part of the mesh that is considered the front is pointing in the positive Y-direction
• The X-axis points right: the right side of the mesh is facing the positive X-direction
• The Z-axis points up: the top of the mesh is facing the positive Z-direction
• The mesh is defined in meters
• The anchor point or center point of the mesh is at the XYZ-location (0,0,0)

If any of the above does not hold true for your mesh, you can use the scale, rotation and translation parameters to make sure that the mesh is aligned to accommodate the list above.

Example: you have a 3D aircraft mesh. The aircraft is defined in millimeters, and it points to the halfway point between the X and Y direction.

Aircraft mesh

If you want to align this mesh with our assumptions, you must scale by a factor of 1/1000, and rotate by 45 degrees about the Z-axis:

   var icon3DStyle = {
     meshUrl: "aircraft.gltf",
     rotation:{
       z: 45
     },
     scale:{
       x: 1/1000,
       y: 1/1000,
       z: 1/1000
     }
   };
Copy

This results in:

Aligned mesh

Once you have your mesh correctly aligned in its own local reference using rotation, scale and translation, you are ready to orient the 3D mesh in the world.

By default, the position of the mesh is parallel to the surface of the ellipsoid. The Y-direction points towards the north and the X-direction points towards the east.

Note that since LuciadRIA 2023.1 GenericIcon3DStyle.legacyAxis was introduced. When this flag is set to true the 3D icons will still be rendered with the legacy axis system, where the X-axis points to the north and the Y-axis to the west. From the LuciadRIA 2024.0 release onwards, the default value of the legacy axis will be false. It is recommended to already set this to false.

Default orientation

Note: when the mesh is visualized on a map with a cartesian world reference, the forward axis of the mesh points in the direction of the Y-axis of the cartesian coordinate system.

You can change the heading, pitch and roll of the mesh by adjusting the orientation.

Example: you want your aircraft to point to the east. You must make sure that its heading is 90 degrees, measured clockwise from the north.

   var icon3DStyle = {
     meshUrl: "aircraft.gltf",
     ...
     orientation: {
       heading: 90 //make aircraft point to the east, or 90 degree azimuth.
     }
   };
Copy

This orientation results in:

Heading to the east

In addition to heading, an orientation object allows you to specify pitch and roll. See below for the effect of those parameters on the aircraft.

Heading and pitch		Heading, pitch and roll

Note that orientation.heading is analogous to IconStyle.heading, but for 3D meshes.

Since

2016.1