ImageEditor TagHelper Overview

The Telerik UI ImageEditor TagHelper for ASP.NET Core is a server-side wrapper for the Kendo UI ImageEditor widget.

The ImageEditor utilizes a canvas element and enables image editing. It allows you to open, edit and save edited images.

Telerik UI for ASP.NET Core Ninja image

The Image Editor is part of Telerik UI for ASP.NET Core, a professional grade UI library with 100+ components for building modern and feature-rich applications. To try it out sign up for a free 30-day trial.

Initializing the ImageEditor

The following example demonstrates how to define the ImageEditor by using the ImageEditor TagHelper. You can adjust and set up the tools in the tools collection through the <toolbar> tag. To define the tools for the ImageEditor, use the <items> and <item> tags to set the items collection.

    <kendo-imageeditor name="imageEditor" width="500" height="500" on-image-loaded="onImageLoaded">
        <save-as file-name="image.png" />
        <toolbar>
            <items>
                <item name="open"></item>
                <item name="save"></item>
                <item name="crop"></item>
                <item name="resize"></item>
            </items>
        </toolbar>
    </kendo-imageeditor>

    <script>
    function onImageLoaded(e){
        console.log("Image loaded")
    }
    </script>

See Also

In this article
Not finding the help you need? Improve this article