ComPDFKit
Get TrialContact Sales
DemoFAQTechnical Support
Guides

Overlay Comparison ​

Overlay comparison is to superpose two files and show the differences by different colors. The superimposed part shows the mixed color. You can set the color, transparency, and Blend Mode of the two files. Here are the supported Blend Modes: Normal, Multiply, Screen, Overlay, Darken, Lighten, ColorDodge, ColorBurn, HardLight, SoftLight, Difference, Exclusion, Hue, Saturation, Color, Luminosity.

javascript
// Get the file stream of the compared files.
const documentA = await fetch('https://example.com/documentA.pdf')
const documentABlob = await documentA.blob()
const documentAFile = new File([documentABlob], 'documentA.pdf')
const documentB = await fetch('https://example.com/documentB.pdf')
const documentBBlob = await documentB.blob()
const documentBFile = new File([documentBBlob], 'documentB.pdf')

const data = {
  leftFile: documentAFile, // Old file.
  rightFile: documentBFile, // New file.
  type: 2, // The type of document comparison.
  inTransparency: '50', // The transparency of the old file.
  newTransparency: '50', // The transparency of of the new file.
  coverType: '0', // Blend Modes.
  inColor: '#FBBDBF', // The color of the old file.
  newColor: '#93B9FD' // The color of of the new file.
}

// Get object containing document blob object of the comparison result.
const res = await docViewer.compare(data)