如何解决想要捕获WebViewer中带有/不带有注释的文档加载开始和结束时间
查看以下链接后: 1-https://www.pdftron.com/documentation/web/guides/wv-events/->一般显示如何与WebViewer事件进行交互的指南 2-https://www.pdftron.com/api/web/CoreControls.DocumentViewer.html#toc99__anchor->文档查看器触发的所有事件的列表。我相信您需要的所有活动都在那里。
我做了以下编码示例,但是根本无法获得正确的结果。
<h:outputScript library="js" name="WebViewer/webviewer.js" target="head"/>
<script type="text/javascript">
var myWebViewer;
$(document).ready(function() {
$("#viewer").width(#{dmsAnnotationBean.viewWidth});
$("#viewer").height(#{dmsAnnotationBean.viewHeight});
var viewerElement = document.getElementById("viewer");
console.log("before initial");
myWebViewer = new PDFTron.WebViewer({
l: "Agency(xxx.hk/en):ENTERP:SFO Viewer::B:AMS(20190308):BB6765701FF77AD00333527820613FFDFBFB3A4B9DF54DC2549540B604F431F5C7",path: "#{dmsAnnotationBean.webviewerJsPath}",type: "html5",documentType: "pdf",enableAnnotations: true,enableReadOnlyMode: #{dmsAnnotationBean.readOnly},serverUrl: "#{dmsAnnotationBean.servletUrl}/WebViewerAnnotationServlet",annotationUser: "#{dmsAnnotationBean.userName}",annotationAdmin: false,documentId: "#{dmsAnnotationBean.did}",config: "#{dmsAnnotationBean.webviewerJsPath}/config.js",fullAPI: true,ui: 'legacy'
},viewerElement);
$("#viewer").on('ready',() => {
console.log("on #viewer ready");
loadDoc();
timeLogA();
// timeLogA([{name:'timelogP1',value:'on #viewer Ready'}]); console.log(“在#viewer上准备好结束”); });
$("#viewer").on('documentLoaded',() => {
console.log("on #viewer documentLoaded");
timeLogA( [{ name : 'timelogP1',value : 'on #viewer ready'}] );
console.log("end #viewer documentLoaded");
//updateUserDropDown();
});
$("#viewer").on('beginRendering',() => {
console.log("on #viewer begin rendering");
timeLogA( [{ name : 'timelogP1',value : 'on #viewer begin rendering'}] );
console.log("end #viewer begin rendering");
});
myWebViewer.getInstance().docViewer.on('finishedRendering',function(event) {
console.log("on #viewer finish rendering");
timeLogA( [{ name : 'timelogP1',value : 'on #viewer finish rendering'}] );
});
});
</script>
<h:form id="pdfAnnotationForm" >
<p:remoteCommand name="timeLogA" actionListener="#{dmsAnnotationBean.logTime}" />
...
结果如下:
- 只有在就绪事件下,才能通过timeLogA函数成功写入时间日志
- 无法成功调用其他事件,例如documentLoaded,beginRendering,finishRendering。即。无法在控制台日志和服务器日志中显示任何事件消息。
如果我使用错误的方法或编码来记录时间日志,请给我一些示例。
谢谢! 史蒂夫
解决方法
您可以执行与框架无关的代码段之类的操作:
let start = 0;
Webviewer(...).then(instance => {
const { docViewer } = instance;
const readyEnd = performance.now();
console.log('Ready',readyEnd - start);
start = readyEnd;
docViewer.on('documentLoaded',() => {
const end = performance.now();
console.log('Document Loaded',end - start);
start = end;
});
docViewer.on('annotationsLoaded',() => {
const end = performance.now();
console.log('Annotations Loaded',end - start);
start = end;
});
});
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。