Tessellation

Introduction

Tessellation describes the representation of a surface using polygons. In most cases, also in buerli, triangles represent the surface. The more triangles we use for tessellation, the more accurate representation we will get. The downside of a good-looking appearance is a higher need for system resources. Depending on the application we want to build, the priorities can be different. There might be applications where appearance is less important, but high performance is needed. For those different cases, it's possible to control parameters in buerli to have an impact on tessellation. The following picture shows a simple box and a simple cylinder. Both of them use the same parameters but have totally different number of triangles.

Simple examples of tessellation.

📝 Note: The description of tessellation within this page relates to meshes and nurbs curves. Arcs and circles will be tessellated by the client and cannot be controlled by the parameters described in the next chapter Parameters.

The following example shows the difference of nurbs curves and others like arcs or circles. The tessellation parameters we use to control the mesh also have an impact on nurbs curves. The nurbs curves marked with the red arrows are very low tessellated by parameters, and thus the appearance isn't of high quality. The arcs and the circle aren't affected as they were tessellated on the client.

NURBS curves and mesh with server-side tessellation. Arcs and circle with client-side tessellation.

Parameters

In general, we provide two parameters to control tessellation.

Chord Height Tolerance

This parameter defines the maximum distance between the original design's surface and the tessellated mesh. This value is an absolute distance value, which means that the appearance of the same model in different sizes will look different. By default, we use a value of 0.1. Let's have a look at a cylinder with different parameters.

Different Chord Height Tolerance on the same cylinder. (0.01, 0.1, 1)

As you can see, the number of triangles used for tessellation increases drastically if chord height tolerance is getting smaller. In the following picture, we can see the distance between the original design and the tessellated mesh. The smaller we set the tolerance, the closer the triangles come to the original surface.

Red arrow shows distance between original surface and tessellated mesh.

Angle Tolerance

This parameter defines the maximum angle between the normal vectors of each triangle. The value is an absolute angle in degrees. By default, we use a value of 0°. We don't need to define this angle value as long as we have a suitable value for chord height tolerance. Let's have a look at cylinders with different angle tolerances, too.

Different Angle Tolerance on the same cylinder. (5°, 10°, 15°)

As expected, we also have different numbers of triangles. This parameter is very helpful if we have multiple holes in different sizes. If we only set chord height tolerance, we would get holes of various appearance qualities. With the angle tolerance, we can define a maximum angle between two triangles , and it will have an impact even on very small holes. Let's see in the following picture.

Angle between red arrows (normals of surface) shows the angle to control.

The picture shows that cylinders with different sizes can appear ugly with a low chord height tolerance (tol = 2) and no angle tolerance (tol = 0) set. The small cylinder isn't longer a cylinder if we just rate it by its mesh. It's a cube and the angle of its neighbor triangles are 90°. With the angle tolerance we can exactly define the maximum angle between the triangles.

Usage

On whole application

As already mentioned in the topic before, we use default values for angle (0) and chord height tolerance (0.1). These values are very common and in most cases a good balance between a good appearance and performance. If these values don't fit your application, it is possible to change them. In this case, we can add the following code to init() method exported from buerli.io/classcad.

init(id => {

const socket = new SocketIOClient(CCSERVERURL, id)

const initSettings = async () => {

// Init settings will be called after new drawing has been connected. This happens after new Part/Assembly or loading a model.

// This mechanism allows the application (client) to individually override settings on the internal classcad database,

// which have been initially made by the server.

await ccAPI.common.setDatabaseSettings(id, {

facetingChordHeightTol: 0.5, // default server: 0.1

facetingAngleTol: 0 // default server: 0

})

}

socket.on('connected', initSettings)

return socket

}, { ...

Each time a new drawing has been connected to the server, when you create a new Part, Assembly, or load a new model, the settings will be overwritten on the server by the values set in the initSettings() method. In this case, the chord height tolerance will be set to 0.5. See also initBuerli() in our buerligons application.

On specific entities

In our buerligons application we can control these parameters within the Appearance Editor. This editor can be opened by right-clicking the solid in the view or in the left lower area where the solids are listed. Besides tessellation settings, we are also able to change the color and transparency of the solid. We can define for each solid different settings. This is useful if we have different-sized solids.

Appearance editor to control tessellation parameters.

We recommend designing the parts with default settings. If the model has its final design, we can change the appearance by setting color, transparency and the optimized tessellation parameters on the final solids.