import { ElementRef } from '@angular/core'; import { TranslateService } from '@ngx-translate/core'; import { VhImage } from 'vhautowebdb'; import { FunctionService } from 'vhobjects-service/src/services'; import * as i0 from "@angular/core"; export declare class CanvasService { private functionService; private vhImage; private translateService; listChoose: any[]; extensionToType: { jpg: string; jpeg: string; png: string; }; ratiosCrop: string[]; drawTools: { name: string; label: string; matIcon: string; }[]; canvas: HTMLCanvasElement; ctx: CanvasRenderingContext2D; previewCanvas: HTMLCanvasElement; previewCtx: CanvasRenderingContext2D; private session; private ort; constructor(functionService: FunctionService, vhImage: VhImage, translateService: TranslateService); /** * Hàm thực hiện vẽ hình lên canvas * @param canvasRef * @param _this */ draw(canvasRef: ElementRef, _this: any): void; /** * Hàm vẽ lưới trên canvas sẽ đè lên hình * @param canvasRef */ drawGrid(canvasRef: ElementRef): void; /** * Vẽ các handle điều chỉnh * @param x * @param y * @param width * @param height */ private drawCropHandles; /** * Hàm reset view * @param canvasRef * @param _this * @example this.canvasService.resetView(this.canvasRef, this); */ resetView(canvasRef: ElementRef, _this: any): void; /** * Hàm kiểm tra điểm có trong handle không * @param x * @param y * @param handle * @param _this * @returns true: có; false: không * @example * // Kiểm tra xem có click vào handle nào không * if (this.canvasService.isPointInHandle(mouseX, mouseY, handle, this)) { * this.isResizingCrop = true; * this.resizeHandle = handle.type; * return; * } */ isPointInHandle(x: number, y: number, handle: any, _this: any): boolean; /** * Hàm kiểm tra điểm có trong vùng crop không * @param x * @param y * @param _this * @returns true: có; false: không * @example * // Nếu không click vào handle, kiểm tra có click trong vùng crop không * if (this.canvasService.isPointInCropArea(mouseX, mouseY, this)) { * this.isDraggingCrop = true; * this.dragStartX = mouseX; * this.dragStartY = mouseY; * this.cropDragOffsetX = mouseX - Math.min(this.cropStartX, this.cropEndX); * this.cropDragOffsetY = mouseY - Math.min(this.cropStartY, this.cropEndY); * return; * } */ isPointInCropArea(x: number, y: number, _this: any): boolean; /** * Hàm làm tròn số trong thu phóng * @param number số truyền vào * @param decimals làm tròn mấy số sau phẩy * @returns number số sau khi làm tròn * @example this.scale = this.canvasService.roundNumber(newScale); * // Hoặc * this.scale = this.canvasService.roundNumber(newScale, 1); */ roundNumber(number: number, decimals?: number): number; /** * Hàm tạo mới canvas để vẽ lại hoặc lưu * @param type loại menu công cụ * @param _this * @returns {tempCanvas: HTMLCanvasElement, newImage: HTMLImageElement} * @example const { tempCanvas, newImage } = await this.canvasService.createNewCanvas(type, this); * // Hoặc * const { newImage } = await this.canvasService.createNewCanvas('crop', this); */ createNewCanvas(type: 'crop' | 'rotate' | 'removeBackground' | 'drawOnImage' | 'default', _this: any): Promise<{ tempCanvas: HTMLCanvasElement; newImage: HTMLImageElement; }>; /** * Xử lý cho loại crop được dùng trong hàm createNewCanvas * @param newImage ảnh mới * @param _this * @returns {tempCanvas: HTMLCanvasElement, newImage: HTMLImageElement} * @example result = this.handleCrop(newImage, _this); */ private handleCrop; /** * Xử lý cho loại rotate được dùng trong hàm createNewCanvas * @param newImage ảnh mới * @param _this * @returns {tempCanvas: HTMLCanvasElement, newImage: HTMLImageElement} * @example result = this.handleRotate(newImage, _this); */ private handleRotate; /** * Xử lý cho loại removeBackground được dùng trong hàm createNewCanvas * @param newImage ảnh mới * @param _this * @returns {tempCanvas: HTMLCanvasElement, newImage: HTMLImageElement} * @example result = this.handleRemoveBackground(newImage, _this); */ private handleRemoveBackground; /** * Xử lý cho loại drawOnImage được dùng trong hàm createNewCanvas * @param newImage ảnh mới * @param _this * @returns {tempCanvas: HTMLCanvasElement, newImage: HTMLImageElement} * @example result = this.handleDrawOnImage(newImage, _this); */ private handleDrawOnImage; /** * Xử lý cho loại default được dùng trong hàm createNewCanvas (Khi các hàm handleCrop, handleRotate, handle.... bị lỗi sẽ trả về hàm này) * @param newImage ảnh mới * @param _this * @returns {tempCanvas: HTMLCanvasElement, newImage: HTMLImageElement} * @example result = this.handleDefault(newImage, _this); */ private handleDefault; /** * Thuật toán phát hiện biên * @param imageData dữ liệu ảnh * @returns */ private cannyEdgeDetection; /** * Thuật toán phân cụm màu * @param imageData dữ liệu ảnh * @returns */ private kMeansClustering; private euclidean3; private initKMeansPlusPlus; /** * Kết hợp Edge Mask và Color Mask * @param edgeMask * @param colorMask * @param width * @param height * @returns */ private combineMasks; /** * Làm mịn mask bằng Gaussian Blur + Threshold * @param mask * @param width * @param height * @returns Uint8Array */ private refineMask; /** * Áp dụng mask để làm trong suốt nền * @param imageData * @param mask */ private applyTransparency; /** * Làm mờ ảnh bằng Gaussian Blur * @param data * @param width * @param height * @param radius * @returns */ private gaussianBlur; /** * Tính Gradient * @param data * @param width * @param height * @returns */ private sobelOperator; /** * Khởi tạo tâm cụm (centroids) cho thuật toán K-means * Áp dụng phương pháp K-means++ để cải thiện chất lượng khởi tạo * * @param data - Mảng pixel ảnh (RGBA) * @param k - Số cụm cần phân (thường là 3: foreground, background, vùng chuyển tiếp) * @returns Mảng centroids (mỗi centroid là [R, G, B]) */ private initCentroids; /** * Thực hiện Non-Maximum Suppression để làm mỏng đường biên * @param gradient - Mảng chứa độ lớn gradient * @param direction - Mảng chứa hướng gradient (radian) * @param edgeMap - Mảng kết quả sau khi áp dụng suppression * @param width - Chiều rộng ảnh * @param height - Chiều cao ảnh */ private nonMaximumSuppression; /** * Thực hiện hysteresis thresholding để loại bỏ nhiễu và nối các đường biên đứt đoạn * @param edgeMap - Mảng chứa thông tin biên sau non-maximum suppression * @param width - Chiều rộng ảnh * @param height - Chiều cao ảnh * @param lowThreshold - Ngưỡng dưới (thường 0.1-0.3 max gradient) * @param highThreshold - Ngưỡng trên (thường 0.3-0.7 max gradient) */ private hysteresisThresholding; /** * Giảm kích thước ảnh bằng phương pháp lấy mẫu trung bình * @param imageData - Dữ liệu ảnh gốc (ImageData) * @param scaleFactor - Tỷ lệ giảm (0.1 đến 1.0) * @returns ImageData - Ảnh đã được giảm kích thước */ private downscaleImage; /** * Tính scale thu/phóng lên cho ảnh * @param width * @param height * @returns */ private calculateOptimalScale; /** * Tính scale phóng to lên cho mask * @param mask * @param targetWidth * @param targetHeight * @returns */ private upscaleMask; private createWorker; private loadWasmModule; /** * Hàm vẽ hình vuông/chữ nhật * @param startX Điểm bắt đầu trục x khi vẽ * @param startY Điểm bắt đầu trục y khi vẽ * @param endX Điểm kết thúc trục x khi vẽ * @param endY Điểm kết thúc trục y khi vẽ */ drawRectangle(startX: number, startY: number, endX: number, endY: number): void; /** * Hàm vẽ hình tròn: sau khi lấy 4 chỉ số bắt đầu trực x, y, kết thúc trực x, y thì radius cho tròn lại * @param startX Điểm bắt đầu trục x khi vẽ * @param startY Điểm bắt đầu trục y khi vẽ * @param endX Điểm kết thúc trục x khi vẽ * @param endY Điểm kết thúc trục y khi vẽ */ drawCircle(startX: number, startY: number, endX: number, endY: number): void; /** * Hàm vẽ đường thẳng hoặc đường thẳng có mũi tên * @param startX Điểm bắt đầu trục x khi vẽ * @param startY Điểm bắt đầu trục y khi vẽ * @param endX Điểm kết thúc trục x khi vẽ * @param endY Điểm kết thúc trục y khi vẽ * @param isArrow có mũi tên hay không * @param _this */ drawLine(startX: number, startY: number, endX: number, endY: number, isArrow: boolean, _this: any): void; /** * Hàm vẽ hình tam giác * @param startX Điểm bắt đầu trục x khi vẽ * @param startY Điểm bắt đầu trục y khi vẽ * @param endX Điểm kết thúc trục x khi vẽ * @param endY Điểm kết thúc trục y khi vẽ */ drawTriangle(startX: number, startY: number, endX: number, endY: number): void; drawPreview(startX: number, startY: number, endX: number, endY: number, _this: any): void; private drawLinePreview; private drawArrowhead; private drawTrianglePreview; clearPreview(): void; /** * Hàm dùng chung để lưu file ảnh xử lý canvas * @param _this * @param objectChoosing object đang được chọn * @param tempCanvas canvas tạm thời * @example this.canvasService.saveNewImage(this, this.objectChoosing, tempCanvas); */ saveNewImage(_this: any, objectChoosing: any, tempCanvas: HTMLCanvasElement): Promise; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵprov: i0.ɵɵInjectableDeclaration; }