使用pdf.js时防止同时调用函数? [英] Prevent simultanous function calls when using pdf.js?
问题描述
我使用pdf.js来显示pdf文件,但结果并不好,请查看我的代码。
I use pdf.js to show pdf files, but the result is not good, please have a look at my code.
My codes are as follows.
var aaa = function (pdf, page_number) {
pdf.getPage(page_number).then(function(page) {
var scale = 1.5;
var viewport = page.getViewport(scale);
var canvas = $('.pdf-view')[page_number-1];
var context = canvas.getContext('2d');
canvas.height = viewport.height;
canvas.width = viewport.width;
var renderContext = {
canvasContext: context,
viewport: viewport
};
page.render(renderContext);
});
};
for (var i = 1;i < 51;i++) {
aaa(pdf, i);
if (i !== 50) {
var a = '<canvas data="{{ raw_path }}" class="pdf-view hide" style="margin-bottom:10px;"></canvas>';
$('#file-view #pdf').append(a);
}
}
有一个循环,然后有50个函数( aaa
)同时执行。效果是灾难性的,我的电脑卡住了。我想在最后一个功能完成之后立即执行一个函数。
There is a loop, then 50 functions (aaa
) execute at the same time. The effect is disastrous, and my computer gets stuck. I want to excute a function right after the last function excuted very well.
请帮助我改进它。非常感谢。 (对不起,我的英文也是灾难性的。)
Please help me improve it. Thank a lot. (Sorry, my English is disastrous as well.)
推荐答案
避免同时运行单页加载和渲染功能 aaa
,你应该把它的调用移到页面加载的回调 - .then(
part,所以它是递归调用的。然后调用 aaa
只有一次 page_number = 1
。
To avoid simultaneous run of single page load and render function aaa
, you should move its call to callback of the page load - .then(
part so it's called recursively. And then call aaa
function only once with page_number = 1
.
//define page render function
var aaa = function (pdf, page_number) {
pdf.getPage(page_number).then(function(page) {
var scale = 1.5;
var viewport = page.getViewport(scale);
var canvas = $('.pdf-view')[page_number-1];
var context = canvas.getContext('2d');
canvas.height = viewport.height;
canvas.width = viewport.width;
var renderContext = {
canvasContext: context,
viewport: viewport
};
page.render(renderContext);
if (i < 50) {
//render first 50 pages but not all pages except #50
aaa(pdf, i);
i++;
}
});
};
//pre-generate 50 canvases
var docFragment = document.createDocumentFragment();
for (var i = 1;i < 51;i++) {
var c = document.createElement("canvas");
$(c).data({{ raw_path }});
$(c).addClass('pdf-view hide');
$(c).css('margin-bottom', '10px');
docfrag.appendChild(c);
}
$('#file-view #pdf').append(docfrag);
//call render
var i = 1;
aaa(pdf, i);
这篇关于使用pdf.js时防止同时调用函数?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!