In This Topic ▼

viewPerspective Property

Summary

Current view perspective (transformation) value of this page.

Syntax

TypeScript

JavaScript

Object.defineProperty(DocumentPage.prototype, 'viewPerspective', 
   get: function(), 
   set: function(value) 
)

viewPerspective: RasterViewPerspective;

Property Value

The current view perspective of this page. The default value is RasterViewPerspective.topLeft.

Remarks

viewPerspective holds the current transformation of the page. Initially, it contains the value of topLeft, which means that no transformation has been applied to this page. Transformation can be reset by setting viewPerspective back to topLeft.

viewPerspective is saved into the cache entry of the page and is re-loaded and used when the document is loaded back from the cache.

Each call to rotate, flip and reverse will update viewPerspective with the value that matches the new transformation.

Refer to Document Page Transformation for more information.

Example

Rotate.ts

DocumentHelper.ts

Rotate.js

DocumentHelper.js

Rotate.html

import { DocumentHelper } from "../../utilities/DocumentHelper"; 
 
export class LEADDocument_RotateExample { 
   public constructor() { 
      lt.RasterSupport.setLicenseUri("https://demo.leadtools.com/licenses/js/LEADTOOLSEVAL.txt", "EVAL", null); 
      DocumentHelper.initFactory(); 
   } 
 
   public run = (buttonID: string) => { 
      const exampleButton = document.getElementById(buttonID); 
      exampleButton.onclick = this.rotatePage; 
   } 
 
   rotatePage = () => { 
      const url = "https://demo.leadtools.com/images/pdf/leadtools.pdf";; 
      const loadDocumentOptions = new lt.Document.LoadDocumentOptions(); 
 
      DocumentHelper.log("Loading document..."); 
      lt.Document.DocumentFactory.loadFromUri(url, loadDocumentOptions) 
         .done((doc) => { 
            DocumentHelper.log("Loaded, converting..."); 
            // LEADDocument is read-only by default, so: 
            doc.isReadOnly = false; 
            // Rotate the first page by 90 
            let docPage = doc.pages.item(0); 
            docPage.rotate(90); 
            // Flip the second page vertically 
            docPage = doc.pages.item(1); 
            docPage.flip(); 
            // Save it to the cache 
            lt.Document.DocumentFactory.saveToCache(doc) 
               .done(() => { 
                  // Convert it to PDF 
                  const jobData = new lt.Document.DocumentConverterJobData(); 
                  jobData.documentFormat = lt.Document.Writer.DocumentFormat.pdf; 
                  jobData.rasterImageFormat = lt.Document.RasterImageFormat.unknown; 
                  // Set document options 
                  const docxOptions = new lt.Document.Writer.DocxDocumentOptions(); 
                  docxOptions.textMode = lt.Document.Writer.DocumentTextMode.auto; 
                  jobData.documentOptions = docxOptions; 
                  doc.convert(jobData) 
                     .done((result) => { 
                        // This is generic code, we know the result is in "document" since DOCX supports that 
                        // But this code checks if the results have been archived into a ZIP file if this 
                        // example was converting to, say SVG 
                        const resultDocument = result.document != null ? result.document.url : result.archive.url; 
                        const link = document.createElement("a"); 
                        const url = lt.Document.DocumentFactory.serviceUri + "/" + resultDocument; 
                        link.href = url; 
                        link.innerHTML = url; 
                        link.target = "_default"; 
                        DocumentHelper.log("Converted: " + url, url); 
                     }) 
                     .fail(DocumentHelper.showServiceError); 
               }) 
               .fail(DocumentHelper.showServiceError); 
         }) 
         .fail(DocumentHelper.showServiceError); 
   } 
}

export class DocumentHelper { 
   static showServiceError = (jqXHR, statusText, errorThrown) => { 
      alert("Error returned from service. See the console for details."); 
      const serviceError = lt.Document.ServiceError.parseError(jqXHR, statusText, errorThrown); 
      console.error(serviceError); 
   } 
 
   static log = (message: string, data?: any) => { 
      const outputElement = document.getElementById("output"); 
      if (outputElement) { 
         const time = (new Date()).toLocaleTimeString(); 
         const textElement = document.createElement("p"); 
         textElement.innerHTML = (outputElement.childElementCount + 1) + " [" + time + "]: " + message; 
         outputElement.insertBefore(textElement, outputElement.firstChild); 
      } 
 
      if (!data) 
         console.log(message); 
      else 
         console.log(message, data); 
   } 
 
   static initFactory = () => { 
      // To communicate with the DocumentsService, it must be running! 
      // Change these parameters to match the path to the service. 
      lt.Document.DocumentFactory.serviceHost = "http://localhost:40000"; 
      lt.Document.DocumentFactory.servicePath = ""; 
      lt.Document.DocumentFactory.serviceApiPath = "api"; 
   } 
}

import { DocumentHelper } from "../../utilities/DocumentHelper"; 
 
export class LEADDocument_RotateExample { 
   constructor() { 
      lt.RasterSupport.setLicenseUri("https://demo.leadtools.com/licenses/js/LEADTOOLSEVAL.txt", "EVAL", null); 
      DocumentHelper.initFactory(); 
   } 
 
   run = (buttonID) => { 
      const exampleButton = document.getElementById(buttonID); 
      exampleButton.onclick = this.rotatePage; 
   } 
 
   rotatePage = () => { 
      const url = "https://demo.leadtools.com/images/pdf/leadtools.pdf";; 
      const loadDocumentOptions = new lt.Document.LoadDocumentOptions(); 
 
      DocumentHelper.log("Loading document..."); 
      lt.Document.DocumentFactory.loadFromUri(url, loadDocumentOptions) 
         .done((doc) => { 
            DocumentHelper.log("Loaded, converting..."); 
            // LEADDocument is read-only by default, so: 
            doc.isReadOnly = false; 
            // Rotate the first page by 90 
            let docPage = doc.pages.item(0); 
            docPage.rotate(90); 
            // Flip the second page vertically 
            docPage = doc.pages.item(1); 
            docPage.flip(); 
            // Save it to the cache 
            lt.Document.DocumentFactory.saveToCache(doc) 
               .done(() => { 
                  // Convert it to PDF 
                  const jobData = new lt.Document.DocumentConverterJobData(); 
                  jobData.documentFormat = lt.Document.Writer.DocumentFormat.pdf; 
                  jobData.rasterImageFormat = lt.Document.RasterImageFormat.unknown; 
                  // Set document options 
                  const docxOptions = new lt.Document.Writer.DocxDocumentOptions(); 
                  docxOptions.textMode = lt.Document.Writer.DocumentTextMode.auto; 
                  jobData.documentOptions = docxOptions; 
                  doc.convert(jobData) 
                     .done((result) => { 
                        // This is generic code, we know the result is in "document" since DOCX supports that 
                        // But this code checks if the results have been archived into a ZIP file if this 
                        // example was converting to, say SVG 
                        const resultDocument = result.document != null ? result.document.url : result.archive.url; 
                        const link = document.createElement("a"); 
                        const url = lt.Document.DocumentFactory.serviceUri + "/" + resultDocument; 
                        link.href = url; 
                        link.innerHTML = url; 
                        link.target = "_default"; 
                        DocumentHelper.log("Converted: " + url, url); 
                     }) 
                     .fail(DocumentHelper.showServiceError); 
               }) 
               .fail(DocumentHelper.showServiceError); 
         }) 
         .fail(DocumentHelper.showServiceError); 
   } 
}

export class DocumentHelper { 
   static showServiceError = (jqXHR, statusText, errorThrown) => { 
      alert("Error returned from service. See the console for details."); 
      const serviceError = lt.Document.ServiceError.parseError(jqXHR, statusText, errorThrown); 
      console.error(serviceError); 
   } 
 
   static log = (message, data) => { 
      const outputElement = document.getElementById("output"); 
      if (outputElement) { 
         const time = (new Date()).toLocaleTimeString(); 
         const textElement = document.createElement("p"); 
         textElement.innerHTML = (outputElement.childElementCount + 1) + " [" + time + "]: " + message; 
         outputElement.insertBefore(textElement, outputElement.firstChild); 
      } 
 
      if (!data) 
         console.log(message); 
      else 
         console.log(message, data); 
   } 
 
   static initFactory = () => { 
      // To communicate with the DocumentsService, it must be running! 
      // Change these parameters to match the path to the service. 
      lt.Document.DocumentFactory.serviceHost = "http://localhost:40000"; 
      lt.Document.DocumentFactory.servicePath = ""; 
      lt.Document.DocumentFactory.serviceApiPath = "api"; 
   } 
}

<!doctype html> 
<html lang="en"> 
<title>Document Example | Rotate</title> 
 
<head> 
   <script src="https://code.jquery.com/jquery-2.2.4.min.js" 
      integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script> 
 
   <script src="../../LT/Leadtools.js"></script> 
   <script src="../../LT/Leadtools.Controls.js"></script> 
   <script src="../../LT/Leadtools.Annotations.Engine.js"></script> 
   <script src="../../LT/Leadtools.Annotations.Designers.js"></script> 
   <script src="../../LT/Leadtools.Annotations.Rendering.Javascript.js"></script> 
   <script src="../../LT/Leadtools.Annotations.Automation.js"></script> 
   <script src="../../LT/Leadtools.ImageProcessing.Main.js"></script> 
   <script src="../../LT/Leadtools.ImageProcessing.Color.js"></script> 
   <script src="../../LT/Leadtools.ImageProcessing.Core.js"></script> 
   <script src="../../LT/Leadtools.ImageProcessing.Effects.js"></script> 
   <script src="../../LT/Leadtools.Document.js"></script> 
   <script src="../../LT/Leadtools.Document.Viewer.js"></script> 
   <link rel="stylesheet" type="text/css" href="../../css/examples.css"> 
 
   <!-- All demo files are bundled and appended to the window --> 
   <script src="../../bundle.js" type="text/javascript"></script> 
</head> 
 
<body> 
   <div> 
      <button type="button" id="exampleButton">Run Example</button> 
   </div> 
   <div id="output"></div> 
   <div> 
      <img id="img" /> 
   </div> 
</body> 
 
<script> 
   window.onload = () => { 
      const example = new window.examples.LEADDocument.Rotate(); 
      example.run("exampleButton"); 
   }; 
</script> 
</html>