Capture Viewer

Capture Viewer is used to control camera, play video stream, and capture the images from camera.

const captureViewer = new Dynamsoft.DDV.CaptureViewer({
    container: document.getElementById("viewer"),
});
captureViewer.openDocument("docUid"); // Open a document which has pages

Control camera

Select camera

DDV’s built-in Camera Viewer will select the best camera device in the camera list as the default camera. The method selectCamera() can help to select the camera you would like to use.

Select the first camera in the camera list

  const cameras = await captureViewer.getAllCameras();
  if (cameras.length) {
      await captureViewer.selectCamera(cameras[0]);
  }

Select the camera whose label is “Dynamsoft camera”.

  const cameras = await captureViewer.getAllCameras();
  for (var i=0;i<cameras.length;i++)
  { 
      if(cameras[i].label == "Dynamsoft camera"){
          captureViewer.selectCamera(cameras[i]);
          break;
      }
  }

Play/stop video stream

After selecting the specified camera, you need to call play() to play the video stream.

await captureViewer.play();

If you want to stop the video stream, please call stop() method.

captureViewer.stop();

Set resolution

The resolution of camera can be set when playing the video stream.

// Set to 1080P
await captureViewer.play({
	 resolution: [1920,1080], 
});

Turn on flashlight

After playing the video stream, the flashlight can be opened by using turnOnTorch().

// Turn on flashlight
await captureViewer.turnOnTorch();

// Turn off flashlight
await captureViewer.turnOffTorch();

Note that it only works with Chromium-based browsers such as Edge and Chrome on Windows or Android. Other browsers such as Firefox or Safari are not supported.

Note that all browsers on iOS (including Chrome) use WebKit as the rendering engine and are not supported.

Capture

Real-time boundaries detection

After configuring Document Detection, if you set enableAutoDetect to true, real-time border detection in video stream will be enabled.

captureViewer.enableAutoDetect = true;

Auto capture

When enableAutoCapture is set to true, the capture viewer will capture frame automatically.

captureViewer.enableAutoCapture = true;

If the auto detect is disabled, it will automatically capture a frame every 1 second by default. It can be set by autoCaptureDelay.

If the auto detect is enabled, automatic capturing will only be performed when the detection result meets expectations.