VintaSoft Imaging .NET SDK 14.0: Документация для Веб разработчика
В этом разделе
    Как добавить пользовательское свойство к прямоугольной JavaScript-аннотации?
    В этом разделе
    В этом руководстве показано, как добавить пользовательское свойство к прямоугольной JavaScript-аннотации.

    Сначала необходимо создать пользовательские данные аннотации - класс RedactionAnnotationData, который наследуется от класса Vintasoft.Imaging.Annotation.RectangleAnnotationData, и добавить пользовательское свойство в новый класс.
    Вот C# код класса RedactionAnnotationData:
    /// <summary>
    /// Contains information about the annotation that displays redaction (black rectangle with redaction reason).
    /// </summary>
    public class RedactionAnnotationData : Vintasoft.Imaging.Annotation.RectangleAnnotationData
    {
    
        /// <summary>
        /// Initializes a new instance of the <see cref="RedactionAnnotationData"/> class.
        /// </summary>
        public RedactionAnnotationData()
            : base()
        {
            this.FillBrush = new Vintasoft.Imaging.Annotation.AnnotationSolidBrush(Color.Black);
        }
    
        /// <summary>
        /// Initializes a new instance of the <see cref="RedactionAnnotationData"/> class.
        /// </summary>
        /// <param name="info">The SerializationInfo to populate with data.</param>
        /// <param name="context">The destination for this serialization.</param>
        public RedactionAnnotationData(System.Runtime.Serialization.SerializationInfo info, System.Runtime.Serialization.StreamingContext context)
            : base(info, context)
        {
            Reason = (string)info.GetValue("Reason", typeof(string));
        }
    
    
    
        string _reason;
        /// <summary>
        /// Gets or sets the redaction reason.
        /// </summary>
        public string Reason
        {
            get { return _reason; }
            set { _reason = value; }
        }
    
    
    
        /// <summary>
        /// Creates a new object that is a copy of the current RedactionAnnotationData instance.
        /// </summary>
        /// <returns>A new object that is a copy of this RedactionAnnotationData instance.</returns>
        public override object Clone()
        {
            var result = new RedactionAnnotationData();
            CopyTo(result);
            result.Reason = Reason;
            return result;
        }
    
        /// <summary>
        /// Populates a SerializationInfo with the data needed to serialize the target object.
        /// </summary>
        /// <param name="info">The SerializationInfo to populate with data.</param>
        /// <param name="context">The destination for this serialization.</param>
        [System.Security.Permissions.SecurityPermission(System.Security.Permissions.SecurityAction.LinkDemand, Flags = System.Security.Permissions.SecurityPermissionFlag.SerializationFormatter)]
        public override void GetObjectData(System.Runtime.Serialization.SerializationInfo info, System.Runtime.Serialization.StreamingContext context)
        {
            info.AddValue("Reason", Reason);
            base.GetObjectData(info, context);
        }
    
    }
    
    


    Затем необходимо создать пользовательский форматтер для сериализации аннотаций в формат Vintasoft JSON и обратно.
    Вот C# код класса CustomAnnotationJsonFormatter, который позволяет сериализовать класс RedactionAnnotationData:
    /// <summary>
    /// Represents a custom formatter for serializing annotations to and from Vintasoft JSON format.
    /// </summary>
    public class CustomAnnotationJsonFormatter : Vintasoft.Imaging.Annotation.Web.Services.AnnotationJsonFormatter
    {
    
        /// <summary>
        /// Serializes an annotation data to a JSON string.
        /// </summary>
        /// <param name="annotationData">Annotation data to serialize.</param>
        /// <returns>
        /// The annotation data as JSON string.
        /// </returns>
        protected override string SerializeAnnotationData(Vintasoft.Imaging.Annotation.AnnotationData annotationData)
        {
            // get JSON string with information about properties of base annotation data
            string jsonAnnotation = base.SerializeAnnotationData(annotationData);
    
            System.Text.StringBuilder sb = new System.Text.StringBuilder(jsonAnnotation);
            // if redaction annotation is serializing
            else if (annotationData is RedactionAnnotationData)
            {
                RedactionAnnotationData redactionAnnotation = annotationData as RedactionAnnotationData;
                sb.Append(", ");
                SerializeRectangleAnnotationData(annotationData as Vintasoft.Imaging.Annotation.RectangleAnnotationData, sb);
                sb.Append(", ");
                sb.Append(string.Format("\"reason\": \"{0}\" ", redactionAnnotation.Reason));
                sb.Append(", ");
                sb.Append(string.Format("\"type\": \"{0}\"", "RedactionAnnotation"));
            }
    
            // return annotation data serialized as JSON string
            return sb.ToString();
        }
    
        /// <summary>
        /// Deserializes an annotation data from JSON string
        /// </summary>
        /// <param name="annotationInfo">Dictionary that contains information about names and values
        /// of annotation properties.</param>
        /// <returns>
        /// The annotation data.
        /// </returns>
        protected override Vintasoft.Imaging.Annotation.AnnotationData DeserializeAnnotationData(
            System.Collections.Generic.Dictionary<string, object> annotationInfo)
        {
            // deserialize annotation data
            Vintasoft.Imaging.Annotation.AnnotationData annotationData = base.DeserializeAnnotationData(annotationInfo);
    
            // if annotation data was not deserialized
            if (annotationData == null)
            {
                if (annotationInfo != null && annotationInfo.ContainsKey("type"))
                {
                    string type = annotationInfo["type"].ToString();
                    switch (type)
                    {
                        case "RedactionAnnotation":
                            annotationData = new RedactionAnnotationData();
    
                            (annotationData as RedactionAnnotationData).Reason = annotationInfo["reason"].ToString();
    
                            DeserializeRectangleAnnotationProperties((Vintasoft.Imaging.Annotation.RectangleAnnotationData)annotationData, annotationInfo);
                            break;
                    }
                }
            }
            // return annotation data
            return annotationData;
        }
    
    }
    
    


    Далее необходимо создать пользовательский API-контроллер аннотаций, который использует класс CustomAnnotationJsonFormatter для сериализации аннотаций.
    Вот C# код пользовательского API-контроллера аннотаций:
    /// <summary>
    /// API controller that handles HTTP requests from clients and allows to manipulate annotations on server.
    /// </summary>
    public class AnnotationApiController : Vintasoft.Imaging.Annotation.Web.Api2Controllers.VintasoftAnnotationCollectionApi2Controller
    {
    
        public AnnotationApiController()
            : base()
        {
            // set the custom annotation formatter
            Formatter = new CustomAnnotationJsonFormatter();
        }
    
    }
    
    


    Затем необходимо создать пользовательское представление аннотации - класс WebRedactionAnnotationView, который наследуется от класса WebRectangleAnnotationViewJS, и добавить пользовательское свойство в новый класс.
    Вот JavaScript код класса WebRedactionAnnotationViewJS:
    /**
     Determines how to display the annotation that displays redaction and how user can interact with annotation.
    */
    WebRedactionAnnotationViewJS = function () {
    
        WebRedactionAnnotationViewJS.superclass.constructor.call(this);
    
        this.set_FillBrush(Vintasoft.Imaging.Annotation.UI.WebAnnotationBrushJS(1, "rgba(0,0,0,1)"));
        this._reason = "";
    
    
    
        /**
         Gets annotation type.
        */
        WebRedactionAnnotationViewJS.prototype.get_Type = function () {
            return "RedactionAnnotation";
        }
    
        /**
         Gets the redaction reason.
        */
        WebRedactionAnnotationViewJS.prototype.get_Reason = function () {
            return this._reason;
        }
        /**
         Sets the redaction reason.
        */
        WebRedactionAnnotationViewJS.prototype.set_Reason = function (value) {
            this._reason = value;
        }
    
    
    
        /**
         Copies the state of the current annotation to the target annotation.
        */
        WebRedactionAnnotationViewJS.prototype.copyTo = function (target) {
            WebRedactionAnnotationViewJS.superclass.copyTo.call(this, target);
    
            target._reason = this._reason;
        }
    
        /**
         Returns a JSON-object for annotation serialization.
        */
        WebRedactionAnnotationViewJS.prototype.serialize = function () {
            var annotationCopy = WebRedactionAnnotationViewJS.superclass.serialize.call(this);
            annotationCopy["type"] = this.get_Type();
            annotationCopy["reason"] = this._reason;
            return annotationCopy;
        }
    
        /**
         Deserializes annotation.
        */
        WebRedactionAnnotationViewJS.prototype.deserialize = function (jsonObject) {
            WebRedactionAnnotationViewJS.superclass.deserialize.call(this, jsonObject);
            this._reason = jsonObject.reason;
        }
    
    }
    Vintasoft.Shared.extend(WebRedactionAnnotationViewJS, Vintasoft.Imaging.Annotation.UI.WebRectangleAnnotationViewJS);
    
    


    Далее необходимо зарегистрировать пользовательскую JavaScript-аннотацию в фабрике JavaScript-аннотаций.
    Вот JavaScript код, показывающий, как зарегистрировать пользовательскую JavaScript-аннотацию в фабрике JavaScript-аннотаций:
    Vintasoft.Imaging.Annotation.UI.WebAnnotationViewFabricJS.registerAnnotation("RedactionAnnotation", function () { return new WebRedactionAnnotationViewJS(); });
    
    


    Наконец, необходимо создать экземпляр класса WebRedactionAnnotationView и добавить созданную аннотацию в веб просмотрщик изображений с аннотациями.
    Вот JavaScript-код, который демонстрирует, как создать JavaScript Redaction-аннотацию и добавить ее в веб просмотрщик аннотаций:
    // create JavaScript redaction annotation
    var redactionAnno = new WebRedactionAnnotationViewJS();
    redactionAnno.set_Location(318, 264);
    redactionAnno.set_Size(250, 200);
    redactionAnno.set_Reason("Accept");
    
    // get annotation visual tool from annotation viewer
    _annotationVisualTool = annotationViewer1.get_AnnotationVisualTool();
    // add created annotation to the focused image
    _annotationVisualTool._focusedCollection.add(redactionAnno);