ในบทความนี้ เราจะเรียนรู้วิธีสร้างและแสดงกราฟิกแบบเวกเตอร์ในแอปพลิเคชัน ASP.NET Core Web ด้วย razor page สำหรับการสร้างกราฟิกแบบเวกเตอร์ที่น่าทึ่ง เราจะใช้ไลบรารี Aposose.Drawing ในคำแนะนำทีละขั้นตอนนี้ เราจะแนะนำคุณตลอดกระบวนการรวม Aspose.Drawing เข้ากับเว็บแอป ASP.NET Core
ทำความเข้าใจเกี่ยวกับ Aspose.Drawing for .NET
Aspose.Drawing for .NET เป็นไลบรารีกราฟิก 2 มิติข้ามแพลตฟอร์มสำหรับการวาดกราฟิกแบบเวกเตอร์ ช่วยให้นักพัฒนาสามารถทำงานกับกราฟิกแบบเวกเตอร์โดยทางโปรแกรม ไลบรารีช่วยให้คุณสามารถแสดงกราฟิกแบบเวกเตอร์บนภาพแรสเตอร์ เช่น เส้น เส้นโค้ง และตัวเลข ตลอดจนข้อความ จากนั้นสามารถบันทึกรูปภาพในรูปแบบกราฟิกที่ใช้กันทั่วไปได้ทั้งหมด รวมถึง BMP, PNG, JPEG, GIF และ TIFF
วิธีสร้างและแสดงกราฟิกแบบเวกเตอร์ใน ASP.NET Core Web Pages
เราสามารถสร้างและแสดงกราฟิกแบบเวกเตอร์ในเว็บแอปพลิเคชัน ASP.NET Core โดยทำตามขั้นตอนด้านล่าง:
สร้างโครงการ ASP.NET Core Web App
- สร้างโครงการใหม่และเลือกแม่แบบโครงการ ASP.NET Core Web App
หลังจากนั้นให้เขียนชื่อโครงการและไปยังขั้นตอนต่อไป
สุดท้าย เลือก framework .NET 7.0 (Standard Term Support) เลือกตัวเลือก Configure for HTTPS และคลิกที่ปุ่ม Create เพื่อสร้างโปรเจ็กต์
เพิ่มแพ็คเกจ Aspose. Drawing NuGet
- เปิด NuGet Package Manager และติดตั้งแพ็คเกจ 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 ไปยังไดเร็กทอรีโครงการ เปิดคุณสมบัติไฟล์นี้จาก Solution Explorer และตั้งค่า Build Action เป็น Embedded Resource
หลังจากนั้นให้เปิด Program.cs และเพิ่มโค้ดต่อไปนี้เพื่อตั้งค่าสิทธิ์การใช้งาน Aspose.Drawing
// ใบอนุญาต
System.Drawing.AsposeDrawing.ใบอนุญาต license = new System.Drawing.AsposeDrawing.ใบอนุญาต();
license.Setใบอนุญาต("Aspose.Drawing.NET.lic");
- สุดท้ายให้เรียกใช้แอปพลิเคชัน
ดาวน์โหลดซอร์สโค้ด
คุณสามารถดาวน์โหลดซอร์สโค้ด.NET เว็บแอปพลิเคชัน ASP ที่สมบูรณ์ได้จาก GitHub
รับใบอนุญาตฟรี
หากคุณต้องการลองใช้ห้องสมุดโดยไม่มีข้อจำกัดใดๆ คุณสามารถ ขอรับใบอนุญาตชั่วคราวได้ฟรี
Aspose.Drawing – แหล่งการเรียนรู้ฟรี
คุณสามารถสำรวจคุณสมบัติอื่นๆ ของไลบรารี Aspose.Drawing โดยใช้แหล่งข้อมูลต่อไปนี้:
บทสรุป
โดยสรุป Aspose.Drawing เป็นสินทรัพย์ที่มีค่าสำหรับนักพัฒนาเว็บ ASP.NET ที่ต้องการรวมกราฟิกแบบเวกเตอร์แบบไดนามิกและดึงดูดสายตาเข้ากับโครงการเว็บของตน เมื่อทำตามขั้นตอนที่ให้ไว้ คุณจะปลดล็อกความเป็นไปได้ใหม่ๆ ในการพัฒนาเว็บด้วย Aspose.Drawing ในกรณีที่มีความคลุมเครือ โปรดติดต่อเราที่ ฟอรัมสนับสนุนฟรี