Is there a way to be able to resize the Annotorious labels not just at the corners but also by clicking on the sides ?

[Vidyadayini]

I am trying to resize anno labels by clicking on the sides as well as the corners. Kind of like a browser window. I would like to keep the draggable functionality when clicking on the middle though.

Is this possible using anno headless ? Please let me know.

Thanks.

[rsimon]

Sorry, that's not available as a feature right now I'm afraid. At the moment, you'd have to hack this into the EditableRect tool yourself if it's essential.

[vidya-talapady-percipient-ai]

We have opened a PR for the same. Please take a look when you get a chance.

#275

[rsimon]

I just took a look - this looks excellent, many thanks! I'll still have to find a bit of time to test it, but will merge right after that. (Probably on the weekend.)

[vidya-talapady-percipient-ai]

Do we now have the ability to resize at the corners as well as the edges with the right icons in V3 ?

[rsimon]

Yes, v3 does allow resizing on edges and corners. And the mouse icons are correctly set for all directions :-)

FWIW: although I'll still hold off with the formal 3.0.0-rc.1 release, the API is already pretty stable. You could give it a try if you want to. Either by building from source from the v3 branch, or simply running npm install @annotorious/annotorious. (There are separate packages for @annotorious/openseadragon, @annotorious/react and @annotorious/svelte. Caveat is that v3 has only headless mode, there is no default popup editor. (Will eventually come back, but as a separate package, since most people seemed to build their own popup anyway, or didn't use a popup at all.)

[vidya-talapady-percipient-ai]

I am only able to get the 3.x versions from @annotorious/annotorious and not from @recogito/annotorious.
Why does @recogito/annotorious not have the latest 3.x versions ? The recommended way of installing is @recogito/annotorious right ?
Looking at https://annotorious.dev/installation/. Looks like recogito/annotorious is not being supported anymore ?

Previously we could instatiate this way and use this for the other actions.

    this.annotorious = new Annotorious({
       ...
    });

If we replace new Annotorious with createImageAnnotator, will all the old way of doing things still work ?
Unfortunately I am seeing a lot of differences.
Previously we could pass in more props. Something like

    this.annotorious = new Annotorious(({
      image,
      disableEditor: ,
      allowEmpty:,
      readOnly,
      handleRadius,
      formatter,
      fragmentUnit,
    });

Is there a way we can do this using `createImageAnnotator`

[rsimon]

Hi,

that's right. Annotorious 3 is a complete rewrite which includes many breaking changes from v2.7. (It was driven by my own client projects, where requirements had been shifting. Hence the breaking changes, in favor of other priorities such as improved React integration, realtime-capable state management, a custom popup mechanism that actually works etc.) But v2.7 will stay around, for those who prefer the old feature set.

The main breaking difference is that v3 no longer provides a built-in editor popup. You now have to build one yourself. That seems like a backwards step at first glance. But the benefit is that you now have all the freedom to build things the way you want & need, without being held down by Annotorious' awkward and (during the past years...) completely broken "extension mechanism".

Please also note that in v3, support for images is incomplete. My own client projects are all built around OpenSeadragon currently.

Some notes specifically to your properties:

• disableEditor no longer applies, since v3 is "headless-only", and doesn't come with an editor popup out of the box.
• allowEmpty no longer applies either. Because there's no more editor empty annotations are always allowed.
• readOnly roughly corresponds to the setDrawingEnabled method on the annotator. (But, again, differs a little because there is no more editor popup.)
• handleRadius is not a config option (yet)
• formatter is (roughly) replaced with the custom styling. Note that there is no replacement for labels yet. May come in the future. (But it's not a requirement for any of my current clients.)
• fragmentUnit is not yet supported.

[vidya-talapady-percipient-ai]

Ok. Thanks. @rsimon , does or can 2.7 have the changes we made for the handles, resizing at the edges and corners with the correct icons #275 ?

[rsimon]

Yes, as far as I can see that PR is merged and part of the latest 2.7.x release.

[Vidyadayini]

Using 2.7.13, I see that I can use enableEdgeControls: true, which allows me to resize at the edges and corners. However, I also need to have the right icons visisble on hover. Using enableEdgeControls alone, just shows the circles at all the corners and center of edges.

[Vidyadayini]

@rsimon , the issue is that if we do not have the proper icon behavior we will have all those circles appear on the corners and edges. And if we are trying to draw a small label, these dots cover the label.

[rsimon]

The feature was a 3rd party contribution. Happy to take a PR for this.

[vidya-talapady-percipient-ai]

@rsimon , I'm working on adding the ability to resize using both the full edge and adding the right cursors. This update will be version 2.7.14. I'll let you know when it's ready. Once you have a chance to review the PR, would you be able to merge and maintain it quickly?

[rsimon]

I'll try to review, and can publish a new version of the npm package. But I'm no longer actively maintaining the 2.7.x version any more.

[vidya-talapady-percipient-ai]

Ok @rsimon, here is my branch vidya-talapady-percipient-ai/annotorious-2.7.13-custom@de23374

[rsimon]

Please send a PR

[vidya-talapady-percipient-ai]

@rsimon, here is my PR. #525. I will keep you posted.