订阅文档查看器注释中的运行事件- HTML5 JavaScript

本教程展示了如何使用LEADTOOLS SDK在HTML5 JS应用程序的文档查看器中订阅注释运行事件。

所需的知识

熟悉创建项目和使用HTML5/JS文档查看器的基本步骤添加引用和设置许可证- HTML5 JavaScript而且在文档查看器中显示文件教程，在工作之前订阅文档查看器注释中的运行事件- HTML5 JavaScript教程。

本教程将使用http服务器，用于运行静态文件服务器的控制台命令。安装http服务器第一次安装node . js然后安装http服务器．

• https://nodejs.org/en/download/
• https://www.npmjs.com/package/http-server

创建项目并添加LEADTOOLS引用

中创建的项目的副本开始以编程方式向文档查看器添加注释教程。如果该项目不可用，请按照该教程中的步骤创建它。

所需要的参考资料取决于项目的目的。可以通过添加引用. js档案位于< INSTALL_DIR > \ LEADTOOLS21 \ 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

确保将这些文件复制到项目的文件中自由文件夹中。

有关应用程序需要哪些JS文件的完整列表，请参阅你的申请所包含的文件

设置License文件

许可证解锁项目所需的特性。它必须在调用任何工具箱函数之前设置。有关包括针对不同平台的教程的详细信息，请参阅设置运行时License．

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

• 评估许可证，下载评估工具包时获得。它允许对工具包进行评估。
• 部署许可证。如果需要部署license文件和开发人员密钥，请参见获取License．

请注意

中更详细地介绍了添加LEADTOOLS引用和设置许可添加引用和设置许可证- HTML5 JavaScript教程。

订阅注解运行事件

创建项目、添加依赖项、许可证集和以编程方式向文档查看器添加注释教程代码添加，编码可以开始了。

打开app.js位于项目文件夹中的文件。在loadDefaultDoc函数，按如下所示修改代码，以订阅文档查看器对象中注释的运行事件。

loadDefaultDoc = (documentViewer, interactiveSelect) => {//加载PDF文档常量url =“https://demo.leadtools.com/images/pdf/leadtools.pdf”；lt.Document.DocumentFactory.loadFromUri (url,零）.done((doc) => {常量Ready = () => {常量panZoom = lt.Document.Viewer.DocumentViewerCommands.interactivePanZoom;interactiveSelect。value = panZoom;viewer.commands.run (panZoom零）如果（这.callback)这.callback(观众);｝医生。isReadOnly =假；doc.annotations.getAnnotations (真正的）.done (函数(annContainers) {let annContainer = annContainer [0];let rectangleObj =新lt.Annotations.Engine.AnnRectangleObject ();rectangleObj。rect = lt.LeadRectD。创建(100,100,600,600);rectangleObj。fill = lt.Annotations.Engine.AnnSolidColorBrush.create(“透明”）;rectangleObj。标签=“specialtag”；annContainer.children.add (rectangleObj);doc.annotations.setAnnotations annContainers .done (函数（）{viewer.setDocument (doc);})；})；viewer.operation。Add ((_sender, e) => {如果(e.operation == lt.Document.Viewer.DocumentViewerOperation.createAutomation && e.isPostOperation) {viewer.annotations.automation。Add_run ((_sender, e) => {如果(e.get_operationStatus() === lt.Annotations.Engine.AnnDesignerOperationStatus.end)//在这里添加代码，当你想要的对象被单击时执行一些操作alert (“Hello World”）;})；｝})；viewer.annotations.automationManager.userMode = lt.Annotations.Engine.AnnUserMode.run;如果(医生。isStructureSupported && !doc.structure.parse ().done(准备好了)fail (ViewerInitializer.showServiceError);其他的准备好();})fail (ViewerInitializer.showServiceError);｝

运行项目

在运行前端HTML5/JS文档查看器之前，运行文档服务。LEADTOOLS SDK安装为以下平台提供了三个文档服务示例:

• net框架
• net核心
• Java

有关如何在前面列出的三个平台中设置和配置文档服务的说明，请参阅开始与文档查看器演示- HTML5 JavaScript教程。

为了本教程的目的，使用了.NET框架文档服务，可以在这里找到它:< INSTALL_DIR > \ LEADTOOLS21 \ \ JS例子\ \ DocumentServiceDotNet \外汇服务．

运行后端文档服务之后，打开命令行和cd进入项目文件夹。使用实例运行静态文件服务器。http服务器

服务器应该启动并运行http://localhost:8080．控制台中应该出现一条消息，指示服务器可用的所有端口。

选择以编程方式添加的AnnRectangleObject对象来触发运行事件。

总结

本教程展示了如何订阅HTML5/JS文档查看器的注释运行事件。

另请参阅

• 运行事件文档188宝金博安卓下载
• LEADTOOLS annrdesignignereventargs188宝金博安卓下载文档
• LEADTOOLS SDK下载链接
• 节点
• http服务器