在这个话题▼

订阅文档查看器的注释工具提示事件——HTML5 JavaScript

本教程展示如何订阅的注释工具提示事件在HTML5 / JS主题是使用LEADTOOLS SDK。

概述
总结	本教程介绍了如何订阅的注释`工具提示`事件在HTML5 / JS`主题是`。
完成时间	30分钟
Visual Studio项目	下载教程项目(4 KB)
平台	JS的Web应用程序
IDE	Visual Studio代码
开发许可	下载LEADTOOLS

所需的知识

熟悉的基本步骤,创建一个项目并使用HTML5 / JS文件查看器通过审查添加引用和设置许可证——HTML5 JavaScript和注释以编程方式添加到文档查看器教程,在工作之前以编程方式添加注释文档查看器——HTML5 JavaScript教程。

本教程使用了http服务器控制台命令,运行一个静态文件服务器。安装http服务器第一次安装node . js然后安装http服务器。

创建项目并添加LEADTOOLS引用

从项目中创建的副本注释以编程方式添加到文档查看器教程。如果项目是不可用,按照这个教程中的步骤创建它。

的引用需要取决于项目的目的。可以通过添加引用. js文件位于< INSTALL_DIR > \ LEADTOOLS22 \ Bin \ JS。

对于这个项目,还需要以下引用:

Leadtools.js
Leadtools.Annotations.Automation.js
Leadtools.Annotations.Designer.js
Leadtools.Annotations.Engine.js
Leadtools.Annotations.Rendering.JavaScript.js
Leadtools.Controls.js
Leadtools.Document.js
Leadtools.Document.Viewer.js
Leadtools.ImageProcessing.Main.js
Leadtools.ImageProcessing.Color.js
Leadtools.ImageProcessing.Core.js
Leadtools.ImageProcessing.Effects.js

确保这些文件复制到项目的自由文件夹和导入它们index . html文件。

对于一个完整的列表的JS应用程序所需文件,请参考文件包含在您的应用程序

设置许可文件

许可解锁项目需要的特性。它必须设置工具箱函数被调用之前。细节包括教程不同的平台,请参考设置一个运行时许可。

有两种类型的运行时许可证:

评估许可,评估工具包时下载获得。它允许评估工具包。
部署许可证。如果部署许可证文件和开发人员的关键是需要的,请参考获得许可证。

请注意

添加LEADTOOLS引用和设置许可中会详细介绍添加引用和设置许可证——HTML5 JavaScript教程。

文档查看器的AutomationManager启用工具提示

与项目创建、依赖关系添加许可设置,注释以编程方式添加到文档查看器教程代码添加,可以开始编码。

打开app.js文件位于项目文件夹。在订阅工具提示事件,将以下代码行添加到createDocumentViewer函数。

documentViewer.annotations.automationManager。enableToolTip =真正的;

的enableToolTip属性用于启用工具提示以上事件,可以添加初始化的代码行主题是注释。

订阅注释提示事件

在app.js文件,定位loadDefaultDoc函数。修改loadDefaultDoc功能包括以下代码。添加代码订阅工具提示事件,并创建一个自定义标签的注释,鼠标在该时将会出现AnnObject。

interactiveSelect loadDefaultDoc =异步(观众)= > {/ /加载一个PDF文档试一试{常量url =“https://demo.leadtools.com/images/pdf/leadtools.pdf”;让医生=等待lt.Document.DocumentFactory.loadFromUri (url,零)viewer.operation。添加((_sender e) = > {如果(e。= = lt.Document.Viewer.DocumentViewerOperation操作。createAutomation & & e.isPostOperation) {viewer.annotations.automation。add_toolTip ((_sender e) = > {如果(e。annotationObject ! =零){/ /添加代码来创建一个自定义标签将显示当AnnObject上空常量标签= e.annotationObject.labels [“AnnObjectName”];标签。抵消= lt.LeadPointD。创建(-100、-25);标签。offsetHeight =真正的;标签。前景= lt.Annotations.Engine.AnnSolidColorBrush.create (“白色”);标签。背景= lt.Annotations.Engine.AnnSolidColorBrush.create (“rgba (0, 0, 0, 0.5)”);标签。文本=“Hello World”;标签。isVisible =真正的;setTimeout (函数(){标签。isVisible =假;viewer.annotations.automation.invalidate (lt.LeadRectD.empty);},1000);}viewer.annotations.automation.invalidate (lt.LeadRectD.empty);});}});医生。isReadOnly =假;让annContainers =等待doc.annotations.getAnnotations (真正的)让annContainer = annContainers [0];让rectangleObj =新lt.Annotations.Engine.AnnRectangleObject ();rectangleObj。矩形= lt.LeadRectD。创建(100,100,600,600);rectangleObj。填补= lt.Annotations.Engine.AnnSolidColorBrush.create (“透明”);rectangleObj。标签=“specialtag”;annContainer.children.add (rectangleObj);等待doc.annotations.setAnnotations (annContainers)viewer.setDocument (doc);如果(医生。isStructureSupported & & ! doc.structure.isParse) {等待doc.structure.parse ()}其他的{准备好();}常量panZoom = lt.Document.Viewer.DocumentViewerCommands.interactivePanZoom;interactiveSelect。值= panZoom;viewer.commands.run (panZoom零)如果(这.callback)这.callback(观众);}抓(错误){console.error(错误);}}