Customization of "stickyToolGroupButton"

Technical Support
1

Hi,
We are trying to customize stickyToolGroupButton’s annoation visual appearance . currently its like

image
image740×188 13.9 KB

but we want to achieve it like popup near that comment icon/mouse pointer.
We want to achieve visual appearance like any other annotation . lets say area tool. When we hover over area annotation then popup with details(area in sq m) near mouse pointer is shown.
Is it possible to do it with stickyToolGroupButton’s annotation? if yes could you please provide link/example for the same Or any other work around to achieve this type of behavior .

Thank you,
Vivek Sonawane

2

Hi,

You can use the setAnnotationContentOverlayHandler API to do this.

Here is an example:

Webviewer({...}, document.getElementById('viewer')).then(instance => {
  instance.setAnnotationContentOverlayHandler(annot => {
    const div = document.createElement('div');
    div.appendChild(document.createTextNode(`Created by: ${annot.Author}`));
    div.appendChild(document.createElement('br'));
    div.appendChild(document.createTextNode(`Created on ${annot.DateCreated}`));
    return div;
  })
});

Thanks,
Logan