How to add selection point to annotations?

Technical Support
1

I want to add selection point in AnnotationCreatePerimeterMeasurement and AnnotationCreateAreaMeasurement. As pointed in below figure, I want to add further more selection points.

image

2

Hi there!

To do this you need to create a custom SelectionModel, and then assign it to the annotation.

There is a sample repo here which contains some examples, specifically this one.

This guide also has some information on creating custom selection models.

Thanks,
Logan

3

Hi Logan,
I have gone through the documentation. But it seems it doesn’t properly explain my needs.
We are using angular 9, typescript. However I did something here. Let me know further steps:

private getController(annotation: any) {
    let x = annotation.X;
    let y = annotation.Y;
 
    const width = annotation.Width;
    const height = annotation.Height;

    x -= width * 0.5;
    y -= height * 0.5;
    return new this.viewerInstance.Annotations.Rect(x, y, x + width, y + height);
  }

on annotationSelection:

this.viewerInstance.annotManager.on(AnnotationManagerConstants.ANNOTATION_SELECTED, (annotations, action) => {
        if (action === 'selected') {
          const model= new this.viewerInstance.Annotations.SelectionModel(annotations[0], true, true, docViewer);
          const test2 = this.getControlHandler(annotations[0]);
          let test3 = new this.viewerInstance.Annotations.ControlHandle(test2.x1,test2.x2,test2.y1,test2.y2);

Also how to get vertices of annotation.
Annotation.vertices[this.index].x
I am getting vertices as undefined.

Here I had passed the selected annotation.
Let me know what to do next? Or is this correct way

Regards
Kiran

4

Hi Logan,

Please guide us further with this point as it is still in our development backlog. We need to provide this very important feature.

How to do this?

Thanks and Regards,
Kiran

5

Hi,

Can you explain where you want the additional selection points?

6

Hi,

I want to add additional selection points to a selected annotations. So I can edit an annotation with more accuracy. Edit points means more edit point to modify annotations as per the need.

Suppose I have one area annotation of 4 points, now I want to have further more points in that area say 6 points available for edit so to bend that annotation as per the requirement. So what I will do is select that annotation and click on the edges of the annotation where I want to add extra point.

How to do this?

7

Hey there,

This is a very complex problem to solve that unfortunately falls outside the scope of support that I can provide here.

I can, however, try to lead you in the right direction.

What you’ll have to do is detect a double click event on the annotation. When a double click is detected, you’ll want to get the points for that annotation using the getPath API. You’ll then have to find what path they clicked on, and then “break it in half” at the point where they clicked. So essentially you need to take a path, and just split it where they clicked.

image
image963×676 65.3 KB

Good luck!
Logan