Работа с Aspose.Drawing в веб-приложении ASP.NET Core

В этой статье мы узнаем, как создавать и отображать векторную графику в веб-приложении ASP.NET Core с помощью Razor Pages. Для создания потрясающей векторной графики мы будем использовать библиотеку Aspose.Drawing. В этом пошаговом руководстве мы проведем вас через процесс интеграции Aspose.Drawing в веб-приложение ASP.NET Core.

Понимание Aspose.Drawing for .NET

Aspose.Drawing for .NET — это кроссплатформенная библиотека 2D-графики для рисования векторной графики. Это позволяет разработчикам программно работать с векторной графикой. Библиотека позволяет отображать векторную графику на растровых изображениях, таких как линии, кривые и фигуры, а также текст. Затем изображения можно сохранять во всех широко используемых графических форматах, включая BMP, PNG, JPEG, GIF и TIFF.

Как создавать и отображать векторную графику на веб-страницах ASP.NET Core

Мы можем создавать и отображать векторную графику в веб-приложениях ASP.NET Core, выполнив следующие шаги:

Создание проекта веб-приложения ASP.NET Core

  • Создайте новый проект и выберите шаблон проекта веб-приложения ASP.NET Core.
Select the project template.

Select the project template.

  • После этого напишите название проекта и переходите к следующему шагу.

  • Наконец, выберите framework .NET 7.0 (Standard Term Support), установите флажок «Настроить для HTTPS» и нажмите кнопку «Создать», чтобы создать проект.

Выберите структуру проекта

Выберите структуру проекта

Добавить пакет Aspose.Drawing NuGet

  • Откройте диспетчер пакетов NuGet и установите пакет Aspose.Drawing for .NET.
Установите Aspose.Drawing for .NET

Установите Aspose.Drawing for .NET

Добавьте код рисования изображения

  • Откройте Pages\Index.cshtml.cs и замените его содержимое следующим сценарием.
using Microsoft.AspNetCore.Mvc.RazorPages;
using System.Drawing.Drawing2D;
using System.Drawing.Imaging;
using System.Drawing;

namespace AsposeDrawingWebApplication.Pages
{
    public class IndexModel : PageModel
    {
        private readonly ILogger<IndexModel> _logger;
        
        public string imageSrc { get; set; }

        public IndexModel(ILogger<IndexModel> logger)
        {
            _logger = logger;
        }
        public void OnGet()
        {
            imageSrc = "data:image/png;base64, " + Convert.ToBase64String(Draw(ImageFormat.Png).ToArray());
        }

        static MemoryStream Draw(ImageFormat format)
        {
            // В этом примере кода показано, как нарисовать регион.
            // Создать растровое изображение
            Bitmap bitmap = new Bitmap(1000, 800, System.Drawing.Imaging.PixelFormat.Format32bppPArgb);

            // Начальная графика из растрового изображения
            Graphics graphics = Graphics.FromImage(bitmap);
            graphics.SmoothingMode = SmoothingMode.AntiAlias;

            // Инициализировать графический путь
            GraphicsPath path = new GraphicsPath();

            // Добавить полигон
            path.AddPolygon(new Point[] { new Point(100, 400), new Point(500, 100), new Point(900, 400), new Point(500, 700) });

            // Инициализировать регион
            Region region = new Region(path);

            // Внутренний графический путь
            GraphicsPath innerPath = new GraphicsPath();

            // Добавить прямоугольник
            innerPath.AddRectangle(new Rectangle(300, 300, 400, 200));

            // Исключить внутренний путь
            region.Exclude(innerPath);

            // Определение сплошной кисти
            Brush brush = new SolidBrush(Color.Green);

            // Заполнить область
            graphics.FillRegion(brush, region);

            MemoryStream result = new MemoryStream();
            bitmap.Save(result, format);
            result.Seek(0, SeekOrigin.Begin);
            return result;
        }
    }
}
  • Откройте Pages\Index.cshtml и замените его содержимое следующим сценарием.
@page
@model IndexModel
@{
    ViewData["Title"] = "Home page";
}

<div class="text-center">
    <h1 class="display-4">Welcome</h1>
    
    <img src="@Model.imageSrc" />
</div>

Добавьте файл лицензии Aspose.Drawing

  • Скопируйте файл Aspose.Drawing.NET.lic с лицензионной информацией Aspose.Drawing в каталог проекта. Откройте это свойство файла в обозревателе решений и задайте для параметра Действие сборки значение Встроенный ресурс.

  • После этого откройте Program.cs и добавьте следующий код, чтобы установить лицензию Aspose.Drawing.

// Лицензия
System.Drawing.AsposeDrawing.Лицензия license = new System.Drawing.AsposeDrawing.Лицензия();
license.SetЛицензия("Aspose.Drawing.NET.lic");
  • Наконец, запустите приложение.
Выход

Выход

Загрузите исходный код

Полный исходный код веб-приложения ASP .NET можно загрузить с GitHub.

Получить бесплатную лицензию

Если вы хотите попробовать библиотеку без каких-либо ограничений, вы можете получить бесплатную временную лицензию.

Aspose.Drawing — бесплатные обучающие ресурсы

Вы можете изучить различные другие функции библиотеки Aspose.Drawing, используя следующие ресурсы:

Заключение

В заключение, Aspose.Drawing является ценным активом для веб-разработчиков ASP.NET, стремящихся включить в свои веб-проекты динамическую и визуально привлекательную векторную графику. Следуя приведенным инструкциям, вы откроете новые возможности веб-разработки с помощью Aspose.Drawing. В случае возникновения неясностей свяжитесь с нами на нашем бесплатном форуме поддержки.

Смотрите также