Resource Base
Table of contents

API Reference - JavaScript

The primary class of the library is DocumentNormalizer. The following code snippets shows the basic usage.

  • Detect and normalize a still image
let normalizer = await Dynamsoft.DDN.DocumentNormalizer.createInstance();
let quads = await normalizer.detectQuad(imagePath);
let normalizedImageResult = await normalizer.normalize(imagePath, { quad: quads[0].location });
if(normalizedImageResult) {
    // Show the normalized image in a Canvas
    const cvs = normalizedImageResult.image.toCanvas();
// Download the normalized image
let img = await normalizedImageResult.saveToFile("example.png", true);
  • Detect and normalize continuous video frames
(async function() {
    cameraEnhancer = await Dynamsoft.DCE.CameraEnhancer.createInstance();
    normalizer = await Dynamsoft.DDN.DocumentNormalizer.createInstance();
    await normalizer.setImageSource(cameraEnhancer, { resultsHighlightBaseShapes: Dynamsoft.DCE.DrawingItem });

    await document.getElementById('div-ui-container').append(cameraEnhancer.getUIElement());
    // Triggered when a quadrilateral is detected from a video frame.
    normalizer.onQuadDetected = (quadResults, sourceImage) => {

    // Click the button to pause the video and edit a quadrilateral.
    document.getElementById('confirmQuadForNormalization').addEventListener("click", () => {

    // Click the button to normalize with the selected/adjusted quadrilateral.
    document.getElementById('normalizeWithConfirmedQuad').addEventListener("click", async () => {
        const normalizedImageResult = await normalizer.normalizeWithConfirmedQuad();
        if(normalizedImageResult) {
        // Show the normalized image in a Canvas
        const cvs = normalizedImageResult.image.toCanvas();
    // Start scanning document boundaries.
    await normalizer.startScanning(true);

The APIs for this class include

Initialization Control

Method Description
license Uses an alphanumeric string to specify the license.
createInstance() Creates a DocumentNormalizer instance.
dispose() Dispose the DocumentNormalizer instance.
disposed Returns whether the instance has been disposed.
engineResourcePath Specifies the path from where the engine and models, etc. can be loaded.
loadWasm() Loads the engine.
isWasmLoaded() Returns whether the engine has been loaded.
getVersion() Returns the version of the library.

Video Detecting Methods

Method Description
setImageSource() Sets an image source for continous scanning.
onQuadDetected This event is triggered when a new quadrilateral is detected.
setQuadResultFilter() Sets a function to filter a detected quadrilateral.
confirmQuadForNormalization() Confirms which quadrilateral will be referred for later normalization.
normalizeWithConfirmedQuad() Normalizes the image whith a selected quadrilateral.
startScanning() Opens the camera and starts continuous scanning of incoming images.
pauseScanning() Pauses continuous scanning but keep the video stream.
resumeScanning() Resumes continuous scanning.
stopScanning() Stops continuous scanning and closes the video stream.

Detect and Normalize Methods

Method Description
detectQuad() Detects quadrilaterals from an image.
normalize() Normalizes the source image based on the settings in options.

Scan Settings Methods

Method Description
getScanSettings() Returns the current ScanSettings.
updateScanSettings() Updates scan settings with the object passed in.

Runtime Settings Methods

Method Description
getRuntimeSettings() Gets runtime settings with a template represented by a JSON object.
setRuntimeSettings() Sets runtime settings with a JSON object.
resetRuntimeSettings() Resets all parameters to default values.


This page is compatible for:

Version 1.0

Is this page helpful?

YesYes NoNo

In this article:

version 1.0.12

  • Latest version(2.2.10)
  • Version 2.x
    • Version 2.0.21
    • Version 2.0.20
    • Version 2.0.11
  • Version 1.x
    • Version 1.0.12
    • Version 1.0.11
    • Version 1.0.10
    • Version 1.0.0
Change +
© 2003–2024 Dynamsoft. All rights reserved.
Privacy Statement / Site Map / Home / Purchase / Support