Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at

  • pantryfight 60 posts 84 karma points
    Dec 01, 2015 @ 06:26

    Image annotation with Annotorious

    Hi all,

    Just wondering if anyone out there's looked at creating a custom Umbraco property editor to annotate images using Annotorious before (

    I'm looking at having a try at doing exactly that, but I'm very interested in seeing if any of you guys and gals out there in the community have tried this before and if you were successful.

    cheers, Geoff

  • MuhammedRiza 1 post 71 karma points
    Apr 22, 2023 @ 13:18

    Hello Geoff,

    Creating a custom Umbraco property editor to annotate images using Annotorious sounds like a cool project! I haven't personally worked with Annotorious in Umbraco, but here are some general steps that you can follow:

    Create a new custom property editor in Umbraco You can create a new property editor by creating a new AngularJS directive in your Umbraco project. This directive will define the behavior of your property editor.

    Add Annotorious to your property editor You can add Annotorious to your property editor by including its CSS and JavaScript files in your directive's template. You can also initialize Annotorious in the directive's controller.

    Hook up Annotorious to the image In your directive, you will need to find the image element and add the necessary data attributes for Annotorious to work properly. You can do this by using the $element service in AngularJS.

    Save the annotations When the user saves the annotations, you can save them as JSON data in your Umbraco property.

Please Sign in or register to post replies

Write your reply to: