Zoom
Preset zoom levels from 50% to 200%, fit-width mode, and zoom +/− buttons.
Zoom Controls
The component supports the following preset zoom levels accessible via the zoom dropdown or +/− buttons:
- 50% – Reduced zoom
- 75% – Three-quarter zoom
- 100% – Actual size (default zoom)
- 125% – Enlarged view
- 150% – Higher magnification
- 200% – Maximum zoom
- Fit Width – Auto-fit to page width
Zoom adjustments are applied to all pages and persist during annotation.
Prop
Type
Implementation
import { PDFAtelier } from '@innosoft/pdf-atelier-react';
export default function ZoomExample() {
return (
<PDFAtelier
src="/document.pdf"
license="My License"
showZoom={true}
showPageController={true}
/>
);
}import { Component } from '@angular/core';
import { PdfAtelierWrapper } from '@innosoft/pdf-atelier-angular';
@Component({
standalone: true,
selector: 'app-zoom',
imports: [PdfAtelierWrapper],
template: `
<pdf-atelier-wrapper
[src]="'/document.pdf'"
[license]="'My License'"
[showZoom]="true"
[showPageController]="true"
></pdf-atelier-wrapper>
`,
})
export class ZoomComponent {}<script setup lang="ts">
import PdfAtelierWrapper from '@innosoft/pdf-atelier-vue';
</script>
<template>
<PdfAtelierWrapper
:src="'/document.pdf'"
:license="'My License'"
:showZoom="true"
:showPageController="true"
/>
</template>