fast-sobel-tfjs
Version:
GPU-accelerated Sobel edge detection for TensorFlow.js - 5-10x faster than CPU implementations
119 lines (118 loc) • 4.61 kB
TypeScript
import * as tf from '@tensorflow/tfjs';
import { GradientComponents, OutputFormat, SobelOptions } from './types';
/**
* SobelFilter class that implements edge detection using the Sobel operator.
*
* Features:
* - Configurable kernel sizes (3×3, 5×5, and 7×7)
* - Multiple output formats (magnitude, x, y, direction, normalized)
* - Optional grayscale pre-processing
* - Works with tensors, ImageData, pixel arrays, and HTML Images
*/
export declare class SobelFilter {
private kernelSize;
private output;
private options;
/**
* Creates a new SobelFilter instance
*
* @param options Configuration options
*/
constructor(options?: SobelOptions);
/**
* Applies the Sobel filter to a TensorFlow.js tensor
*
* @param input Input tensor of shape [height, width, channels]
* @returns Output tensor with the Sobel filter applied, normalized to [0, 1] if options.normalizeOutputForDisplay is true
*/
applyToTensor(input: tf.Tensor3D): tf.Tensor3D;
/**
* Process an ImageData object (from canvas)
*
* @param imageData HTML Canvas ImageData object
* @returns Promise resolving to a new ImageData with the Sobel filter applied
*/
processImageData(imageData: ImageData): Promise<ImageData>;
/**
* Process a raw pixel array
*
* @param pixels Pixel data as Uint8ClampedArray or similar
* @param width Image width
* @param height Image height
* @param channels Number of channels (default 4 for RGBA)
* @returns Promise resolving to a new pixel array with the Sobel filter applied
*/
processPixelArray(pixels: Uint8ClampedArray | Uint8Array | Float32Array, width: number, height: number, channels?: number): Promise<Uint8ClampedArray>;
/**
* Processes a 2D array of values (grayscale image or single channel)
*
* @param data 2D array of values
* @returns Promise resolving to a 2D array with the Sobel filter applied
*/
process2DArray(data: number[][]): Promise<number[][]>;
/**
* Utility method for processing an image directly from an HTML Image element
*
* @param image HTML Image element
* @returns Promise resolving to a Canvas element with the filtered image
*/
processImage(image: HTMLImageElement): Promise<HTMLCanvasElement>;
/**
* Convenience method to apply the filter and get a raw data URL
*
* @param image HTML Image element
* @returns Promise resolving to a data URL of the processed image
*/
getDataURL(image: HTMLImageElement): Promise<string>;
/**
* Apply the filter with a specific output format, regardless of what was set in the constructor
*
* @param input Input tensor
* @param outputFormat Output format to use for this operation
* @returns Processed tensor
*/
applyWithFormat(input: tf.Tensor3D, outputFormat: OutputFormat): tf.Tensor3D;
/**
* Get both gradient magnitude and direction in one pass
*
* @param input Input tensor
* @returns Object containing magnitude and direction tensors
*/
getGradientComponents(input: tf.Tensor3D): GradientComponents;
/**
* Returns the current configuration of the filter
* @returns Configuration object
*/
getConfig(): SobelOptions;
/**
* Sets new configuration options for the filter
* @param options New options to apply
*/
configure(options: Partial<SobelOptions>): void;
/**
* Static utility method to create and apply a Sobel filter in one step
* For TensorFlow.js users.
*
* @param tensor Tensor to process
* @param options Sobel filter options
* @returns Processed tensor
*/
static applyToTensor(tensor: tf.Tensor3D, options?: SobelOptions): tf.Tensor3D;
/**
* Static utility method to create and apply a Sobel filter in one step
* For ImageData users.
*
* @param imageData Image data to process
* @param options Sobel filter options
* @returns Promise resolving to processed image data
*/
static apply(imageData: ImageData, options?: SobelOptions): Promise<ImageData>;
/**
* Convenience method to extract edges with optimal settings
*
* @param input Input tensor or ImageData
* @param useGrayscale Whether to convert RGB images to grayscale (default: true)
* @returns Promise resolving to processed data (same type as input)
*/
static extractEdges(input: tf.Tensor3D | ImageData, useGrayscale?: boolean): Promise<tf.Tensor3D | ImageData>;
}