ایجاد بوم HTML5 با استفاده از C#

در این مقاله به شما نشان خواهم داد که چگونه عنصر HTML5 Canvas را با گرافیک با استفاده از C# تولید کنید. شما می توانید این ویژگی را در برنامه های وب دات نت خود برای تولید پویا و یکپارچه سازی HTML5 Canvas در صفحات وب جاسازی کنید.

عنصر HTML5 Canvas برای ترسیم گرافیک‌های سریع در صفحات وب استفاده می‌شود. منطقه ای را در اختیار شما قرار می دهد که به عنوان ظرفی از اشیاء گرافیکی یا طراحی عمل می کند. می توانید مسیرها، کادرها، متون، تصاویر و سایر اشیاء را ترسیم کنید و سپس آنها را به فرمت های تصویری تبدیل کنید. Aspose.Imaging for .NET به شما امکان می دهد یک عنصر Canvas HTML5 را با استفاده از C# یا VB.NET ایجاد کنید. این ویژگی به شما امکان می دهد بوم HTML5 را به صورت پویا ایجاد کنید و فایل گرافیکی منبع آن را در برنامه های کاربردی وب خود مانند برنامه ASP.NET تنظیم کنید. بنابراین بیایید بیشتر ادامه دهیم تا نحوه ایجاد عنصر HTML5 Canvas با استفاده از C# با Aspose.Imaging برای API .NET را بررسی کنیم.

C# API برای ایجاد بوم HTML5 - نصب

اول از همه، بیایید نگاهی به نحوه نصب Aspose.Imaging برای دات نت در برنامه دات نت خود بیاندازیم. به سادگی پای است. می‌توانید یک مرجع به DLL API اضافه کنید یا با استفاده از NuGet Package Manager آن را نصب کنید.

PM> Install-Package Aspose.Imaging

ایجاد یک صفحه وب با HTML5 Canvas با استفاده از C#

HTML5 Canvas به شما امکان می دهد یک تصویر منبع را تنظیم کنید که در ناحیه بوم ظاهر شود. با استفاده از Aspose.Imaging برای دات نت، می توانید گرافیک های CDR، CMX، EMF، WMF، و SVG را به یک بوم HTML5 بدون نگرانی در مورد کدهای HTML، جاوا اسکریپت و CSS صادر کنید. مراحل زیر برای ایجاد یک صفحه HTML با عنصر HTML5 Canvas روی آن است.

  • با استفاده از روش Image.Load() یک فایل گرافیکی را که می خواهید به عنوان منبع بوم تنظیم کنید بارگیری کنید.
  • بوم HTML5 را با صادرات تصویر با استفاده از روش Image.Save() ایجاد کنید.

نمونه کد زیر نحوه ایجاد بوم HTML5 با گرافیک با استفاده از C# را نشان می دهد.

using (var image = Image.Load(@"Sample.svg"))
{
    image.Save(@"Canvas.html", new Html5CanvasOptions
    {
        VectorRasterizationOptions = new SvgRasterizationOptions()
    });
}  

فقط با استفاده از C# عنصر Canvas HTML5 ایجاد کنید

در مثال قبلی، ما یک صفحه کامل HTML ایجاد کرده‌ایم که حاوی عنصر HTML5 Canvas است. با این حال، در موارد خاص، ممکن است لازم باشد عنصر بوم را فقط برای جاسازی آن در صفحه وب خود ایجاد کنید. برای چنین مواردی، می توانید Aspose.Imaging API را پیکربندی کنید تا از تولید صفحه کامل HTML جلوگیری کنید. مراحل زیر برای تولید عنصر HTML5 Canvas آمده است.

  • یک فایل گرافیکی را با استفاده از روش Image.Load() به عنوان منبع بوم بارگذاری کنید.
  • ویژگی Html5CanvasOptions.FullHtmlPage را روی false تنظیم کنید.
  • با استفاده از روش Image.Save() تصویر را به HTML صادر کنید.

نمونه کد زیر نحوه ایجاد عنصر HTML5 Canvas را فقط با استفاده از C# نشان می دهد.

using (var image = Image.Load(@"Sample.svg"))
{
    image.Save(@"Canvas.html", new Html5CanvasOptions
    {
        VectorRasterizationOptions = new SvgRasterizationOptions(),
        FullHtmlPage = false
    });
}

نتیجه

در این مقاله نحوه تولید بوم HTML5 به صورت پویا با استفاده از C# در برنامه‌های NET توضیح داده شده است. ما دیدیم که چگونه می توان صفحه کامل HTML حاوی یک بوم HTML5 یا بوم HTML5 را فقط با استفاده از Aspose.Imaging برای دات نت ایجاد کرد. می‌توانید با استفاده از مستندات درباره API بیشتر کاوش کنید.

همچنین ببینید