---

Custom Annotations

By default, annotations are displayed on a scene with a + icon. When hovered over (or clicked/tapped) a tooltip will appear with the annotation text.

However, this default behavior can be overridden by passing a showAnnotations function into the intiialization options for the interactive embed.

$('#my-clara-scene').clara({
  id: 'uuid',
  showAnnotations: function(annotations) {
    annotations.forEach(function(annotation) {
      console.log('Annotation: ', annotation.text, annotation.alpha);
    });
  }
});

Each time the viewport gets updated (as the camera moves, for example), this function will be called. Since this may occur many times per second, this function should be fast.

An array of objects will be passed to the function, where each object will contain all of the information relevant to displaying the annotation:

• text: Annotation text (Either the node name, or custom text as specified).
• visible: Is this annotation visible (If limit visibility is checked)
• alpha: The opacity of the annotation, changes as it moves out of view.
• top,bottom,left,right: The number of pixels from top, bottom, left and right, respectively.

There are other attributes available for more advanced cases:

• normal: The normal Vector3.
• position: The position Vector3
• node: The clara scene node. (Full annotation attributes are available here at node.annotation.

---