In This Topic ▼

children Property

Summary

Gets the collection of AnnObjects in this AnnContainer.

Syntax

TypeScript

JavaScript

Object.defineProperty(AnnContainer.prototype, 'children', 
	get: function() 
)

children: AnnObjectCollection; // read-only

Property Value

The collection of AnnObjects contained in this AnnContainer. The default value is an empty collection ready to be used.

Example

AnnContainer.ts

AnnContainer.js

AnnContainer.html

import { EngineHelper } from "../../utilities/EngineHelper"; 
 
export class AnnEngine_AnnContainerExample { 
   constructor() { 
      const helper = new EngineHelper(); 
      helper.run(this.run); 
   } 
 
   run = () => { 
      const inch = 720.0; 
 
      // Create a new annotation container, 8.5 by 11 inches 
      let container: lt.Annotations.Engine.AnnContainer = new lt.Annotations.Engine.AnnContainer(); 
      // Size must be in annotation units (1/720 of an inch) 
      container.size = lt.LeadSizeD.create(8.5 * inch, 11 * inch); 
 
      const showContainer = (message, container) => { 
         let str = message + "\nContainer size: "; 
 
         // Add the size 
         const inch = 720; 
         const width: number = container.size.width / inch; 
         const height: number = container.size.height / inch; 
         str += width + " by " + height + " inches" + "\n"; 
 
         // Add the objects 
         str += "Contains " + container.children.count + " objects(s)\n"; 
         for (let i = 0; i < container.children.count; i++) { 
            const annObj = container.children.item(i); 
 
            str += "Object: " + annObj.get_friendlyName() + " at "; 
            for (let j = 0; j < annObj.get_points().get_count(); j++) { 
               const pt: lt.LeadPointD = annObj.points.item(j); 
               const x: number = pt.x / inch; 
               const y: number = pt.y / inch; 
               str += "(" + x + ", " + y + ") "; 
            } 
 
            str += "\n"; 
         } 
 
         alert(str); 
      } 
 
      // Add a red line object, from 1in 1in to 2in 2in 
      const lineObj: lt.Annotations.Engine.AnnPolylineObject = new lt.Annotations.Engine.AnnPolylineObject(); 
      lineObj.points.add(lt.LeadPointD.create(1 * inch, 1 * inch)); 
      lineObj.points.add(lt.LeadPointD.create(2 * inch, 2 * inch)); 
      lineObj.stroke = lt.Annotations.Engine.AnnStroke.create(lt.Annotations.Engine.AnnSolidColorBrush.create("red"), lt.LeadLengthD.create(1)); 
      container.children.add(lineObj); 
 
      // Add a blue on yellow rectangle from 3in 3in to 4in 4in 
      const rectObj: lt.Annotations.Engine.AnnRectangleObject = new lt.Annotations.Engine.AnnRectangleObject(); 
      rectObj.rect = lt.LeadRectD.create(3 * inch, 3 * inch, 1 * inch, 1 * inch); 
      rectObj.stroke = lt.Annotations.Engine.AnnStroke.create(lt.Annotations.Engine.AnnSolidColorBrush.create("blue"), lt.LeadLengthD.create(1)); 
      rectObj.fill = lt.Annotations.Engine.AnnSolidColorBrush.create("yellow"); 
      container.children.add(rectObj); 
 
      // Show the container 
      showContainer("Before save", container); 
 
      // Create the codecs object to save and load annotations 
      const codecs: lt.Annotations.Engine.AnnCodecs = new lt.Annotations.Engine.AnnCodecs(); 
 
      // Save the container 
      const xmlData: string = codecs.save(container, lt.Annotations.Engine.AnnFormat.annotations, null, 1); 
 
      // delete the container 
      container = null; 
 
      // Show information about the data we just saved 
      const info: lt.Annotations.Engine.AnnCodecsInfo = codecs.getInfo(xmlData); 
      let message: string; 
      if (info.format == lt.Annotations.Engine.AnnFormat.annotations) { 
         message = "Version: "; 
         message += info.version; 
         message += " No. of pages: "; 
         message += info.pages.length; 
         message += " page nos: "; 
         for (let i = 0; i < info.pages.length; i++) { 
            message += info.pages[i] + " "; 
         } 
      } 
      else { 
         message = "Invalid annotations data"; 
      } 
 
      alert(message); 
 
      // Load the container we just saved 
      container = codecs.load(xmlData, 1); 
 
      // Show it 
      showContainer("After load", container); 
   } 
}

import { EngineHelper } from "../../utilities/EngineHelper"; 
 
export class AnnEngine_AnnContainerExample { 
   constructor() { 
      const helper = new EngineHelper(); 
      helper.run(this.run); 
   } 
 
   run = () => { 
      const inch = 720.0; 
 
      // Create a new annotation container, 8.5 by 11 inches 
      let container = new lt.Annotations.Engine.AnnContainer(); 
      // Size must be in annotation units (1/720 of an inch) 
      container.size = lt.LeadSizeD.create(8.5 * inch, 11 * inch); 
 
      const showContainer = (message, container) => { 
         let str = message + "\nContainer size: "; 
 
         // Add the size 
         const inch = 720; 
         const width = container.size.width / inch; 
         const height = container.size.height / inch; 
         str += width + " by " + height + " inches" + "\n"; 
 
         // Add the objects 
         str += "Contains " + container.children.count + " objects(s)\n"; 
         for (let i = 0; i < container.children.count; i++) { 
            const annObj = container.children.item(i); 
 
            str += "Object: " + annObj.get_friendlyName() + " at "; 
            for (let j = 0; j < annObj.get_points().get_count(); j++) { 
               const pt = annObj.points.item(j); 
               const x = pt.x / inch; 
               const y = pt.y / inch; 
               str += "(" + x + ", " + y + ") "; 
            } 
 
            str += "\n"; 
         } 
 
         alert(str); 
      } 
 
      // Add a red line object, from 1in 1in to 2in 2in 
      const lineObj = new lt.Annotations.Engine.AnnPolylineObject(); 
      lineObj.points.add(lt.LeadPointD.create(1 * inch, 1 * inch)); 
      lineObj.points.add(lt.LeadPointD.create(2 * inch, 2 * inch)); 
      lineObj.stroke = lt.Annotations.Engine.AnnStroke.create(lt.Annotations.Engine.AnnSolidColorBrush.create("red"), lt.LeadLengthD.create(1)); 
      container.children.add(lineObj); 
 
      // Add a blue on yellow rectangle from 3in 3in to 4in 4in 
      const rectObj = new lt.Annotations.Engine.AnnRectangleObject(); 
      rectObj.rect = lt.LeadRectD.create(3 * inch, 3 * inch, 1 * inch, 1 * inch); 
      rectObj.stroke = lt.Annotations.Engine.AnnStroke.create(lt.Annotations.Engine.AnnSolidColorBrush.create("blue"), lt.LeadLengthD.create(1)); 
      rectObj.fill = lt.Annotations.Engine.AnnSolidColorBrush.create("yellow"); 
      container.children.add(rectObj); 
 
      // Show the container 
      showContainer("Before save", container); 
 
      // Create the codecs object to save and load annotations 
      const codecs = new lt.Annotations.Engine.AnnCodecs(); 
 
      // Save the container 
      const xmlData = codecs.save(container, lt.Annotations.Engine.AnnFormat.annotations, null, 1); 
 
      // delete the container 
      container = null; 
 
      // Show information about the data we just saved 
      const info = codecs.getInfo(xmlData); 
      let message; 
      if (info.format == lt.Annotations.Engine.AnnFormat.annotations) { 
         message = "Version: "; 
         message += info.version; 
         message += " No. of pages: "; 
         message += info.pages.length; 
         message += " page nos: "; 
         for (let i = 0; i < info.pages.length; i++) { 
            message += info.pages[i] + " "; 
         } 
      } 
      else { 
         message = "Invalid annotations data"; 
      } 
 
      alert(message); 
 
      // Load the container we just saved 
      container = codecs.load(xmlData, 1); 
 
      // Show it 
      showContainer("After load", container); 
   } 
}

<!doctype html> 
<html lang="en"> 
<title>AnnContainer Example | AnnContainer</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.Annotations.BatesStamp.js"></script> 
   <script src="../../LT/Leadtools.Demos.js"></script> 
   <script src="../../LT/Leadtools.Demos.Annotations.js"></script> 
   <style> 
      #imageViewerDiv { 
         border: 1px solid #000000; 
         width: 800px; 
         height: 800px; 
         background-color: #7F7F7F; 
      } 
   </style> 
   <!-- All demo files are bundled and appended to the window --> 
   <script src="../../bundle.js" type="text/javascript"></script> 
</head> 
 
<body> 
   <p>Either Pan/Zoom or Annotations mode. In annotations mode, draw new objects or edit them.</p> 
   <div> 
      <select id="currentObjectIdSelect"></select> 
   </div> 
   <div> 
      <input type="button" id="exampleButton" value="Example" /> 
      <label id="exampleLabel" /> 
   </div> 
   <div id="imageViewerDiv" /> 
</body> 
 
<script> 
   window.onload = () => new window.examples.AnnContainer.AnnContainerExample(); 
</script> 
</html>

Requirements

Target Platforms

Reference

AnnContainer Class

AnnContainer Members

Leadtools.Annotations.Engine Namespace

Download our FREE evaluation

Help Version 22.0.2023.1.31

Leadtools.Annotations.Engine Assembly

Introduction

Getting Started

Namespaces

Leadtools.Annotations.Engine Namespace

Assemblies