NgDocMagnifierComponent

Lets the user pan its content by dragging and zoom it with the mouse wheel. Use ng-doc-magnifier-controller for buttons that do the same.

Decorators: @Component
Selectors: ng-doc-magnifier
Implements: OnInit

DeclarationTypeScript

@Component({ … })
export class NgDocMagnifierComponent implements OnInit { … }

Members

Properties

destroyRef: DestroyRef

protectedreadonly

—

document: Document

protectedreadonly

—

drag: WritableSignal<boolean>

protectedreadonly

—

element: HTMLElement

protectedreadonly

—

scale: WritableSignal<number>

protectedreadonly

—

transform: Signal<string>

protectedreadonly

—

x: WritableSignal<number>

protectedreadonly

—

y: WritableSignal<number>

protectedreadonly

—

Methods

(…): void

Moves the content horizontally.

Signature

incrementX(x: number): void;

Parameters

Name	Type	Description
x	`number`	Distance in screen pixels.

Returns

void

(…): void

Moves the content vertically.

Signature

incrementY(y: number): void;

Parameters

Name	Type	Description
y	`number`	Distance in screen pixels.

Returns

void

(): void

implements OnInit

—

Signature

ngOnInit(): void;

Returns

void

(): void

Resets the position and the scale.

Signature

reset(): void;

Returns

void

(…): void

Zooms in (positive diff) or out (negative diff); the scale never goes below 1.

Signature

zoom(diff: number): void;

Parameters

Name	Type	Description
diff	`number`	Zoom step, where 1000 doubles the scale.

Returns

void