Как нарисовать текст на прямоугольной JavaScript-аннотации?

В этом разделе

В этом руководстве показано, как переопределить алгоритм отрисовки представления прямоугольной JavaScript-аннотации.

Сначала необходимо создать пользовательское представление аннотации - класс WebRedactionAnnotationViewJS, который наследуется от класса WebRectangleAnnotationViewJS, и переопределить алгоритм отрисовки представления аннотации.
Вот JavaScript код класса WebRedactionAnnotationViewJS:

JavaScript

/**
 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)"));



    /**
     Gets annotation type.
    */
    WebRedactionAnnotationViewJS.prototype.get_Type = function () {
        return "RedactionAnnotation";
    }



    /**
     Draws an annotation on the canvas drawing context in the coordinate space of annotation.
    */
    WebRedactionAnnotationViewJS.prototype.drawInContentSpace = function (drawingContext, canvasToAnnotationTransform) {
        var drawInContentSpaceResult = WebRedactionAnnotationViewJS.superclass.drawInContentSpace.call(this, drawingContext, canvasToAnnotationTransform);

        drawingContext.save();

        var rectSize = this.get_Size();
        var textHeight = 35;

        drawingContext.font = '48px serif';
        drawingContext.strokeText("Redaction", -rectSize.width / 2, -rectSize.height / 2 + textHeight);

        drawingContext.restore();

        return drawInContentSpaceResult;
    }

}
Vintasoft.Shared.extend(WebRedactionAnnotationViewJS, Vintasoft.Imaging.Annotation.UI.WebRectangleAnnotationViewJS);

Далее необходимо зарегистрировать пользовательскую JavaScript-аннотацию в фабрике JavaScript-аннотаций.
Вот JavaScript код, который показывает, как зарегистрировать пользовательскую JavaScript-аннотацию в фабрике JavaScript-аннотаций:

JavaScript

Vintasoft.Imaging.Annotation.UI.WebAnnotationViewFabricJS.registerAnnotation("RedactionAnnotation", function () { return new WebRedactionAnnotationViewJS(); });

Наконец, необходимо создать экземпляр класса WebRedactionAnnotationView и добавить созданную аннотацию в веб просмотрщик изображений с аннотациями.
Вот JavaScript-код, который демонстрирует, как создать JavaScript Redaction-аннотацию и добавить ее в веб просмотрщик аннотаций:

JavaScript

// create JavaScript redaction annotation
var redactionAnno = new WebRedactionAnnotationViewJS();
redactionAnno.set_Location(318, 264);
redactionAnno.set_Size(250, 200);

// get annotation visual tool from annotation viewer
_annotationVisualTool = annotationViewer1.get_AnnotationVisualTool();
// add created annotation to the focused image
_annotationVisualTool._focusedCollection.add(redactionAnno);

Отправить отзыв